drawing - Masking circle segments in swift -
i'm creating simple player app. there circle, shows progress of playing song.
what best way draw circle in swift , make mask? assume can draw 2 circles putting width stroke thickness want , without filling it. , white 1 has masked according parameter. don't have idea, how mask in proper way.
i came solution recently:
class circularprogressview: uiview { private let floatpi = cgfloat(m_pi) private var progresscolor = uicolor.greencolor() private var progressbackgroundcolor = uicolor.graycolor() @ibinspectable var percent: cgfloat = 0.11 { didset { setneedsdisplay() } } @ibinspectable var linewidth: cgfloat = 18 override func drawrect(rect: cgrect) { let context = uigraphicsgetcurrentcontext() let origo = cgpointmake(frame.size.width / 2, frame.size.height / 2) let radius: cgfloat = frame.size.height / 2 - linewidth / 2 cgcontextsetlinewidth(context, linewidth) cgcontextmovetopoint(context, frame.width / 2, linewidth / 2) cgcontextaddarc(context, origo.x, origo.y, radius, floatpi * 3 / 2, floatpi * 3 / 2 + floatpi * 2 * percent, 0) progresscolor.setstroke() let lastpoint = cgcontextgetpathcurrentpoint(context) cgcontextstrokepath(context) cgcontextmovetopoint(context, lastpoint.x, lastpoint.y) cgcontextaddarc(context, origo.x, origo.y, radius, floatpi * 3 / 2 + floatpi * 2 * percent, floatpi * 3 / 2, 0) progressbackgroundcolor.setstroke() cgcontextstrokepath(context) } }
you have set correct frame (via code or interface builder), , set percent property.
this solution not using mask or 2 circles, 2 arcs, first start @ 12 o clock , goes 2 * pi * progress percent, , other arc drawn end of previous arc 12 o clock.
important: percent
property has between 0 , 1!
Comments
Post a Comment