iOS Rendi la vista arrotondata


Esempio

Per rendere UIView arrotondato, specifica un cornerRadius per il layer della vista.

Ciò vale anche per qualsiasi classe che eredita da UIView , come UIImageView .

programmazione

codice SWIFT

someImageView.layoutIfNeeded()
someImageView.clipsToBounds = true
someImageView.layer.cornerRadius = 10

Codice Objective-C

[someImageView layoutIfNeeded];
someImageView.clipsToBounds = YES;
someImageView.layer.cornerRadius = 10;

Esempio

//Swift code
topImageView.layoutIfNeeded()
bottomImageView.layoutIfNeeded()
topImageView.clipsToBounds = true
topImageView.layer.cornerRadius = 10
bottomImageView.clipsToBounds = true
bottomImageView.layer.cornerRadius = bottomImageView.frame.width / 2

//Objective-C code
[topImageView layoutIfNeeded]
[bottomImageView layoutIfNeeded];
topImageView.clipsToBounds = YES;
topImageView.layer.cornerRadius = 10;
bottomImageView.clipsToBounds = YES;
bottomImageView.cornerRadius = CGRectGetWidth(bottomImageView.frame) / 2;

Ecco il risultato, che mostra l'effetto della vista arrotondata utilizzando il raggio dell'angolo specificato:

Esempio

Nota

Per fare questo è necessario includere il framework QuartzCore.

 #import <QuartzCore/QuartzCore.h>

Configurazione Storyboard

Un effetto di visualizzazione arrotondato può anche essere ottenuto non-programmatically impostando le proprietà corrispondenti in Storyboard .

inserisci la descrizione dell'immagine qui

Poiché le proprietà del layer non sono esposte in Storyboard, è necessario modificare l'attributo cornerRadius tramite la sezione Attributi runtime definiti dall'utente.

inserisci la descrizione dell'immagine qui

Estensione rapida

È possibile utilizzare questa pratica estensione per applicare la vista arrotondata purché abbia la stessa larghezza e altezza.

extension UIView {
    @discardableResult
    public func setAsCircle() -> Self {
        self.clipsToBounds = true
        let frameSize = self.frame.size
        self.layer.cornerRadius = min(frameSize.width, frameSize.height) / 2.0
        return self
    }
}

Per usarlo:

yourView.setAsCircle()