एक कस्टम UIView को कैसे आकर्षित करें जो सिर्फ एक सर्कल है - आईफोन ऐप

Question

मैं एक कस्टम UIView को चित्रित करने के बारे में कैसे जाऊं जो सचमुच केवल एक गेंद (2 डी सर्कल) है? क्या मैं सिर्फ drawRect विधि को ओवरराइड करूँगा? और क्या कोई मुझे नीली सर्कल बनाने के लिए कोड दिखा सकता है?

साथ ही, क्या कक्षा के भीतर उस दृश्य के फ्रेम को बदलना ठीक होगा? या मुझे फ्रेम को एक अलग वर्ग से बदलने की ज़रूरत है?

Answer 1

आप 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]; 

Answer 2

मैं सिर्फ drawRect विधि ओवरराइड हैं (सिर्फ एक गेंद के चारों ओर उछल स्थापित करने के लिए कोशिश कर रहा है)?

हाँ:

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

इसके अलावा, यह वर्ग के भीतर ही उस दृश्य के फ्रेम को बदलने के लिए ठीक हो सकता है?

आदर्श रूप से नहीं, लेकिन आप कर सकते हैं।

या क्या मुझे फ्रेम को एक अलग वर्ग से बदलने की ज़रूरत है?

मैं माता-पिता को उस पर नियंत्रण करने देता हूं।

Answer 3

यहाँ 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; 

Answer 4

मास्क का उपयोग करके सर्कल (और अन्य आकार) ड्राइंग के आने का एक और तरीका है। आप सर्किल या अन्य आकृतियों को आकर्षित करते हैं, सबसे पहले, आपको आवश्यक आकारों के मास्क बनाते हैं, दूसरा, अपने रंग के वर्ग प्रदान करते हैं और तीसरे, रंग के उन वर्गों पर मुखौटा लागू करते हैं। नया कस्टम सर्कल या अन्य आकार प्राप्त करने के लिए आप या तो मुखौटा या रंग बदल सकते हैं। उपरोक्त कोड का आउटपुट ऊपर है।

#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 

Answer 5

एक तेज विस्तार के साथ मेरे योगदान:

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

बस फोन myView.asCircle()

Answer 6

स्विफ्ट 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 

     } 

Answer 7

स्विफ्ट 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() 
    } 


} 

Answer 8

स्विफ्ट 3 - कस्टम क्लास, पुन: उपयोग करने में आसान। यह यूआई बिल्डर

import UIKit 

@IBDesignable 
class CircleBackgroundView: UIView { 

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

}