ios-贝塞尔曲线
Posted sayimba
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了ios-贝塞尔曲线相关的知识,希望对你有一定的参考价值。
git下载地址:git@github.com:lu459700780/UIBezierPath.git
演示:
#import "ViewController.h" @interface ViewController () @property (nonatomic,assign)BOOL Plus_Minus; @property (nonatomic,strong)CAShapeLayer * shapeLayer; @property (nonatomic,strong)UIBezierPath * trackPath; @property (nonatomic,strong)CAShapeLayer * trackLayer; @property (nonatomic,strong)UIBezierPath * progressPath; @property (nonatomic,strong)CAShapeLayer * progressLayer; @property (nonatomic,strong)NSTimer * timer; @property (nonatomic,strong)CAShapeLayer * shapeLayerT; @property (nonatomic,strong)CAShapeLayer * shapeLayerTM; @end @implementation ViewController - (void)viewDidLoad { [super viewDidLoad]; _Plus_Minus = YES; //创建CAShapeLayer self.shapeLayer = [CAShapeLayer layer]; self.shapeLayer.frame = CGRectMake(100, 100, 50, 50); // self.shapeLayer.position = self.view.center; self.shapeLayer.fillColor = [UIColor cyanColor].CGColor;//填充颜色为ClearColor //设置线条的宽度和颜色 self.shapeLayer.lineWidth = 1.0f; self.shapeLayer.strokeColor = [UIColor redColor].CGColor; //创建出圆形贝塞尔曲线 UIBezierPath * circlePath = [UIBezierPath bezierPathWithOvalInRect:CGRectMake(100, 100, 50, 50)]; //让贝塞尔曲线与CAShapeLayer 产生联系 self.shapeLayer.path = circlePath.CGPath; //一、添加并显示 画一个圆形 // [self.view.layer addSublayer:self.shapeLayer]; /* Stroke:用笔画的意思 在这里就是起始笔和结束笔的位置 Stroke为1的话就是一整圈,0.5就是半圈,0.25就是1/4圈。以此类推 */ self.shapeLayer.strokeStart = 0; self.shapeLayer.strokeEnd = 0.75; //二、画两个圆,其中一个圆表示进度 [self createBezierPath:CGRectMake(100, 200, 100, 100)]; //三、创建转动的圆 [self circleBezierPath]; //四、通过点画线组成一个五边线 [self fiveAnimation]; //五、画一条虚线 [self createDottedLine]; //六、画一个弧线 [self createCurvedLine]; } -(void)createCurvedLine{ UIBezierPath* aPath = [UIBezierPath bezierPath]; aPath.lineWidth = 5.0; aPath.lineCapStyle = kCGLineCapRound; //线条拐角 aPath.lineJoinStyle = kCGLineCapRound; //终点处理 [aPath moveToPoint:CGPointMake(20, 100)]; [aPath addQuadCurveToPoint:CGPointMake(120, 100) controlPoint:CGPointMake(70, 0)]; CAShapeLayer * CurvedLineLayer=[CAShapeLayer layer]; CurvedLineLayer.path=aPath.CGPath; [self.view.layer addSublayer:CurvedLineLayer]; } -(void)createDottedLine{ CAShapeLayer *shapeLayer = [CAShapeLayer layer]; [shapeLayer setBounds:self.view.bounds]; [shapeLayer setPosition:self.view.center]; [shapeLayer setFillColor:[[UIColor clearColor] CGColor]]; // 设置虚线颜色为blackColor [shapeLayer setStrokeColor:[[UIColor colorWithRed:223/255.0 green:223/255.0 blue:223/255.0 alpha:1.0f] CGColor]]; // 3.0f设置虚线的宽度 [shapeLayer setLineWidth:1.0f]; [shapeLayer setLineJoin:kCALineJoinRound]; // 3=线的宽度 1=每条线的间距 [shapeLayer setLineDashPattern: [NSArray arrayWithObjects:[NSNumber numberWithInt:3], [NSNumber numberWithInt:1],nil]]; // Setup the path CGMutablePathRef path = CGPathCreateMutable(); CGPathMoveToPoint(path, NULL, 0, 89); CGPathAddLineToPoint(path, NULL, 320,89); [shapeLayer setPath:path]; CGPathRelease(path); // 可以把self改成任何你想要的UIView, 下图演示就是放到UITableViewCell中的 [[self.view layer] addSublayer:shapeLayer]; } //五角形 -(void)fiveAnimation{ UIBezierPath *aPath = [UIBezierPath bezierPath]; //开始点 从上左下右的点 [aPath moveToPoint:CGPointMake(100,100)]; //划线点 [aPath addLineToPoint:CGPointMake(60, 140)]; [aPath addLineToPoint:CGPointMake(60, 240)]; [aPath addLineToPoint:CGPointMake(160, 240)]; [aPath addLineToPoint:CGPointMake(160, 140)]; [aPath closePath]; //设置定点是个5*5的小圆形(自己加的) UIBezierPath *path = [UIBezierPath bezierPathWithOvalInRect:CGRectMake(100-5/2.0, 50, 20, 20)]; [aPath appendPath:path]; CAShapeLayer *shapelayer = [CAShapeLayer layer]; //设置边框颜色 shapelayer.strokeColor = [[UIColor redColor]CGColor]; //设置填充颜色 如果只要边 可以把里面设置成[UIColor ClearColor] shapelayer.fillColor = [[UIColor blueColor]CGColor]; //就是这句话在关联彼此(UIBezierPath和CAShapeLayer): shapelayer.path = aPath.CGPath; [self.view.layer addSublayer:shapelayer]; } -(void)circleBezierPath{ _timer = [NSTimer scheduledTimerWithTimeInterval:0.15 target:self selector:@selector(circleAnimationTypeOne) userInfo:nil repeats:YES]; self.shapeLayerT = [CAShapeLayer layer]; self.shapeLayerT.frame = CGRectMake(0, 0, 150, 150); self.shapeLayerT.position = self.view.center; self.shapeLayerT.fillColor = [UIColor clearColor].CGColor; //设置线条的宽度和颜色 self.shapeLayerT.lineWidth = 2.0f; self.shapeLayerT.strokeColor = [UIColor redColor].CGColor; //设置stroke起始点 self.shapeLayerT.strokeStart = 0; self.shapeLayerT.strokeEnd = 0; //创建出圆形贝塞尔曲线 UIBezierPath * circlePath = [UIBezierPath bezierPathWithOvalInRect:CGRectMake(0, 0, 150, 150)]; //让贝塞尔曲线与CAShapeLayer产生联系 self.shapeLayerT.path = circlePath.CGPath; //添加并显示 [self.view.layer addSublayer:self.shapeLayerT]; self.shapeLayerTM = [CAShapeLayer layer]; self.shapeLayerTM.frame = CGRectMake(0, 0, 170, 170); self.shapeLayerTM.position = self.view.center; self.shapeLayerTM.fillColor = [UIColor clearColor].CGColor; //设置线条的宽度和颜色 self.shapeLayerTM.lineWidth = 2.0f; self.shapeLayerTM.strokeColor = [UIColor blueColor].CGColor; //设置stroke起始点 self.shapeLayerTM.strokeStart = 0; self.shapeLayerTM.strokeEnd = 0; //创建出圆形贝塞尔曲线 UIBezierPath * circlePathTM = [UIBezierPath bezierPathWithOvalInRect:CGRectMake(0, 0, 170, 170)]; //让贝塞尔曲线与CAShapeLayer产生联系 self.shapeLayerTM.path = circlePathTM.CGPath; //添加并显示 [self.view.layer addSublayer:self.shapeLayerTM]; } -(void)circleAnimationTypeOne{ NSLog(@"strokeStart===%f",self.shapeLayerT.strokeStart); NSLog(@"strokeEnd====%f",self.shapeLayerT.strokeEnd); if (self.shapeLayerT.strokeEnd > 1 && self.shapeLayerT.strokeStart < 1) { self.shapeLayerT.strokeStart += 0.1; self.shapeLayerTM.strokeStart += 0.1; }else if(self.shapeLayerT.strokeStart == 0){ self.shapeLayerT.strokeEnd += 0.1; self.shapeLayerTM.strokeEnd += 0.1; } if (self.shapeLayerT.strokeEnd == 0) { self.shapeLayerT.strokeStart = 0; self.shapeLayerTM.strokeStart = 0; } if (self.shapeLayerT.strokeStart == self.shapeLayerT.strokeEnd) { self.shapeLayerT.strokeEnd = 0; self.shapeLayerTM.strokeEnd = 0; } } //画两个圆形 -(void)createBezierPath:(CGRect)mybound{ //外圆 _trackPath = [UIBezierPath bezierPathWithArcCenter:self.view.center radius:(mybound.size.width-0.7)/2 startAngle:0 endAngle:M_PI*2 clockwise:YES]; _trackLayer = [CAShapeLayer new]; [self.view.layer addSublayer:_trackLayer]; _trackLayer.fillColor = nil; _trackLayer.strokeColor = [UIColor grayColor].CGColor; _trackLayer.path = _trackPath.CGPath; _trackLayer.lineWidth = 5; _trackLayer.frame = mybound; //内圆 _progressPath = [UIBezierPath bezierPathWithArcCenter:self.view.center radius:(mybound.size.width-0.7)/2 startAngle:-M_PI_2 endAngle:(M_PI*2)*0.7 clockwise:YES]; _progressLayer = [CAShapeLayer new]; [self.view.layer addSublayer:_progressLayer]; _progressLayer.fillColor = nil; _progressLayer.strokeColor = [UIColor redColor].CGColor; _progressLayer.lineCap = kCALineCapRound; _progressLayer.path = _progressPath.CGPath; _progressLayer.lineWidth = 5; _progressLayer.frame = mybound; } @end
以上是关于ios-贝塞尔曲线的主要内容,如果未能解决你的问题,请参考以下文章