2013-06-24 7 views
6

मैं एक नौसिखिया आईओएस प्रोग्रामर हूं। मेरी एक परियोजना में मुझे एक सर्कल बनाने की जरूरत है जिसमें सर्कल के विभिन्न हिस्से को अलग-अलग रंगों से भर दिया जाएगा। मैं आकर्षित कर सकता हूं सर्कल। लेकिन मैं सर्कल के विभिन्न भाग को निर्धारित करने में सक्षम नहीं हूं और उन्हें अलग-अलग रंग से भरता हूं। यह स्पष्ट करने के लिए एक स्क्रीनशॉट है कि मैं क्या आकर्षित करना चाहता हूं। circle with different colorएक सर्कल ड्राइंग, अलग-अलग रंगों के साथ अलग-अलग हिस्सों को भर दिया

एक सहायता की सराहना की जाएगी।

+0

एक पाई चार्ट की तरह लग रहा। इसके लिए [कोर प्लॉट] (http://www.raywenderlich.com/13269/how-to-draw-graphs-with-core-plot-part-1) का उपयोग क्यों न करें? – Amar

+0

लोगों को आपके कार्यान्वयन के लिए उचित उत्तर देने के लिए, आप हमें बता सकते हैं कि क्या आप कोरग्राफिक्स फ़ंक्शंस (उन कार्यों को जो 'CGContext' से शुरू करते हैं) का उपयोग अपने' ड्रारेक्ट 'में करते हैं, या' UIBezierPath' 'स्ट्रोक' विधि, या 'कैशपलेयर' का उपयोग करना। – Rob

+0

@Rob वास्तव में मैं कोर ग्राफिक्स कार्यों जैसे CGContext का उपयोग कर रहा हूं। – sujat

उत्तर

11

आप UIBezierPath का उपयोग कर सकते हैं जिसमें एक विधि addArcWithCenter:radius:startAngle:endAngle:clockwise: है जहां आप त्रिज्या, केंद्र और कोण निर्दिष्ट कर सकते हैं। कोड इस जो हरे रंग में एक चक्र के एक चौथाई के ड्रॉ की तरह लग सकता है:

CGPoint center = CGPointMake(CGRectGetWidth(self.bounds)/2.f, CGRectGetHeight(self.bounds)/2.f); 
CGFloat radius = center.x - 10.f; 

UIBezierPath *portionPath = [UIBezierPath bezierPath]; 
[portionPath moveToPoint:center]; 
[portionPath addArcWithCenter:center radius:radius startAngle:0.f endAngle:M_PI_2 clockwise:YES]; 
[portionPath closePath]; 

[[UIColor greenColor] setFill]; 
[portionPath fill]; 

UIBezierPath *portionPath1 = [UIBezierPath bezierPath]; 
[portionPath1 moveToPoint:center]; 
[portionPath1 addArcWithCenter:center radius:radius startAngle:M_PI_2 endAngle:M_PI clockwise:YES]; 
[portionPath1 closePath]; 

[[UIColor blueColor] setFill]; 
[portionPath1 fill]; 

बेशक आप भी CorePlot की तरह एक पुस्तकालय का उपयोग करने पर विचार कर सकते हैं।

+0

यह एक भाग के लिए पूरी तरह से काम करता है। लेकिन मैं इसे अन्य हिस्सों के साथ कैसे जारी रख सकता हूं ?? मैंने प्रारंभिक कोण और अंत कोण को बदलने वाले अन्य हिस्सों के लिए एक ही प्रक्रिया की है। लेकिन यह काम नहीं कर रहा है – sujat

+0

बस कोण और रंगों के साथ खेलें। केंद्र और त्रिज्या हमेशा एक ही होना चाहिए। आपको प्रत्येक भाग के कोण की गणना करना होगा और फिर शुरुआत और अंतराल को बढ़ाने वाले सभी हिस्सों के माध्यम से लूप करना होगा। – Karl

+0

मैंने यह भी सोचा था। लेकिन मेरे कोण के बारे में कुछ गड़बड़ है। क्या आप मुझे एक और भाग कोण गणना दिखा सकते हैं। मैंने इसे अगले भाग के लिए ऐसा करने की कोशिश की [startAngle: M_PI_2 endAngle: M_PI] – sujat

0

यह त्रिकोणमिति का एक साधारण सवाल है। पाई भाग (पाई स्लाइस प्रतिशत समय 360 डिग्री) के लिए आपको आवश्यक कोण को चित्रित करें, फिर आप केंद्र में चले जाएं। एक उचित कोण पर सर्कल एज के लिए रेखा, आपको आवश्यक कोण कोण के लिए पाई स्लाइस के अगले तरफ चाप, फिर केंद्र में वापस लाइन करें।

वैकल्पिक रूप से, आप पाई चार्ट बनाने के लिए CorePlot का उपयोग कर सकते हैं।

2

हमारे पास 6 वर्ग

CircleViewController.h, CircleViewController.m, GraphView.h, GraphView.h, CirclePart.h, CirclePart.m

CirclePart.h

#import <Foundation/Foundation.h> 
#import <UIKit/UIKit.h> 

@interface CirclePart : NSObject 

@property (nonatomic) CGFloat startDegree; 
@property (nonatomic) CGFloat endDegree; 
@property (nonatomic) UIColor *partColor; 

-(id)initWithStartDegree:(CGFloat)startDegree endDegree:(CGFloat)endDegree partColor:(UIColor*)partColor; 

@end 

CirclePart.m

#import "CirclePart.h" 

@implementation CirclePart 

-(id)initWithStartDegree:(CGFloat)startDegree endDegree:(CGFloat)endDegree partColor:(UIColor*)partColor 
{ 
    self = [super init]; 
    if (self) { 
     self.startDegree = startDegree; 
     self.endDegree = endDegree; 
     self.partColor = partColor; 
    } 
    return self; 
} 

@end 

GraphView.h

#import <UIKit/UIKit.h> 
#import "CirclePart.h" 

@interface GraphView : UIView 

@property (nonatomic) CGPoint centrePoint; 
@property (nonatomic) CGFloat radius; 
@property (nonatomic) CGFloat lineWidth; 
@property (nonatomic, strong) NSArray *circleParts; 

-(id)initWithFrame:(CGRect)frame CentrePoint:(CGPoint)centrePoint radius:(CGFloat)radius lineWidth:(CGFloat)lineWidth circleParts:(NSArray*)circleParts; 

@end 

GraphView.m

#import "GraphView.h" 

@implementation GraphView 

-(id)initWithFrame:(CGRect)frame CentrePoint:(CGPoint)centrePoint radius:(CGFloat)radius lineWidth:(CGFloat)lineWidth circleParts:(NSArray*)circleParts 
{ 
    self = [super initWithFrame:frame]; 
    if (self) { 
     self.centrePoint = centrePoint; 
     self.radius = radius; 
     self.lineWidth = lineWidth; 
     self.circleParts = circleParts; 
    } 
    return self; 
} 

- (void)drawRect:(CGRect)rect { 

    [self drawCircle]; 
} 

- (void)drawCircle { 

    CGContextRef context = UIGraphicsGetCurrentContext(); 
    CGContextSetLineWidth(context, _lineWidth); 

    for(CirclePart *circlePart in _circleParts) 
    { 
     CGContextMoveToPoint(context, _centrePoint.x, _centrePoint.y); 

     CGContextAddArc(context, _centrePoint.x , _centrePoint.y, _radius, [self radians:circlePart.startDegree], [self radians:circlePart.endDegree], 0); 
     CGContextSetFillColorWithColor(context, circlePart.partColor.CGColor); 
     CGContextFillPath(context); 
    } 
} 

-(float) radians:(double) degrees { 
    return degrees * M_PI/180; 
} 


@end 

CircleViewController.h

#import <UIKit/UIKit.h> 

@interface CircleViewController : UIViewController 

@end 

CircleViewController.m

#import "CircleViewController.h" 
#import "GraphView.h" 
#import "CirclePart.h" 

@interface CircleViewController() 

@end 

@implementation CircleViewController 

- (void)viewDidLoad { 
    [super viewDidLoad]; 

    CirclePart *part1 = [[CirclePart alloc] initWithStartDegree:0 endDegree:120 partColor:[UIColor redColor]]; 
    CirclePart *part2 = [[CirclePart alloc] initWithStartDegree:120 endDegree:250 partColor:[UIColor blueColor]]; 
    CirclePart *part3 = [[CirclePart alloc] initWithStartDegree:250 endDegree:360 partColor:[UIColor grayColor]]; 

    NSArray *circleParts = [[NSArray alloc] initWithObjects:part1, part2, part3, nil]; 

    CGRect rect = CGRectMake(100, 100, 200, 200); 
    CGPoint circleCenter = CGPointMake(rect.size.width/2, rect.size.height/2); 

    GraphView *graphView = [[GraphView alloc] initWithFrame:rect CentrePoint:circleCenter radius:80 lineWidth:2 circleParts:circleParts]; 
    graphView.backgroundColor = [UIColor whiteColor]; 
    graphView.layer.borderColor = [UIColor redColor].CGColor; 
    graphView.layer.borderWidth = 1.0f; 

    [self.view addSubview:graphView]; 
} 

- (void)didReceiveMemoryWarning { 
    [super didReceiveMemoryWarning]; 
    // Dispose of any resources that can be recreated. 
} 

@end 
संबंधित मुद्दे