Cara menggambar UIView khusus yang hanya sebuah lingkaran - aplikasi iPhone

Bagaimana saya bisa menggambar UIView khusus yang benar-benar hanya bola (lingkaran 2D)? Apakah saya akan mengganti metode drawRect? Dan bisakah seseorang menunjukkan kode untuk menggambar lingkaran biru?

Juga, apakah tidak apa-apa untuk mengubah bingkai pandangan itu di dalam kelas itu sendiri? Atau apakah saya perlu mengubah frame dari kelas yang berbeda?

(Hanya mencoba mengatur bola memantul)

Anda dapat menggunakan QuartzCore dan melakukan sesuatu ini -

self.circleView = [[UIView alloc] initWithFrame:CGRectMake(10,20,100,100)];
self.circleView.alpha = 0.5;
self.circleView.layer.cornerRadius = 50;  // half the width/height
self.circleView.backgroundColor = [UIColor blueColor];

Apakah saya akan mengganti metode drawRect?

Iya:

- (void)drawRect:(CGRect)rect
{
    CGContextRef ctx = UIGraphicsGetCurrentContext();
    CGContextAddEllipseInRect(ctx, rect);
    CGContextSetFillColor(ctx, CGColorGetComponents([[UIColor blueColor] CGColor]));
    CGContextFillPath(ctx);
}

Juga, apakah tidak apa-apa untuk mengubah bingkai pandangan itu di dalam kelas itu sendiri?

Idealnya tidak, tetapi Anda bisa.

Atau apakah saya perlu mengubah frame dari kelas yang berbeda?

Saya akan membiarkan orang tua mengendalikan itu.

Berikut cara lain dengan menggunakan UIBezierPath (mungkin sudah terlambat ^^) Buat lingkaran dan tutupi UIView dengannya, sebagai berikut:

UIView *view = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 200, 200)];
view.backgroundColor = [UIColor blueColor];

CAShapeLayer *shape = [CAShapeLayer layer];
UIBezierPath *path = [UIBezierPath bezierPathWithArcCenter:view.center radius:(view.bounds.size.width / 2) startAngle:0 endAngle:(2 * M_PI) clockwise:YES];
shape.path = path.CGPath;
view.layer.mask = shape;

Kontribusi saya dengan ekstensi Swift:

extension UIView {
    func asCircle() {
        self.layer.cornerRadius = self.frame.width / 2;
        self.layer.masksToBounds = true
    }
}

Panggil saja myView.asCircle()

Swift 3 - kelas khusus, mudah digunakan kembali. Menggunakan backgroundColorset in builder UI

import UIKit

@IBDesignable
class CircleBackgroundView: UIView {

    override func layoutSubviews() {
        super.layoutSubviews()
        layer.cornerRadius = bounds.size.width / 2
        layer.masksToBounds = true
    }

}

Kelas Swift 3 :

import UIKit

class CircleView: UIView {

    override func draw(_ rect: CGRect) {
        guard let context = UIGraphicsGetCurrentContext() else {return}

        context.addEllipse(in: rect)
        context.setFillColor(.blue.cgColor)
        context.fillPath()
    }           
}

Cara lain untuk mendekati menggambar lingkaran (dan bentuk lain) adalah dengan menggunakan topeng. Anda menggambar lingkaran atau bentuk lain dengan, pertama, membuat topeng dari bentuk yang Anda butuhkan, kedua, menyediakan kotak warna Anda dan, ketiga, menerapkan topeng ke kotak warna itu. Anda dapat mengubah topeng atau warna untuk mendapatkan lingkaran khusus atau bentuk lainnya.

#import <QuartzCore/QuartzCore.h>

@interface ViewController ()
@property (weak, nonatomic) IBOutlet UIView *area1;
@property (weak, nonatomic) IBOutlet UIView *area2;
@property (weak, nonatomic) IBOutlet UIView *area3;
@property (weak, nonatomic) IBOutlet UIView *area4;

@end

@implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];

    self.area1.backgroundColor = [UIColor blueColor];
    [self useMaskFor: self.area1];

    self.area2.backgroundColor = [UIColor orangeColor];
    [self useMaskFor: self.area2];

    self.area3.backgroundColor = [UIColor colorWithRed: 1.0 green: 0.0 blue: 0.5 alpha:1.0];
    [self useMaskFor: self.area3];

    self.area4.backgroundColor = [UIColor colorWithRed: 1.0 green: 0.0 blue: 0.5 alpha:0.5];
    [self useMaskFor: self.area4];        
}

- (void)useMaskFor: (UIView *)colorArea {        
    CALayer *maskLayer = [CALayer layer];
    maskLayer.frame = colorArea.bounds;
    UIImage *maskImage = [UIImage imageNamed:@"cirMask.png"];
    maskLayer.contents = (__bridge id)maskImage.CGImage;
    colorArea.layer.mask = maskLayer;
}

@end

Ini adalah output dari kode di atas:

Ada alternatif lain untuk orang malas. Anda bisa mengatur layer.cornerRadius jalur kunci untuk tampilan Anda di Interface Builder . Misalnya, jika tampilan Anda memiliki lebar = tinggi 48 , setel layer.cornerRadius = 24:

Namun, ini hanya berfungsi jika Anda memiliki ukuran tampilan statis (width/height is fixed)dan tidak menunjukkan lingkaran di pembuat antarmuka.

Swift 3 - Xcode 8.1

@IBOutlet weak var myView: UIView!

override func viewDidLoad() {
    super.viewDidLoad() 

    let size:CGFloat = 35.0
    myView.bounds = CGRect(x: 0, y: 0, width: size, height: size)
    myView.layer.cornerRadius = size / 2
    myView.layer.borderWidth = 1
    myView.layer.borderColor = UIColor.Gray.cgColor        
}