核心图形从视图中心/圆圈加入的圆点

Question

我想要完成的是从视图中心画出曲线。到目前为止，在google搜索和本网站的帮助下...我已经完成了下面的图片。

http://www.flickr.com/photos/57562417@N00/9100635690/

我愿做的是有弯曲像下面的图片线...

http://www.flickr.com/photos/57562417@N00/9100634674/

任何和所有帮助将不胜感激。到目前为止，我已经包含了代码。

#import <UIKit/UIKit.h> 

    @interface ChartView : UIView 

    @property (nonatomic,assign) int angle; 

    @end 

    ---------------------------------------------------------------------- 



    #import "ChartView.h" 
    #import <QuartzCore/QuartzCore.h> 

    /** Helper Functions **/ 
    #define degree_to_radians(deg)  ((M_PI * (deg))/180.0) 
    #define radians_to_degrees(rad)  ((180.0 * (rad))/M_PI) 


    @interface ChartView(){ 

    int radius; 
    } 

    @end 

    @implementation ChartView 

    -(id)initWithFrame:(CGRect)frame{ 

    self = [super initWithFrame:frame]; 

     if(self){ 



    self.backgroundColor = [UIColor whiteColor]; 
    [self.layer setBorderWidth:1.0]; 
    [self.layer setBorderColor:[UIColor redColor].CGColor]; 

    //Define the circle radius taking into account the safe area 
    radius = self.frame.size.width/2; 

    //Initialize the Angle at 0 
    self.angle = 360; 
} 

    return self; 

} 

-(void)drawRect:(CGRect)rect{ 

//Circle center 

int numberOfSections = 96; //24 major lines 
CGFloat angleSize = 2 * M_PI/numberOfSections; 

CGContextRef context = UIGraphicsGetCurrentContext(); 

//draw the main outside circle 
CGRect circleRect = CGRectMake(0.0, 0.0, 720., 720.); 
CGContextSetLineWidth(context, .5); 
CGContextSetRGBStrokeColor(context, 0.0, 2.0, 4.0, 1.0); 
CGContextStrokeEllipseInRect(context, circleRect); 
CGPoint centerPoint = CGPointMake(circleRect.size.width/2 , circleRect.size.height/2); 

//setup for drawing lines from center, straight lines, need curved lines 
CGContextTranslateCTM(context, 0.0, 0.0); 

for (int x = 0; x < numberOfSections; x++) { 

    CGContextSetLineWidth(context, .5); 
    CGContextSetRGBStrokeColor(context, 0.0, 2.0, 4.0, 1.0); 
    CGContextMoveToPoint(context, self.frame.size.width/2, self.frame.size.height/2); 

    CGContextAddLineToPoint(context, centerPoint.x + radius * cos(angleSize * x) ,centerPoint.y + radius * sin(angleSize * x)); 



    CGContextStrokePath(context); 

} 



CGContextSetLineWidth(context, .5); 
CGContextSetRGBStrokeColor(context, 0.0, 2.0, 4.0, 1.0); 
CGContextSetRGBFillColor(context, 1., 1., 1., 1.0); 

//Taken from Hypnotizer code 
float maxRadius = 360.0; 
CGContextSetLineWidth(context, 0.5f); 
CGContextSetRGBStrokeColor(context, 0.0, 2.0, 4.0, 1.0); 

//need to add 100 lines form a certain radius to a max radius 
for (float currentRadius = maxRadius; currentRadius > 99; currentRadius -=2.6) { 


    CGContextAddArc(context, centerPoint.x, centerPoint.y, currentRadius, 0.0, M_PI * 2.0, YES); 
    CGContextStrokePath(context); 
} 



} 

@end 

Answer 1

好吧，我有一些代码为你，我尝试了，并做了你在第二张图片中提到的曲线效果：

- (void)drawRect:(CGRect)rect { 
    radius = self.frame.size.width/2; 

    // Circle center 
    int numberOfSections = 96; // 24 major lines 
    CGFloat angleSize = 2 * M_PI/ numberOfSections; 

    CGContextRef context = UIGraphicsGetCurrentContext(); 

    CGRect circleRect = CGRectMake(0.0, 0.0, 720., 720.); 
    CGPoint centerPoint = CGPointMake(circleRect.size.width/2, circleRect.size.height/2); 

    /* Create mask to create 'hole' in the center */ 
    CGContextAddArc(context, centerPoint.x, centerPoint.y, 720/2.0, 0.0, M_PI * 2.0, YES); 
    CGContextAddArc(context, centerPoint.x, centerPoint.y, 100, 0.0, M_PI * 2.0, NO); 
    CGContextClip(context); 

    // draw the main outside circle 
    CGContextSetLineWidth(context, .5); 
    CGContextSetRGBStrokeColor(context, 0.0, 2.0, 4.0, 1.0); 
    CGContextStrokeEllipseInRect(context, circleRect); 

    // setup for drawing lines from center, straight lines, need curved lines 
    CGContextTranslateCTM(context, 0.0, 0.0); 

    for (int x = 0; x < numberOfSections; x++) { 

     CGContextSetLineWidth(context, .5); 
     CGContextSetRGBStrokeColor(context, 0.0, 2.0, 4.0, 1.0); 

     double angle = angleSize * x; 
     CGPoint outsidePoint = CGPointMake(centerPoint.x + radius * cos(angle), centerPoint.y + radius * sin(angle)); 
     CGPoint control1 = CGPointMake(centerPoint.x + radius/3 * cos(angle-0.5), centerPoint.y + radius/3 * sin(angle-0.5)); 
     CGPoint control2 = CGPointMake(centerPoint.x + (2*radius/3) * cos(angle-0.5), centerPoint.y + (2*radius/3) * sin(angle-0.5)); 

     UIBezierPath *bezierPath = [UIBezierPath bezierPath]; 
     [bezierPath moveToPoint:CGPointMake(circleRect.size.width/2, circleRect.size.height/2)]; 
     [bezierPath addCurveToPoint:outsidePoint controlPoint1:control1 controlPoint2:control2]; 
     CGContextAddPath(context, bezierPath.CGPath); 


     CGContextStrokePath(context); 

    } 


    CGContextSetLineWidth(context, .5); 
    CGContextSetRGBStrokeColor(context, 0.0, 2.0, 4.0, 1.0); 
    CGContextSetRGBFillColor(context, 1., 1., 1., 1.0); 

    // Taken from Hypnotizer code 
    float maxRadius = 360.0; 
    CGContextSetLineWidth(context, 0.5f); 
    CGContextSetRGBStrokeColor(context, 0.0, 2.0, 4.0, 1.0); 

    // need to add 100 lines form a certain radius to a max radius 
    for (float currentRadius = maxRadius; currentRadius > 99; currentRadius -= 2.6) { 


     CGContextAddArc(context, centerPoint.x, centerPoint.y, currentRadius, 0.0, M_PI * 2.0, YES); 
     CGContextStrokePath(context); 
    } 

}