iOS Development note-Dynamically adjusts fontsize adaptive text and the implementation of a circular progress bar control based on frame size

Recently, a new app, the design of a circular progress bar is shown below:

Think about it, the circular progress bar is not difficult to achieve, but it shows that the percentage of the text needs to be adaptive, although it can be used to set the size of the text font, but it is very cumbersome, but also very low.

Check a lap, the current implementation of the adaptive Uilabel, are based on the font size of the dynamic adjustment of the framesize, and can not meet our needs.

So here's the problem.

How can I implement a circular progress bar that adjusts the text font size to fit the frame size?

My implementation of the idea is very simple, first calculate the frame can give Uilabel maximum size, and then according to the principle of high priority, width second, calculate the most suitable font size, so that can be perfectly adapted to various sizes.

The effect is as follows:

Implementation code:

Circleprogressbar inherits from UIView and has four attributes, as follows:

////CircleProgressBar.h//Demo////Created by Zhangchangwei on 15/4/1.//Copyright (c) 2015 Changwei. All rights reserved.//#import<UIKit/UIKit.h>@interfaceCircleprogressbar:uiview
//progress bar percent value @property (nonatomic)floatPercentvalue;
//progress bar width @property (nonatomic)floatlinewidth;
//Text color @property (nonatomic) Uicolor*TextColor;
//progress bar Color @property (nonatomic) Uicolor*Barcolor;@end

Implementation of the main use of coregraphics drawing graphics, in which the text is drawn using adaptive calculation of the size of the implementation of the control frame size to dynamically change the behavior of the font, very flexible.

////CIRCLEPROGRESSBAR.M//Demo////Created by Zhangchangwei on 15/4/1.//Copyright (c) 2015 Changwei. All rights reserved.//#import "CircleProgressBar.h"@implementationCircleprogressbar/** * Init and set up property * * @param frame < #frame description#> * * @return < #return value description #>*/-(Instancetype) initWithFrame: (cgrect) frame{ Self=[Super Initwithframe:frame]; if(self) {}returnSelf ;}/** * Redraw * * @param rect frame*/- (void) DrawRect: (cgrect) rect {if(_linewidth==0.0f) {_percentvalue=0; NSLog (@"%@",@"please input color, value and other parameters"); }         //Start Drawing a drawingCgcontextref ctx=Uigraphicsgetcurrentcontext ();         Cgcontextsetlinewidth (CTX, _linewidth);         Cgcontextbeginpath (CTX); Cgcontextsetstrokecolorwithcolor (CTX, _barcolor==nil?[Uicolor Orangecolor].         Cgcolor:_barcolor.cgcolor); Cgcontextaddarc (CTX, Self.frame.size.width/2, self.frame.size.width/2, self.frame.size.width/2-_linewidth, m_pi*1.5, m_pi* (1.5-2*_percentvalue),1);         Cgcontextstrokepath (CTX); //Draw calculate best Text SizeCgsize Maxsize=cgsizemake (rect.size.width*0.75, rect.size.height/3); intCurrentfontsize= -; NSString*str=[nsstring stringWithFormat:@"%.1f%%", _percentvalue* -]; Cgsize requiredsize=[str boundingrectwithsize:maxsize options:nsstringdrawingusesfontleading attributes:@{nsfontattributename:[         Uifont Systemfontofsize:currentfontsize]} context:nil].size; if(requiredsize.height<=maxsize.height) { while(requiredsize.height<=maxsize.height&&requiredsize.width<maxsize.width) {currentfontsize++; Requiredsize=[str boundingrectwithsize:maxsize options:nsstringdrawingusesfontleading attributes:@{nsfontattributename:[             Uifont Systemfontofsize:currentfontsize]} context:nil].size; }         }Else         {              while(Requiredsize.height>maxsize.height| | Requiredsize.width>maxsize.width) {currentfontsize--; Requiredsize=[str boundingrectwithsize:maxsize options:nsstringdrawingusesfontleading attributes:@{nsfontattributename:[             Uifont Systemfontofsize:currentfontsize]} context:nil].size; } requiredsize=[str boundingrectwithsize:maxsize options:nsstringdrawingusesfontleading attributes:@{nsfontattributename:[         Uifont Systemfontofsize:currentfontsize]} context:nil].size; }         //Draw Adaptive Text[Str drawatpoint:cgpointmake (rect.size.width/2-requiredsize.width/2, rect.size.height/2-requiredsize.height/2) withattributes:@{Nsfontattributename:[uifont Systemfontofsize:currentfontsize] , Nsforegroundcolorattributename:_textcolor==nil?[Uicolor Blackcolor]:_textcolor}]; }@end

How to use:

Circleprogressbar is very simple to use, only need to provide the corresponding parameters, as follows:

- (void) viewdidload {[Super viewdidload]; Circleprogressbar*bar1=[[circleprogressbar Alloc] Initwithframe:cgrectmake (screen_width/2-Ten, screen_height*0.2, -, -)]; Bar1.barcolor=[Uicolor Redcolor]; Bar1.linewidth=1.0f; Bar1.percentvalue=0.85; Bar1.backgroundcolor=[Uicolor Clearcolor];        [Self.view ADDSUBVIEW:BAR1]; Circleprogressbar*bar2=[[circleprogressbar Alloc] Initwithframe:cgrectmake (screen_width/2- -, screen_height*0.3, -, -)]; Bar2.barcolor=[Uicolor Orangecolor]; Bar2.linewidth=3; Bar2.percentvalue=0.45; Bar2.backgroundcolor=[Uicolor Clearcolor];    [Self.view ADDSUBVIEW:BAR2]; Circleprogressbar*bar3=[[circleprogressbar Alloc] Initwithframe:cgrectmake (screen_width/2- -, screen_height*0.5, -, -)]; Bar3.barcolor=[Uicolor Greencolor]; Bar3.linewidth=5; Bar3.textcolor=[Uicolor Bluecolor]; Bar3.percentvalue=0.75; Bar3.backgroundcolor=[Uicolor Clearcolor];    [Self.view ADDSUBVIEW:BAR3]; Circleprogressbar*bar4=[[circleprogressbar Alloc] Initwithframe:cgrectmake (screen_width/2- -, screen_height*0.7, $, $)]; Bar4.barcolor=[Uicolor Bluecolor]; Bar4.textcolor=[Uicolor Purplecolor]; Bar4.linewidth=Ten; Bar4.percentvalue=0.55; Bar4.backgroundcolor=[Uicolor Clearcolor]; [Self.view ADDSUBVIEW:BAR4];}

Completed the implementation of the circular progress bar, think, in fact, can add animation, so that the progress bar dynamic display, the next time to achieve?

iOS Development note-Dynamically adjusts fontsize adaptive text and the implementation of a circular progress bar control based on frame size