OC-9. Draw download Progress bar (demo) based on quartz2d _ios

Effect chart

Realize the idea

To implement a drawing, it is often necessary to customize a UIView subclass, overriding the parent-(void) DrawRect: (CGRect) Rect method, which implements drawing operations in the method
To display the download progress, you only need to instantiate a custom subclass object (in the case of a storyboard control, simply modify the control's Class property to a custom subclass name)

The effect of the image shown is actually to draw an arc, the dynamic change in the end of the position, and eventually reached a closed circle

The middle text is a Uilabel control, changing the reality of the text according to the progress dynamically

Implementation steps

Customizing a UIView Subclass

Provides a member property to receive download progress values

@property (nonatomic, assign) cgfloat progress;

overriding a member property progress setter

Each time the value of the member property progress is changed, its setter
-(void) Setprogress: (cgfloat) Progress
{
 _progress = progress is invoked;
 Manually invoke the Redraw method
 [self setneedsdisplay] when the download progress changes;

Rewrite-(void) DrawRect: (cgrect) rect (CORE)

-(void) DrawRect: (cgrect) Rect {//Set radius of arc cgfloat radius = rect.size.width * 0.5;
 Set the center of the arc cgpoint Center = cgpointmake (radius, radius);
 Set the starting angle of the arc (radians) cgfloat startangle =-m_pi_2;
 Set the end angle of the arc cgfloat endangle =-m_pi_2 + 2 * m_pi * self.progress; Use the Uibezierpath class to draw arcs uibezierpath *path = [Uibezierpath bezierpathwitharccenter:center radius:radius-5:
 StartAngle Endangle:endangle Clockwise:yes];
Renders the drawn arc to a layer (that is, displayed) [path stroke]; }