使用CAShapeLayer与UIBezierPath可以实现不在view的drawRect方法中就画出一些想要的图形

步骤:

1、新建UIBezierPath对象bezierPath

2、新建CAShapeLayer对象caShapeLayer

3、将bezierPath的CGPath赋值给caShapeLayer的path,即caShapeLayer.path = bezierPath.CGPath

4、把caShapeLayer添加到某个显示该图形的layer中

下面的小例子是一个环形的progress代码,有具体的使用方法

.h文件:

  1. #import <QuartzCore/QuartzCore.h>
  2. #import <UIKit/UIKit.h>
  3. @interface KACircleProgressView : UIView {
  4. CAShapeLayer *_trackLayer;
  5. UIBezierPath *_trackPath;
  6. CAShapeLayer *_progressLayer;
  7. UIBezierPath *_progressPath;
  8. }
  9. @property (nonatomic, strong) UIColor *trackColor;
  10. @property (nonatomic, strong) UIColor *progressColor;
  11. @property (nonatomic) float progress;//0~1之间的数
  12. @property (nonatomic) float progressWidth;
  13. - (void)setProgress:(float)progress animated:(BOOL)animated;
  14. @end

.m文件

  1. #import "KACircleProgressView.h"
  2. @implementation KACircleProgressView
  3. - (id)initWithFrame:(CGRect)frame
  4. {
  5. self = [super initWithFrame:frame];
  6. if (self) {
  7. // Initialization code
  8. _trackLayer = [CAShapeLayer new];
  9. [self.layer addSublayer:_trackLayer];
  10. _trackLayer.fillColor = nil;
  11. _trackLayer.frame = self.bounds;
  12. _progressLayer = [CAShapeLayer new];
  13. [self.layer addSublayer:_progressLayer];
  14. _progressLayer.fillColor = nil;
  15. _progressLayer.lineCap = kCALineCapRound;
  16. _progressLayer.frame = self.bounds;
  17. //默认5
  18. self.progressWidth = 5;
  19. }
  20. return self;
  21. }
  22. - (void)setTrack
  23. {
  24. _trackPath = [UIBezierPath bezierPathWithArcCenter:self.center radius:(self.bounds.size.width - _progressWidth)/ 2 startAngle:0 endAngle:M_PI * 2 clockwise:YES];;
  25. _trackLayer.path = _trackPath.CGPath;
  26. }
  27. - (void)setProgress
  28. {
  29. _progressPath = [UIBezierPath bezierPathWithArcCenter:self.center radius:(self.bounds.size.width - _progressWidth)/ 2 startAngle:- M_PI_2 endAngle:(M_PI * 2) * _progress - M_PI_2 clockwise:YES];
  30. _progressLayer.path = _progressPath.CGPath;
  31. }
  32. - (void)setProgressWidth:(float)progressWidth
  33. {
  34. _progressWidth = progressWidth;
  35. _trackLayer.lineWidth = _progressWidth;
  36. _progressLayer.lineWidth = _progressWidth;
  37. [self setTrack];
  38. [self setProgress];
  39. }
  40. - (void)setTrackColor:(UIColor *)trackColor
  41. {
  42. _trackLayer.strokeColor = trackColor.CGColor;
  43. }
  44. - (void)setProgressColor:(UIColor *)progressColor
  45. {
  46. _progressLayer.strokeColor = progressColor.CGColor;
  47. }
  48. - (void)setProgress:(float)progress
  49. {
  50. _progress = progress;
  51. [self setProgress];
  52. }
  53. - (void)setProgress:(float)progress animated:(BOOL)animated
  54. {
  55. }
  56. /*
  57. // Only override drawRect: if you perform custom drawing.
  58. // An empty implementation adversely affects performance during animation.
  59. - (void)drawRect:(CGRect)rect
  60. {
  61. // Drawing code
  62. }
  63. */
  64. @end

使用:

  1. - (void)viewDidLoad
  2. {
  3. [super viewDidLoad];
  4. // Do any additional setup after loading the view, typically from a nib.
  5. KACircleProgressView *progress = [[KACircleProgressView alloc] initWithFrame:CGRectMake(0, 0, 100, 100)];
  6. [self.view addSubview:progress];
  7. progress.trackColor = [UIColor blackColor];
  8. progress.progressColor = [UIColor orangeColor];
  9. progress.progress = .7;
  10. progress.progressWidth = 10;
  11. }

最后上一张效果图:

