iOS中使用CoreGraphics中

我想要像这样创建一个圆形渐变进度条：iOS中使用CoreGraphics中

Circle progress bar gradient

我试图与核芯显卡这样使它：

float radius = CGRectGetWidth(rect)/2.0f - self.circleBorderWidth/2.0f; 
float angleOffset = 0; 

UIBezierPath *aPath = [UIBezierPath bezierPathWithArcCenter:CGPointMake(CGRectGetMidX(rect), CGRectGetMidY(rect)) 
                radius:radius 
               startAngle:-angleOffset 
                endAngle:(mCircleSegs + 1)/(float)kCircleSegs*M_PI*2 - angleOffset 
                clockwise:YES]; 

CGPathRef shape = CGPathCreateCopyByStrokingPath(aPath.CGPath, NULL, 3, kCGLineCapSquare, kCGLineJoinMiter, 1.0f); 

CGContextRef ctx = UIGraphicsGetCurrentContext(); 
CGContextAddPath(ctx, shape); 
CGContextClip(ctx); 

AngleGradientLayer *angle = [[AngleGradientLayer alloc] init]; 
angle.colors = [NSArray arrayWithObjects: 
       (id)[UIColor colorWithRed:0 green:0 blue:0 alpha:1].CGColor, 
       (id)[UIColor colorWithRed:1 green:1 blue:1 alpha:1].CGColor, 
       nil]; 


CGContextClipToRect(ctx, self.bounds); 
[angle drawInContext:ctx]; 

[angle release];

但我认为我在这里错了。它看起来不像这个例子。 CoreGraphics能够绘制这样的东西吗？怎么样？

来源

2013-02-17 Hans

您用作剪辑的贝塞尔路径似乎只是一个圆的一部分，而在您显示的图像中，路径更复杂：一个圆的2个分数，由2行连接，整个路径具有一个'环'形状。

这种方法应该可以工作，我将它用于具有相同外观的计时器。尽管我没有直接使用AngleGradientLayer，但我修改了其- (CGImageRef)newImageGradientInRect:(CGRect)rect方法以返回UIImage。但我必须通过+ PI/2旋转此图像，因为Pavlov梯度角度渐变水平开始。

我用一个UIImage，因为它是不会改变的背景下，所以我在我的层保存在此UIImage的实例，并绘制它，每当我更新剪切路径

- (void)drawInContext:(CGContextRef)ctx 
{ 

    UIBezierPath *currentPath = [self timerPath]; 
    // other drawing code for glow (shadow) and white stroke) 
    CGContextAddPath(ctx, currentPath.CGPath); 
    // clip ! 
    CGContextClip(ctx); 
    CGContextDrawImage(ctx, self.bounds, _circularGradientImage.CGImage); 

    //_circularGradientImage from modified newImageGradientInRect method. 

}

这里就是我得到：

enter image description here

来源

2013-02-17 18:05:29 Vinzzz

问题不是圆的2个部分。问题在于渐变的绘制。我真的不知道如何用核心图形绘制这样的东西。 – Hans 2013-02-18 00:13:57

回答编辑，添加了我得到的截图 – Vinzzz 2013-02-18 07:35:59

是的！但正如你在上面的图片中看到的那样，当进度条是20％，60％，80％时......第一部分的结尾总是最白的。所以背景层不是解决方案。事实上，我想我们需要一个适应进度本身的背景...... – Hans 2013-02-18 11:08:08

iOS中使用CoreGraphics中

回答

相关问题