iOS 开发之环形倒计时进度条(虚线/实线)
代码很简单,一看便知。这里为顺时针,若想要逆时针,clockwise改为0,还需更改起始角度和终点角度。
源码地址:https://github.com/LfyDragon/CountDown
直接上代码:- (void)drawRect:(CGRect)rect {
CAShapeLayer *shapeLayer = [CAShapeLayer layer];
shapeLayer.frame = self.bounds;
UIBezierPath *path = [UIBezierPath bezierPathWithArcCenter:CGPointMake(self.frame.size.width/, self.frame.size.height/) radius:self.frame.size.height/ startAngle:-M_PI_2 endAngle:M_PI*/ clockwise:];
shapeLayer.path = path.CGPath;
shapeLayer.fillColor = [UIColor clearColor].CGColor;
shapeLayer.lineWidth = 10.0f; if ([self.flag isEqualToString:@"track"]) {
shapeLayer.strokeColor = [UIColor colorWithRed:/255.0f green:/255.0f blue:/255.0f alpha:].CGColor;
} else{
shapeLayer.strokeColor = [UIColor colorWithRed:/255.0f green:/255.0f blue:/255.0f alpha:].CGColor;
} //每个虚线长度为2,间隔为3 这句设置线条为虚线,去掉即为实线
shapeLayer.lineDashPattern = [NSArray arrayWithObjects:[NSNumber numberWithInt:], [NSNumber numberWithInt:], nil];
[self.layer addSublayer:shapeLayer]; if ([self.flag isEqualToString:@"process"]) {
CABasicAnimation *pathAnima = [CABasicAnimation animationWithKeyPath:@"strokeEnd"];
pathAnima.duration = self.time;
pathAnima.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionLinear];
pathAnima.fromValue = [NSNumber numberWithFloat:0.0f];
pathAnima.toValue = [NSNumber numberWithFloat:1.0f];
pathAnima.fillMode = kCAFillModeForwards;
pathAnima.removedOnCompletion = NO;
[shapeLayer addAnimation:pathAnima forKey:@"strokeEndAnimation"];
} } 随手截个图:
iOS 开发之环形倒计时进度条(虚线/实线)的更多相关文章
- 【iOS】环形渐变进度条实现
之前有人在找渐变进度条的效果,闲来无事就顺手写了一个,然后画了视图层级,方便讲解. 环境信息: Mac OS X 10.10.3 Xcode 6.3.1 iOS 8.3 效果图: 源码下载地址: ht ...
- 【原】Github系列之三:开源iOS下 渐变颜色的进度条WGradientProgress
概述 今天我们来实现一个iOS平台上的进度条(progress bar or progress view).这种进度条比APPLE自带的更加漂亮,更加有“B格”.它拥有渐变的颜色,而且这种颜色是动态移 ...
- svg和css3创建环形渐变进度条
在负责的项目中,有一个环形渐变读取进度的效果的需求,于是在网上查阅相关资料整理一下.代码如下: <!DOCTYPE html> <html lang="en"&g ...
- android 开发-自定义多节点进度条显示
看效果图: 里面的线段颜色和节点图标都是可以自定义的. main.xml <RelativeLayout xmlns:android="http://schemas.android.c ...
- 【Android 应用开发】 自定义 圆形进度条 组件
转载著名出处 : http://blog.csdn.net/shulianghan/article/details/40351487 代码下载 : -- CSDN 下载地址 : http://down ...
- 【iOS开发-22】navigationBar导航条和navigationItem设置:基本搞定导航条上的文字和按钮以及各种跳转
http://blog.csdn.net/weisubao/article/details/39646739?utm_source=tuicool&utm_medium=referral (1 ...
- 基于css3的环形动态进度条(原创)
基于css3实现的环形动态加载条,也用到了jquery.当时的想法是通过两个半圆的转动,来实现相应的效果,其实用css3的animation也可以实现这种效果.之所以用jquery是因为通过jquer ...
- iOS开发之--实现倒计时显示时分秒
这段时间写公司的一个外包项目,需要用到倒计时:需要显示时分秒,通过在网上搜集资料,找到了2中方法,我把这两种方法结合起来,可以很好的满足这个需求: 1.创建一个类继承自UIlabel,用来展示时分秒的 ...
- Android开发 View_自定义圆环进度条View
前言 一个实现,空心圆环的自定义View,已经封装完好,可以直接使用. 效果图 代码 import android.content.Context; import android.graphics.C ...
随机推荐
- 发布上线前,先小秀一把俺的64位浏览器,速度那觉对是杠杠滴,上youtube,上google不费劲
发布上线前,先小秀一把俺的64位浏览器,速度那觉对是杠杠滴,上youtube,上google不费劲
- ASP.NET MVC 与NLog的使用
NLog是一个.NET 下一个完善的日志工具,个人已经在项目中使用很久,与ELMAH相比,可能EAMAH更侧重 APS.NET MVC 包括调试路由,性能等方面,而NLog则更简洁. github: ...
- 【nodejs】文件上传demo实现
文件结构: index.js var server = require('./server.js'); var router = require('./router.js'); var request ...
- 【转】linux sar命令详解
原文地址:http://lovesoo.org/linux-sar-command-detailed.html sar(System Activity Reporter系统活动情况报告)是目前 Lin ...
- Linux 启动过程详解
目录 1. Linux启动过程 2. 启动过程概述 3. 引导加载阶段 4. 内核阶段 4.1 内核加载阶段 4.2 内核启动阶段 5. 早期的用户空间 6. 初始化过程 6.1 SysV init ...
- MVC源码分析 - View续之Razor
过完年, 大家都忙碌起来了, 我也不例外. 不过并不是忙碌于去面试找工作, 而是忙碌于现在手上的工作. 闲话不多说了, 进入今天的主题. 一.Index页面在哪里 很奇怪, 在目录bin下面的dll文 ...
- WPF中的TextBlock隐藏边框
TextBlock默认是有边框的,显示效果如下:有一个淡蓝色的边框围绕着 如果需要隐藏这个边框,则只需要在代码中加上以下代码即可: BorderBrush="{x:Null}" B ...
- Python高级特性:迭代器和生成器
在Python中,很多对象都是可以通过for语句来直接遍历的,例如list.string.dict等等,这些对象都可以被称为可迭代对象.至于说哪些对象是可以被迭代访问的,就要了解一下迭代器相关的知识了 ...
- nodejs项目总结
前几天花了3天时间,搭建.开发了一个包含客户端.cms.server端的项目,也因着以前有php的开发经验,以及sql的设计和应用能力,倒也没遇到什么阻碍.至于项目结构搭建(架构),也是共通的,以模块 ...
- python服务器环境搭建Flask,uwsgi和nginx
python服务器环境搭建Flask,uwsgi和nginx 环境配置 服务器配置 [部署系统环境Ubuntu] 使用python的Flask框架搭建好网页后台后,便要开始将网站部署到服务器平台了. ...
