objective c - Objecive-C Draw a Circle with a Ring shape -
i wrote class draws animated progress circle (it draws circular sector based on float progress)
@implementation mxmprogressview @synthesize progress; - (id)initwithdefaultsize { int circleoffset = 45.0f; self = [super initwithframe:cgrectmake(0.0f, 0.0f, 135.0f + circleoffset, 135.0f + circleoffset)]; self.backgroundcolor = [uicolor clearcolor]; return self; } - (void)drawrect:(cgrect)rect { cgrect allrect = self.bounds; cgrect circlerect = cgrectmake(allrect.origin.x + 2, allrect.origin.y + 2, allrect.size.width - 4, allrect.size.height - 4); cgcontextref context = uigraphicsgetcurrentcontext(); // background image //uiimage *image = [uiimage imagenamed:@"loader_disc_hover.png"]; //[image drawinrect:circlerect]; // orange: e27006 cgcontextsetrgbfillcolor(context, ((cgfloat)0xe2/(cgfloat)0xff), ((cgfloat)0x70/(cgfloat)0xff), ((cgfloat)0x06/(cgfloat)0xff), 0.01f); // fill //cgcontextsetlinewidth(context, 2.0); cgcontextfillellipseinrect(context, circlerect); //cgcontextstrokeellipseinrect(context, circlerect); // draw progress float x = (allrect.size.width / 2); float y = (allrect.size.height / 2); // orange: e27006 cgcontextsetrgbfillcolor(context, ((cgfloat)0xe2/(cgfloat)0xff), ((cgfloat)0x70/(cgfloat)0xff), ((cgfloat)0x06/(cgfloat)0xff), 1.0f); // progress cgcontextmovetopoint(context, x, y); cgcontextaddarc(context, x, y, (allrect.size.width - 4) / 2, -m_pi_2, (self.progress * 2 * m_pi) - m_pi_2, 0); cgcontextclosepath(context); cgcontextfillpath(context); } @end
now want draw ring shape same progress animation, instead of filling full circle, circular sector again not starting center of circle.
i tried cgcontextaddellipseinrect
, cgcontexteofillpath(context);
with no success.
i think you'll need construct more complex path, like:
// move start point of outer arc (which might not required) cgcontextmovetopoint(context, x+outerradius*cos(startangle), y+outerradius*sin(startangle)); // add outer arc path (counterclockwise) cgcontextaddarc(context, x, y, outerradius, startangle, endangle, 0); // move *inward* start point of inner arc cgcontextmovetopoint(context, x+innerradius*cos(endangle), y+innerradius*sin(endangle)); // add inner arc path (clockwise) cgcontextaddarc(context, x, y, innerradius, endangle, startangle, 1); // close path end of inner arc start of outer arc cgcontextclosepath(context);
note: haven't tried above code myself
Comments
Post a Comment