So erstellen Sie eine kreisförmige UIView

Question

Ich möchte eine UIView oder UIImageView erstellen, die ein Kreis ist. Oder ein Kreis, den ich die Größe eines Schiebereglers und die Farbe von mit einem Pickerview ändern kann.

Answer 1

Ich kann Ihnen zumindest eine Abkürzung zum Zeichnen von Kreisen von willkürlicher Größe zeigen. Kein OpenGL, keine Kerngrafikzeichnung erforderlich.

Importieren Sie das Quartzcore -Framework, um Zugriff auf die zu erhalten .Eckenradius Eigenschaft Ihres UIView oder UIImageView.

#import <QuartzCore/QuartzCore.h>

Fügen Sie es auch manuell zum Frameworks -Ordner Ihres Projekts hinzu.

Fügen Sie diese Methode Ihrem Ansichtscontroller oder wo immer Sie sie benötigen:

-(void)setRoundedView:(UIImageView *)roundedView toDiameter:(float)newSize;
{
    CGPoint saveCenter = roundedView.center;
    CGRect newFrame = CGRectMake(roundedView.frame.origin.x, roundedView.frame.origin.y, newSize, newSize);
    roundedView.frame = newFrame;
    roundedView.layer.cornerRadius = newSize / 2.0;
    roundedView.center = saveCenter;
}

Um es zu benutzen, übergeben Sie es einfach a UIImageView und einen Durchmesser. In diesem Beispiel wird davon ausgegangen Aussicht. Es sollte eine haben Hintergrundfarbe Setzen Sie, damit Sie es sehen können.

circ.clipsToBounds = YES;
[self setRoundedView:circ toDiameter:100.0];

Das geht nur um UIImageviews Aber Sie können es auf jeden verallgemeinern UIView.

HINWEIS: Da iOS 7, müssen CliptoBounds ja.

Answer 2

// For those looking to round the corners of an image view
imageView.layer.cornerRadius = imageView.bounds.size.width/2;
imageView.layer.masksToBounds = YES;

Answer 3

Wenn jemand nach einem schnellen Äquivalent als unten sucht, ist die Antwort (xcode7.2):

(Damit dies die Höhe und die Breite der Arbeit haben, muss gleich sein.)

extension UIView {
    func makeCircular() {
        self.layer.cornerRadius = min(self.frame.size.height, self.frame.size.width) / 2.0
        self.clipsToBounds = true
    }
}

Answer 4

Keine Notwendigkeit für Grafikanrufe. Stellen Sie einfach den Eckradius auf die Breite / 2. Setzen Sie dies auf jedem visuellen Objekt, dh UI Element

Answer 5

Wie in einigen Kommentaren erwähnt, erleichtert @IBDesignable dies jetzt viel einfacher, sodass Sie den Interface Builder verwenden können, um Ihre abgerundete UIImageView zu konfigurieren.

Erstellen Sie zuerst eine Klasse mit dem Namen RoundedImageView.swift und fügen Sie diesen Code dazu ein:

import UIKit

@IBDesignable public class RoundedImageView: UIImageView {

    override public func layoutSubviews() {
        super.layoutSubviews()

        //hard-coded this since it's always round
        layer.cornerRadius = 0.5 * bounds.size.width
    }
}

Wählen Sie die UIImageView in InterfaceBuilder aus und ändern Sie die Klasse von UIImageView in die benutzerdefinierte RoundedimageView:

Satz Clip to Bounds zu wahr (oder das Bild erstreckt sich über den Kreis hinaus):

Es sollte sich jetzt genau dort im InterfaceBuilder umrunden, was ziemlich raffiniert ist. Stellen Sie sicher, dass Sie die Breite und Höhe auf die gleichen Werte einstellen, oder es wird wie ein Zeppelin geformt!

Answer 6

Sie müssen eine transparente UIView (Hintergrundfarbe Alpha von 0) erstellen und dann in seinem DrawRect: Zeichnen Sie Ihren Kreis mit Corgraphics -Aufrufen. Sie können auch die Ebene der Ansicht bearbeiten und ihr einen Correerradius geben.