作為一個iOS程序媛,還真是沒有發(fā)文章的習(xí)慣迈窟,但是據(jù)說如果能夠長期整理自己代碼的心得私植,寫成文章,那是可以證明實力的(額车酣,算了吧曲稼,不寫還沒人知道很菜索绪。。躯肌。)者春。
總結(jié)一下自己寫過的代碼小片段。
實現(xiàn)功能:在一個固定區(qū)域內(nèi)清女,根據(jù)返回的幾個數(shù)據(jù)做一個不帶坐標(biāo)的折線圖钱烟,有拐點,有數(shù)據(jù)顯示嫡丙。
代碼分兩個地方寫:1拴袭、自定義UIView類 ? 2、需要顯示折線圖的控制器頁面曙博。
1拥刻、自定義UIView類
.h文件 其中beginX,beginY表示直線的起點父泳,endX般哼,endY表示直線的終點
#import
@interfaceLineRectView :UIView
@property(nonatomic,assign) int beginX;
@property(nonatomic,assign) int beginY;
@property(nonatomic,assign) int endX;
@property(nonatomic,assign) int endY;
@end
.m文件 在.m文件中需要重寫drawRectangle方法
-(void)drawRect:(CGRect)rect{
//獲取上下文
CGContextRefcontext =UIGraphicsGetCurrentContext();
//設(shè)置起點
CGContextMoveToPoint(context,_beginX,_beginY);
//畫曲線
//第一個參數(shù)是上下文,直接穿上面獲取到的惠窄。
//接下來兩個參數(shù)cpx,cpy這兩個是控制在哪一個點產(chǎn)生弧度(如果按下面那樣寫就沒有弧度)
//最后兩個參數(shù)x,y是終點的位置
CGContextAddQuadCurveToPoint(context, (_endX-_beginX)/2+_beginX, (_endY-_beginY)/2+_beginY,_endX,_endY);
//設(shè)置直線的顏色 ?要在獲取上下文之后蒸眠,否則沒有效果
UIColor*color = [UIColorwhiteColor];
[colorset];
//渲染
CGContextStrokePath(context);
}
根據(jù)傳入的參數(shù),已經(jīng)可以得到直線了杆融,起點和終點坐標(biāo)的參考系都是UIVIew本身楞卡。
2、顯示這個折線圖的頁面代碼
假設(shè)給出的坐標(biāo)最大值為maxY脾歇,最小值為minY蒋腮,因為橫坐標(biāo)固定大小所以不需要考慮.假設(shè)給定的高度和寬度是24 和 屛寬,給定的數(shù)據(jù)是6個
-(void)makeTheView{
int maxY =686;
int minY =600;
CGFloat unitY = (CGFloat)24/(maxY-minY);//單位高度
CGFloat unitX = (CGFloat)(kScreenWidth)/5;//單位寬度
NSArray*arr =@[@600,@600,@640,@650,@686,@665];//假設(shè)這是給出的值
for(int i =0; i<arr.count-1;i++){
LineRectView*lineV1 = [[LineRectView alloc] initWithFrame:CGRectMake(unitX*i,86, unitX,24)];
lineV1.beginX=0;
float a = [arr[i] floatValue];
lineV1.beginY=24-(a-minY)*unitY;
lineV1.endX= unitX;
float b = [arr[i+1] floatValue];
lineV1.endY=24-(b-minY)*unitY;
lineV1.backgroundColor= [UIColor clearColor];
[self.view addSubview:lineV1];
}
for(inti =1; i<arr.count-1;i++){
float a = [arr[i] floatValue];
//拐點
UIImageView*pointImgView = [[UIImageView alloc]initWithFrame:CGRectMake(unitX*i-2,24-(a-minY)*unitY+86-2,4,4)];
pointImgView.backgroundColor= [UIColor whiteColor];
pointImgView.layer.cornerRadius=2;
[pointImgView.layer masksToBounds];
[self.view addSubview:pointImgView];
//顯示數(shù)據(jù)的lable
UILabel*pointLab = [[UILabel alloc]initWithFrame:CGRectMake(unitX*i-10,24-(a-minY)*unitY+86+2,20,12)];
pointLab.font= [UIFontsystem FontOfSize:10];
pointLab.backgroundColor= [UIColorclearColor];
pointLab.textColor=[UIColor blackColor];
pointLab.text= [NSString stringWithFormat:@"%@",arr[i]];
[self.view addSubview:pointLab];
}
}
效果如下圖
適當(dāng)修改坐標(biāo)后可以是這樣
嗯藕各,就是這樣啦~