UIBezierPath CAShapeLayer 配合使用 (QQ载图效果)

效果:显示的图片为无掩盖, 需要在中间显示光亮的圆, 圆得四周为半透明的黑色


CAShapeLayer  UIBezierPath  配合使用

思路: 使用贝塞尔曲线绘制path, 再将path 赋给 shapeLayer

1 贝塞尔曲线 画圆 (得先理解startAngle与endAngle,刚开始我搞不清楚一段圆弧从哪算起始和终止,比如弧度为0的话,是从上下左右哪个点开始算)

2 算好其余的坐标连接成线, 最后close

3 赋值给shapelayer.path


核心代码:

```

初始化贝塞尔曲线

UIBezierPath* path = [UIBezierPathbezierPath];

//准备画圆 确定开始点与结束点

在这里涉及到角度的问题,起始角和结束角,这里的角度使使用弧度制来表示,一张图片,以方便参考


CGFloat startAngle =0;

CGFloat endAngle = ((float)M_PI*2);

[pathaddArcWithCenter:CGPointMake(IPHONE_WIDTH/2,_showImgView.frame.origin.y+_showImgView.frame.size.height/2)radius:IPHONE_WIDTH/2startAngle:startAngleendAngle:endAngleclockwise:NO];

[pathaddLineToPoint:CGPointMake(IPHONE_WIDTH,IPHONE_HEIGHT)];

[pathaddLineToPoint:CGPointMake(0,IPHONE_HEIGHT)];

[pathaddLineToPoint:CGPointMake(0,0)];

[pathaddLineToPoint:CGPointMake(IPHONE_WIDTH,0)];

[pathclosePath];

//创建一个shapeLayer

CAShapeLayer*layer = [CAShapeLayerlayer];

layer.frame=_showImgView.bounds;//与showView的frame一致

layer.strokeColor= [UIColorclearColor].CGColor;//边缘线的颜色

UIColor* blackColor = [UIColorcolorWithRed:0.0f/255.0green:0.0f/255.0blue:0.0f/255.0alpha:0.5f];

layer.fillColor= blackColor.CGColor;//闭环填充的颜色

layer.lineCap=kCALineCapSquare;//边缘线的类型

layer.path= path.CGPath;//从贝塞尔曲线获取到形状

layer.lineWidth=4.0f;//线条宽度

layer.strokeStart=0.0f;

layer.strokeEnd=0.1f;

//将layer添加进图层

[self.view.layeraddSublayer:layer];

self.overlayView.layer.mask= maskLayer;

```

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 在iOS中随处都可以看到绚丽的动画效果,实现这些动画的过程并不复杂,今天将带大家一窥ios动画全貌。在这里你可以看...
    每天刷两次牙阅读 12,719评论 6 30
  • 在iOS中随处都可以看到绚丽的动画效果,实现这些动画的过程并不复杂,今天将带大家一窥iOS动画全貌。在这里你可以看...
    F麦子阅读 10,531评论 5 13
  • 谈谈贝塞尔曲线 最近在做项目的时候,需要用到一个动画,非常简单的动画,简单到就是直接对一个View做平移… 然而虽...
    雨润听潮阅读 11,308评论 1 16
  • #import "ChangeAnimationView.h" ``` @interface ChangeAnim...
    JinHuiZhang阅读 3,707评论 0 0
  • 前几天我们在微博上做活动,号召大家转发评论自己喜欢或想看的一本书。 活动结束了,我们对评论稍微做了些整理,把读者们...
    鲜悦文化阅读 2,224评论 0 0