使用CAShapeLayer与UIBezierPath画出想要的图形
使用CAShapeLayer与UIBezierPath可以实现不在view的drawRect方法中就画出一些想要的图形
步骤:
1、新建UIBezierPath对象bezierPath
2、新建CAShapeLayer对象caShapeLayer
3、将bezierPath的CGPath赋值给caShapeLayer的path,即caShapeLayer.path = bezierPath.CGPath
4、把caShapeLayer添加到某个显示该图形的layer中
下面的小例子是一个环形的progress代码,有具体的使用方法
.h文件:
- #import <QuartzCore/QuartzCore.h>
- #import <UIKit/UIKit.h>
- @interface KACircleProgressView : UIView {
- CAShapeLayer *_trackLayer;
- UIBezierPath *_trackPath;
- CAShapeLayer *_progressLayer;
- UIBezierPath *_progressPath;
- }
- @property (nonatomic, strong) UIColor *trackColor;
- @property (nonatomic, strong) UIColor *progressColor;
- @property (nonatomic) float progress;//0~1之间的数
- @property (nonatomic) float progressWidth;
- - (void)setProgress:(float)progress animated:(BOOL)animated;
- @end
.m文件
- #import "KACircleProgressView.h"
- @implementation KACircleProgressView
- - (id)initWithFrame:(CGRect)frame
- {
- self = [super initWithFrame:frame];
- if (self) {
- // Initialization code
- _trackLayer = [CAShapeLayer new];
- [self.layer addSublayer:_trackLayer];
- _trackLayer.fillColor = nil;
- _trackLayer.frame = self.bounds;
- _progressLayer = [CAShapeLayer new];
- [self.layer addSublayer:_progressLayer];
- _progressLayer.fillColor = nil;
- _progressLayer.lineCap = kCALineCapRound;
- _progressLayer.frame = self.bounds;
- //默认5
- self.progressWidth = 5;
- }
- return self;
- }
- - (void)setTrack
- {
- _trackPath = [UIBezierPath bezierPathWithArcCenter:self.center radius:(self.bounds.size.width - _progressWidth)/ 2 startAngle:0 endAngle:M_PI * 2 clockwise:YES];;
- _trackLayer.path = _trackPath.CGPath;
- }
- - (void)setProgress
- {
- _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];
- _progressLayer.path = _progressPath.CGPath;
- }
- - (void)setProgressWidth:(float)progressWidth
- {
- _progressWidth = progressWidth;
- _trackLayer.lineWidth = _progressWidth;
- _progressLayer.lineWidth = _progressWidth;
- [self setTrack];
- [self setProgress];
- }
- - (void)setTrackColor:(UIColor *)trackColor
- {
- _trackLayer.strokeColor = trackColor.CGColor;
- }
- - (void)setProgressColor:(UIColor *)progressColor
- {
- _progressLayer.strokeColor = progressColor.CGColor;
- }
- - (void)setProgress:(float)progress
- {
- _progress = progress;
- [self setProgress];
- }
- - (void)setProgress:(float)progress animated:(BOOL)animated
- {
- }
- /*
- // Only override drawRect: if you perform custom drawing.
- // An empty implementation adversely affects performance during animation.
- - (void)drawRect:(CGRect)rect
- {
- // Drawing code
- }
- */
- @end
使用:
- - (void)viewDidLoad
- {
- [super viewDidLoad];
- // Do any additional setup after loading the view, typically from a nib.
- KACircleProgressView *progress = [[KACircleProgressView alloc] initWithFrame:CGRectMake(0, 0, 100, 100)];
- [self.view addSubview:progress];
- progress.trackColor = [UIColor blackColor];
- progress.progressColor = [UIColor orangeColor];
- progress.progress = .7;
- progress.progressWidth = 10;
- }
最后上一张效果图:
使用CAShapeLayer与UIBezierPath画出想要的图形的更多相关文章
- 使用CAShapeLayer的path属性与UIBezierPath画出扫描框
1.CAShapeLayer CAShapeLayer具有path属性,(是CGPath对象),可以使用这个属性与UIBezierPath画出想要的图形.该子类根据其fill color和stroke ...
- 使用CAShapeLayer和UIBezierPath画一个自定义半圆弧button
通常我们使用系统自带的UIButton时,一般都是Rect矩形形式的,或则美工给出一张半圆弧的按钮,如图为一张半圆加三角形的按钮,而此时,如果给按钮添加点击事件时,响应事件依然为矩形区域,不符合我们的 ...
- 用css画出三角形
看到有面试题里会有问到如何用css画出三角形 众所周知好多图形都可以拆分成三角形,所以说会了画三角形就可以画出很多有意思的形状 画出三角形的原理是调整border(边框)的四个方向的宽度,线条样式以及 ...
- 如何用css画出三角形
看到有面试题里会有问到如何用css画出三角形 众所周知好多图形都可以拆分成三角形,所以说会了画三角形就可以画出很多有意思的形状 画出三角形的原理是调整border(边框)的四个方向的宽度,线条样式以及 ...
- 用css画出三角形【转】
看到有面试题里会有问到如何用css画出三角形 众所周知好多图形都可以拆分成三角形,所以说会了画三角形就可以画出很多有意思的形状 画出三角形的原理是调整border(边框)的四个方向的宽度,线条样式以及 ...
- CSS画出的各种形状图
利用CSS可以画出各种需要的图形目录[1]矩形[2]圆形[3]椭圆[4]直角三角形[5]正三角形[6]平行四边形[7]梯形[8]六角星[9]六边形[10]五角星简单图形 矩形div{ width: 1 ...
- iOS关于CAShapeLayer与UIBezierPath的知识内容
使用CAShapeLayer与UIBezierPath可以实现不在view的drawRect方法中就画出一些想要的图形 . 1:UIBezierPath: UIBezierPath是在 UIKit 中 ...
- CAShapeLayer(UIBezierPath)、CAGradientLayer绘制动态小车
看到一个大神写的代码,引用过来让大家看看! // 1.CAShapeLayer是一种特殊的层,可以在上面渲染图形. // 2.CAShapeLayer继承自CALayer,可使用CALayer的所 ...
- H5坦克大战之【画出坦克】
今天是个特殊的日子,圣诞节,也是周末,在这里先祝大家圣诞快乐!喜庆的日子,我们可以稍微放松一下,扯一扯昨天雷霆对战凯尔特人的比赛,这场比赛大威少又双叒叕拿下三双,而且是一个45+11+11的超级三双, ...
随机推荐
- 1066. Root of AVL Tree (25)
An AVL tree is a self-balancing binary search tree. In an AVL tree, the heights of the two child sub ...
- Hadoop分布式安装
一.安装准备 1.下载hadoop,地址:http://hadoop.apache.org/,下载相应版本 2.下载JDK版本:Hadoop只支持1.6以上,地址:ht ...
- adbd cannot run as root in production builds
首先必须保证手机已经root过,可以通过以下验证: $ adb shell root@dior:/ $ su root@dior:/ # 1 2 3 执行命令后,$ 变为 # 即 root 成功 但是 ...
- 【css老版本浏览器兼容利器】ie-css3.htc
做前端的同学都应该听说或者用过,是一段脚本,可以让ie实现css3里的圆角和阴影效果. css带来的便利是很容易感受的到的,但恶心的是它在ie下的不兼容,所以某位牛人现身写了个ie-css3.htc, ...
- C++中用辗转相除法求两个数的最大公约数和最小公倍数
两个数的最大公约数:不能大于两个数中的最小值,算法口诀:小的给大的,余数给小的,整除返回小的,即最大公约数,(res=max%min)==0? max=min,min=res return min; ...
- Android journey3 @点击事件的4种写法
对于android布局中的控件,如Button等会有相应的点击事件去响应它所需要的功能,今天我们就以电话拨号器的代码说明下几种点击事件: package com.itheima.phone; impo ...
- SQL获取数据库名,表名,列名,说明等信息
由于最近工作涉及SQL语句较多,对一些不常见的SQL函数.及存储过程下面进行整理和描述,供大家分享: /************************************************ ...
- Caffe安装教程(原创)
转载请注明地址 说明:本文档参考自Caffe官网的安装说明,http://caffe.berkeleyvision.org/installation.html 如果对安装过程中,需要用到的依赖不明,请 ...
- 在eclipse里的 flex 没有可视化的编辑
注:在4.7版本里去掉了可视化编辑器. 转自:http://3470973.blog.51cto.com/3460973/1135328 最近eclipse切换了一个工作空间,创建的flex项 ...
- 巨大bug
//数据结构关于课程设计--------图书馆管理系统的设计 #include <stdio.h> #include <stdlib.h> #include <strin ...