Я знаю, как рисовать дугу
и я также нашел, как рисовать градиентную линию от здесь Я обнаружил, что две функции могут рисовать градиент: CGContextDrawLinearGradient и CGContextDrawRadialGradient.but, как я могу нарисовать градиентную дугу? Я хочу реализовать эту картину:
Я долго искал, как это сделать, поэтому я думал, что опубликую, как я это сделал. Оказывается, оба ответа находятся в отличном ответе на этот вопрос:
Нарисуйте сегменты из круга или пончика
В моих целях я использовал только чертежные и градиентные части этого ответа. Структура выглядит более или менее подобной...
CGContextRef context = UIGraphicsGetCurrentcontext();
CGFloat arcStartAngle = M_PI;
CGFloat arcEndAngle = 2 * M_PI;
CGPoint startPoint = CGPointMake(...);
CGPoint endPoint = CGPointMake(...);
CGColorSpaceRef colorSpace = CGColorSpaceCreateDeviceRGB();
CGFloat colors[] =
{
1.0, 0.0, 0.0, 1.0, //RGBA values (so red to green in this case)
0.0, 1.0, 0.0, 1.0
};
CGGradientRef gradient = CGGradientCreateWithColorComponents(colorSpace, colors, NULL, 2);
//Where the 2 is for the number of color components. You can have more colors throughout //your gradient by adding to the colors[] array, and changing the components value.
CGColorSpaceRelease(colorSpace);
//Now for the arc part...
CGMutablePathRef arc = CGPathCreateMutable();
CGPathMoveToPoint(arc, NULL, startPoint.x, startPoint.y);
//Here, the CGPoint self.arcCenter is the point around which the arc is placed, so maybe the
//middle of your view. self.radius is the distance between this center point and the arc.
CGPathAddArc(arc, NULL, self.arcCenter.x, self.arcCenter.y, self.radius,
arcStartAngle, arcEndAngle, YES);
//This essentially draws along the path in an arc shape
CGPathRef strokedArc = CGPathCreateCopyByStrokingPath(arc, NULL, 5.0f,
kCGLineCapButt, kCGLineJoinMiter, 10);
CGContextSaveGState(context);
CGContextAddPath(context, strokedArc);
CGContextClip(context);
CGContextDrawLinearGradient(context, gradient, startPoint, endPoint, 0);
CGContextDrawPath(context, kCGPathFillStroke);
CGGradientRelease(gradient);
CGContextRestoreGState(context);
//This all draws a gradient that is much larger than the arc itself, but using
//CGContextClip, it clips out everything EXCEPT the colors in the arc. Saving and Restoring
//the state allows you to preserve any other drawing going on. If you didn't use these,
//then all other drawing would also be clipped.
Надеюсь, это поможет. Если это неясно, я рекомендую вам проверить ссылку выше. Ответ на эти вопросы содержит все, что я использовал в этом ответе, и еще несколько интересных и полезных советов по рисованию.
Вы можете сделать это, используя CGContextDrawRadialGradient() с использованием обтравочного контура. Вы можете сделать что-то вроде этого:
CGContextBeginPath(context);
CGContextMoveToPoint(context, startX, startY);
CGContextAddArcToPoint(context, x1, y1, x2, y2, arcRadius);
CGConextClosePath(context);
CGContextClip(context);
CGContextDrawRadialGradient(context, gradient, startCenter, startRadius, endCenter, endRadius, options);