iOS 渐变进度条
#import <UIKit/UIKit.h>
@interface JianBianView : UIView
//为了增加一个表示进度条的进行,可们可以使用mask属性来屏蔽一部分
@property (nonatomic, strong) CALayer *maskLayer;
@property (nonatomic, assign) CGFloat progress;
//动画方法
-(void)performAnimation;
-(void)setProgress:(CGFloat)value;
@end
#import "JianBianView.h"
@implementation JianBianView
@synthesize maskLayer,progress;
+(Class)layerClass
{
//设置默认是 CAGradientLayer
return [CAGradientLayer class];
}
-(id)initWithFrame:(CGRect)frame
{
self = [super initWithFrame:frame];
if (self)
{
maskLayer = [CALayer layer];
[maskLayer setFrame:CGRectMake(0, 0, 0, frame.size.height)];
[maskLayer setBackgroundColor:[UIColor blackColor].CGColor];
CAGradientLayer *layer = (id)[self layer];
[layer setStartPoint:CGPointMake(0.0, 0.5)];
[layer setEndPoint:CGPointMake(1.0, 0.5)];
NSMutableArray *colors = [[NSMutableArray alloc] init];
for (NSInteger hue = 0; hue < 360; hue += 5)
{
UIColor *color;
//hue 色调 saturation 饱和度 brightness 亮度
color = [UIColor colorWithHue:1.0*hue/360.0 saturation:1.0 brightness:1.0 alpha:1.0];
[colors addObject:(id)[color CGColor]];
}
[layer setColors:[NSArray arrayWithArray:colors]];
[layer setMask:maskLayer];
}
return self;
}
//创建一个宽度为0的mask覆盖整个View,mask的颜色不重要,当我们progress属性更新的时候我们会增加它的宽度 然后在initWithFrame:里面添加:
/*
maskLayer = [CALayer layer];
[maskLayer setFrame:CGRectMake(0, 0, 0, frame.size.height)];
[maskLayer setBackgroundColor:[UIColor blackColor].CGColor];
*/
//所以重写setProgress:
-(void)setProgress:(CGFloat)value
{
if (progress != value)
{
progress = MIN(1.0, fabs(value));
[self setNeedsLayout];
}
}
-(void)layoutSubviews
{
CGRect maskRect = [maskLayer frame];
maskRect.size.width = CGRectGetWidth([self bounds]) * progress;
[maskLayer setFrame:maskRect];
}
-(void)performAnimation
{
// Move the last color in the array to the front
// shifting all the other colors.
CAGradientLayer *layer = (id)[self layer];
NSMutableArray *mutable = [[layer colors] mutableCopy];
id lastColor = [mutable lastObject];
[mutable removeLastObject];
[mutable insertObject:lastColor atIndex:0];
NSArray *shiftColors = [NSArray arrayWithArray:mutable];
[layer setColors:shiftColors];
CABasicAnimation *animation;
animation = [CABasicAnimation animationWithKeyPath:@"Colors"];
[animation setToValue:shiftColors];
[animation setDuration:0.08];
[animation setRemovedOnCompletion:YES];
[animation setFillMode:kCAFillModeForwards];
[animation setDelegate:self];
[layer addAnimation:animation forKey:@""];
}
-(void)animationDidStop:(CAAnimation *)anim finished:(BOOL)flag
{
[self performAnimation];
}
@end
视图控制器 调用
- (void)viewDidLoad
{
[super viewDidLoad];
// Do any additional setup after loading the view, typically from a nib.
self.title = @"渐变测试";
self.view.backgroundColor = [UIColor whiteColor];
// [self jianBianMethord];
[NSTimer scheduledTimerWithTimeInterval:1.0 target:self selector:@selector(timeMethod) userInfo:nil repeats:YES];
[self addJianBianView];
}
-(void)timeMethod
{
NSLog(@"进入");
progress += 0.1;
[self.jianBianView setProgress:progress];
}
//-----------添加渐变view
-(void)addJianBianView
{
if (self.jianBianView == nil)
{
self.jianBianView = [[JianBianView alloc] initWithFrame:CGRectMake(0, 100, self.view.frame.size.width, 10)];
[self.view addSubview:self.jianBianView];
[self.jianBianView performAnimation];
}
}
iOS 渐变进度条的更多相关文章
- 【iOS】环形渐变进度条实现
之前有人在找渐变进度条的效果,闲来无事就顺手写了一个,然后画了视图层级,方便讲解. 环境信息: Mac OS X 10.10.3 Xcode 6.3.1 iOS 8.3 效果图: 源码下载地址: ht ...
- iOS圆弧渐变进度条的实现
由于项目需要一个环形渐变进度条显示课程,这方便网上的确有很多相关资料但是,都是比较零散的而且,大多数只是放一堆代码就算完了.这里我想详细写一篇我自己实现这个进度条的过程. 实现一个圆弧进度条主要分为三 ...
- 自定义控件之圆形颜色渐变进度条--SweepGradient
前几天在群里面有人找圆形可颜色渐变进度条,其中主要的知识点是SweepGradient: mSweepGradient = new SweepGradient(240, 360, new int[] ...
- iOS 自定义进度条
自定义条形进度条(iOS) ViewController.m文件 #import "ViewController.h" @interface ViewController () @ ...
- [iOS]圆形进度条及计时功能
平时用战网安全令的时候很喜欢圆形倒计时的效果,然后简单看了一下Android的圆形进度条,后来又写了一个IOS的.整体界面参照IOS系统的倒计时功能,顺便熟悉了UIPickerView的一些特性的实现 ...
- android自己定义渐变进度条
项目中须要用到一个弧形渐变的进度条,通过android自带是不能实现的.我是没有找到实现的方法,有大神知道的能够指点.效果图是以下这种 这是通过继承VIew来绘制出来的,网上也有相似的,可是代码那是相 ...
- vue 渐变 进度条 progress
废话 不多少说 ,直接上代码 新建文件 gradual-progress.vue <!-- * @Author: gfc * @Date: 2019-11-07 14:00:11 * @Last ...
- svg和css3创建环形渐变进度条
在负责的项目中,有一个环形渐变读取进度的效果的需求,于是在网上查阅相关资料整理一下.代码如下: <!DOCTYPE html> <html lang="en"&g ...
- canvas锥形渐变进度条
从一个渐变圆角进度条浅出画一个圆 开始 这一切需要从一个(简单)的需求开始,在最开始对设计第一眼看到这张图的时候,感觉挺简单的嘛,直接用echarts饼图模拟出来一个就好了 echarts 然后上ec ...
随机推荐
- web storage和cookie的区别
Web Storage的概念和cookie相似,区别是它是为了更大容量存储设计的.Cookie的大小是受限的,并且每次你请求一个新的页面的时候Cookie都会被发送过去,这样无形中浪费了带宽,另外co ...
- java selenium针对多种情况的多窗口切换
一.通过按钮点击打开的新页面,不涉及到打开多窗口,只要在已有打开的窗口实现切换操作即可 Set<String> winHandels = driver.getWindowHandles() ...
- HDMI之CEC DDC学习笔记(可能有误)
1 HDMI的音视频通路,有待学习: 2 DDC通路,大致是个IIC接口,读取上游器件的EDID或者E-EDID数据: EDID的前128字节数据格式如下:(可能有不同版本,格式可能有区别)
- Ajax&Java
AJAX即“Asynchronous Javascript And XML”(异步JavaScript和XML) 是一种基于浏览器的XMLHttpRequest对象实现的创建交互式网页应用的网页开发技 ...
- MVC5+EF6 入门完整教程八
本篇是相对独立的一篇,主要讲解不丢失数据进行数据库结构升级. 前面我们讲解EF功能时,已经介绍过一种更新数据库的方式: EF比较model和database,如果两边不一致,程序将会drop and ...
- MySql 获取当前节点及递归所有上级节点
-- MySql 获取当前节点及递归所有上级节点 -- 参数说明:resultField:查询返回字段,idd 要查询的资源ID值,idFieldName ID字段名,parentIdFieldNam ...
- vue 中使用 AJAX获取数据的方法
在VUE开发时,数据可以使用jquery和vue-resource来获取数据.在获取数据时,一定需要给一个数据初始值. 看下例: <script type="text/javascri ...
- mysql数据库使用
C#操作Mysql数据库的存储过程,网址 DATEDIFF() 函数返回两个日期之间的天数. 语法 DATEDIFF(date1,date2) date1 和 date2 参数是合法的日期或日期/时间 ...
- python基础教程-第三章-使用字符串
本章将会介绍如何使用字符串何世华其他的值(如打印特殊格式的字符串),并简单了解下利用字符串的分割.联接.搜索等方法能做些什么 3.1 基本字符串操作 所有标准的序列操作(索引.分片.乘法.判断成员资格 ...
- C++中的字面值指定类型
C++中只有内置类型存在字面值,没有类(class)类型字面值.例如:0是int类型的字面值,3.14159是double类型的字面值. 字面值类型很多 整型浮点字面值 20 ...