使用CAShapeLayer与UIBezierPath画出想要的图形的更多相关文章

  1. 使用CAShapeLayer的path属性与UIBezierPath画出扫描框

    1.CAShapeLayer CAShapeLayer具有path属性,(是CGPath对象),可以使用这个属性与UIBezierPath画出想要的图形.该子类根据其fill color和stroke ...

  2. 使用CAShapeLayer和UIBezierPath画一个自定义半圆弧button

    通常我们使用系统自带的UIButton时,一般都是Rect矩形形式的,或则美工给出一张半圆弧的按钮,如图为一张半圆加三角形的按钮,而此时,如果给按钮添加点击事件时,响应事件依然为矩形区域,不符合我们的 ...

  3. 用css画出三角形

    看到有面试题里会有问到如何用css画出三角形 众所周知好多图形都可以拆分成三角形,所以说会了画三角形就可以画出很多有意思的形状 画出三角形的原理是调整border(边框)的四个方向的宽度,线条样式以及 ...

  4. 如何用css画出三角形

    看到有面试题里会有问到如何用css画出三角形 众所周知好多图形都可以拆分成三角形,所以说会了画三角形就可以画出很多有意思的形状 画出三角形的原理是调整border(边框)的四个方向的宽度,线条样式以及 ...

  5. 用css画出三角形【转】

    看到有面试题里会有问到如何用css画出三角形 众所周知好多图形都可以拆分成三角形,所以说会了画三角形就可以画出很多有意思的形状 画出三角形的原理是调整border(边框)的四个方向的宽度,线条样式以及 ...

  6. CSS画出的各种形状图

    利用CSS可以画出各种需要的图形目录[1]矩形[2]圆形[3]椭圆[4]直角三角形[5]正三角形[6]平行四边形[7]梯形[8]六角星[9]六边形[10]五角星简单图形 矩形div{ width: 1 ...

  7. iOS关于CAShapeLayer与UIBezierPath的知识内容

    使用CAShapeLayer与UIBezierPath可以实现不在view的drawRect方法中就画出一些想要的图形 . 1:UIBezierPath: UIBezierPath是在 UIKit 中 ...

  8. CAShapeLayer(UIBezierPath)、CAGradientLayer绘制动态小车

    看到一个大神写的代码,引用过来让大家看看! //  1.CAShapeLayer是一种特殊的层,可以在上面渲染图形. //  2.CAShapeLayer继承自CALayer,可使用CALayer的所 ...

  9. H5坦克大战之【画出坦克】

    今天是个特殊的日子,圣诞节,也是周末,在这里先祝大家圣诞快乐!喜庆的日子,我们可以稍微放松一下,扯一扯昨天雷霆对战凯尔特人的比赛,这场比赛大威少又双叒叕拿下三双,而且是一个45+11+11的超级三双, ...

随机推荐

  1. 冒泡排序(Bubble Sort)

    常见的排序算法有Bubble Sort.Merge Sort.Quick Sort 等,所有排序算的基本法思想都是把一个无限大的数据规模通过算法一步步缩小,指导最后完成排序. 这里分享一下Buuble ...

  2. 对图片进行各种样式裁对图片进行各种样式裁剪:圆形、星形、心形、花瓣形等剪:圆形、星形、心形、花瓣形等--第三方开源--CustomShapeImageView

    CustomShapeImageView在github上的项目主页是:https://github.com/MostafaGazar/CustomShapeImageView 如果仅仅是需要获取圆形. ...

  3. Lua 常用的shell命令

    lua作为一种小巧的脚本语言,其函数等动作可以使用shell命令进行运行和调试,以下是几个常用的shell命令.基本格式是  lua [选项参数] [脚本参数] (1)%lua 程序名.lua     ...

  4. 【转载】MySQL innodb_table_stats表不存在的解决方法

    MySQL 版本 5.6.14 公司有几台MySQL服务器的错误日志显示,有几个系统表不存在.innodb_table_statsinnodb_index_statsslave_master_info ...

  5. epoll分析

      Epoll详解及源码分析 1.什么是epoll epoll是当前在Linux下开发大规模并发网络程序的热门人选,epoll 在Linux2.6内核中正式引入,和select相似,都是I/O多路复用 ...

  6. Project Settings -> Editor 设置详解

    Default Behavior Mode (默认行为模式) 定义项目在导入Assets时的默认导入设置,当设置为3D模式时,Unity假设将导入的文件创建为纹理类型(如:PNG文件):当设置为2D时 ...

  7. Ffmpeg 定位文件(seek file)

    有朋友问到ffmpeg播放文件如何定位问题,我想到应该还有一些新手朋友对这一块比较陌生.ffmpeg定位问题用到seek方法,代码 如下: void SeekFrame(AVFormatContext ...

  8. MST性质(用于构造最小生成树)

    描述:假设N=(V,{E})是一个连通网,U是顶点集V的一个非空子集.若(u,v)是一条具有最小权值(代价)的边,其中u∈U,v∈V-U,则必存在一棵包含边(u,v)的最小生成树. 证明: 假设网N的 ...

  9. 通过email分享

    MFMailComposeViewController *mailC=[[MFMailComposeViewControlleralloc] init]; if ([MFMailComposeView ...

  10. 【UVA】【11762】Race to 1(得到1)

    数学期望/马尔可夫过程 DP/记忆化搜索 刘汝佳老师白书上的例题…… //UVA 11762 #include<vector> #include<cstdio> #includ ...