Как я буду рисовать пользовательский UIView, который является буквально просто шаром (2D-кружок)? Могу ли я просто переопределить метод drawRect? И может ли кто-нибудь показать мне код для рисования синего круга?
Кроме того, было бы хорошо изменить рамку этого представления внутри самого класса? Или мне нужно изменить кадр из другого класса?
(просто пытается настроить мяч, отскакивающий вокруг)
Вы можете использовать QuartzCore и сделать что-то такое -
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];
Я бы просто переопределил drawRect метод?
Да:
- (void)drawRect:(CGRect)rect
{
CGContextRef ctx = UIGraphicsGetCurrentContext();
CGContextAddEllipseInRect(ctx, rect);
CGContextSetFillColor(ctx, CGColorGetComponents([[UIColor blueColor] CGColor]));
CGContextFillPath(ctx);
}
Кроме того, было бы хорошо изменить кадр этого представления внутри самого класса?
В идеале нет, но вы могли бы.
Или мне нужно изменить кадр из другого класса?
Я бы разрешил родительскому элементу управления.
Вот еще один способ использования UIBezierPath (возможно, слишком поздно ^^) Создайте вокруг него круг и маску UIView, как показано ниже:
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;
Мой вклад с расширением Swift:
extension UIView {
func asCircle() {
self.layer.cornerRadius = self.frame.width / 2;
self.layer.masksToBounds = true
}
}
Просто вызовите myView.asCircle()
Swift 3 - пользовательский класс, легко использовать повторно. Он использует backgroundColor установленный в UI Builder
import UIKit
@IBDesignable
class CircleBackgroundView: UIView {
override func layoutSubviews() {
super.layoutSubviews()
layer.cornerRadius = bounds.size.width / 2
layer.masksToBounds = true
}
}
Свифт 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()
}
}
Другой способ приблизиться к рисованию кругов (и других фигур) - использовать маски. Вы рисуете круги или другие фигуры, во-первых, делая маски нужных вам фигур, во-вторых, создавая квадраты вашего цвета и, в-третьих, применяете маски к этим квадратам цвета. Вы можете изменить либо маску, либо цвет, чтобы получить новый пользовательский круг или другую форму.
#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
Вот вывод кода выше:
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
}
Лучше всего использовать Core Graphics, как сказал Стив, особенно если вы хотите, чтобы ваш круг выглядел гладким и отполированным. Вот его решение в Swift:
override func draw(_ rect: CGRect) {
if let context = UIGraphicsGetCurrentContext() {
context.addEllipse(in: rect)
context.setFillColor(UIColor.blue.cgColor)
context.fillPath()
}
}
Есть другая альтернатива для ленивых людей. Вы можете установить путь к ключу layer.cornerRadius для своего представления в Интерфейсном Разработчике. Например, если ваш вид имеет ширину = высота 48, установите layer.cornerRadius = 24:
Однако это работает только в том случае, если у вас статический размер представления (width/height is fixed) и в построителе интерфейса круг не отображается.