作为一个iOS程序媛，还真是没有发文章的习惯，但是据说如果能够长期整理自己代码的心得，写成文章，那是可以证明实力的（额，算了吧，不写还没人知道很菜。。。）。
总结一下自己写过的代码小片段。
实现功能：在一个固定区域内，根据返回的几个数据做一个不带坐标的折线图，有拐点，有数据显示。
代码分两个地方写：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();
//设置起点
CGContextMoveToPoint(context,_beginX,_beginY);
//画曲线
//第一个参数是上下文，直接穿上面获取到的。
//接下来两个参数cpx,cpy这两个是控制在哪一个点产生弧度（如果按下面那样写就没有弧度）
//最后两个参数x,y是终点的位置
CGContextAddQuadCurveToPoint(context, (_endX-_beginX)/2+_beginX, (_endY-_beginY)/2+_beginY,_endX,_endY);
//设置直线的颜色 要在获取上下文之后，否则没有效果
UIColor*color = [UIColorwhiteColor];
[colorset];
//渲染
CGContextStrokePath(context);
}
根据传入的参数，已经可以得到直线了，起点和终点坐标的参考系都是UIVIew本身。
2、显示这个折线图的页面代码
假设给出的坐标最大值为maxY，最小值为minY，因为横坐标固定大小所以不需要考虑.假设给定的高度和宽度是24 和 屛宽，给定的数据是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];//假设这是给出的值
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];
//显示数据的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];
}
}
效果如下图
适当修改坐标后可以是这样
嗯，就是这样啦~
网友评论