swift - layer - 渐变色 - CAGradientLayer
知道控件的frame ,创建控件时候直接加上 渐变色
// 创建背景渐变色button(通用于View or Controller底部按钮),bounds计算后传入
static func createGradientButton(font: UIFont = UIFont.systemFont(ofSize: 14), textColor: UIColor = UIColor.white, titleStr: String? = nil,bounds:CGRect) -> UIbutton {
let btn = UIButton(type: .custom)
btn.translatesAutoresizingMaskIntoConstraints = false
btn.setTitle(titleStr, for: .normal)
btn.titleLabel?.font = font
btn.setTitleColor(textColor, for: .normal)
btn.backgroundColor = UIColor.clear
let caGradientLayer:CAGradientLayer = CAGradientLayer()
caGradientLayer.colors = [UIColor(hexString: "#E0AD7D").cgColor,UIColor(hexString: "#FFE8C9").cgColor]
caGradientLayer.locations = [0, 1]
caGradientLayer.startPoint = CGPoint(x: 0, y: 1)
caGradientLayer.endPoint = CGPoint(x: 0.8, y: 1)
caGradientLayer.frame = bounds
btn.layer.insertSublayer(caGradientLayer, at: 0)
return btn
}
2. 不知道 frame
1。创建 渐变色
/// 渐变色:默认从上到下
private var gradientLayer: CAGradientLayer = {
let g = CAGradientLayer()
g.colors = [UIColor.init(hexColor: "DBB479").cgColor,
UIColor.init(hexColor: "F7E1B3").cgColor]
//改为从左到右 的渐变
g.startPoint = CGPoint(x: 0, y: 0)
g.endPoint = CGPoint(x: 1, y: 0)
return g
}()
2.给指定view 添加渐变色
/// 荣誉背景图
private lazy var credibilityBgView : UIView = {
let v = UIView()
v.layer.addSublayer(self.gradientLayer)
v.translatesAutoresizingMaskIntoConstraints = false
v.layer.cornerRadius = 5
v.layer.masksToBounds = true
v.isUserInteractionEnabled = true
v.addGestureRecognizer(UITapGestureRecognizer(target: self, action: #selector(clcikCredibilityBgView)))
return v
}()
3. 在自定义的view中 设置 渐变色frame:draw
override func draw(_ rect: CGRect) {
super.draw(rect)
gradientLayer.frame = credibilityBgView.bounds
}
4.如果在控制器里面,viewDidLayoutSubviews
override func viewDidLayoutSubviews() {
super.viewDidLayoutSubviews()
nextBtnAddLayer()
}
/// 下一步按钮添加渐变色
func nextBtnAddLayer(){
let gradient = CAGradientLayer()
gradient.colors = [UIColor.init(hexString: "#FD904B").cgColor,
UIColor.init(hexString: "#FFA64D").cgColor ]
//改为从左到右 的渐变
gradient.startPoint = CGPoint(x: 0, y: 0)
gradient.endPoint = CGPoint(x: 1, y: 0)
nextBtn.layer.insertSublayer(gradient, at: 0)
gradient.frame = nextBtn.bounds
}
注意 直接用addSubLayer 会遮盖住 子控件, 使用insertSublayer 不会有问题

上面 是同一个渐变色的 colors 更换,
//渐变色
private lazy var caGradientLayer : CAGradientLayer = {
let caGradientLayer:CAGradientLayer = CAGradientLayer()
caGradientLayer.colors = []
caGradientLayer.locations = [0, 1]
caGradientLayer.startPoint = CGPoint(x: 0, y: 1)
caGradientLayer.endPoint = CGPoint(x: 0.8, y: 1)
return caGradientLayer
}() /// 渐变色颜色
private lazy var cgColors: (normal: [CGColor] , select: [CGColor] ) = ([] , []) /// 渐变色 更改 颜色
/// - Parameters:
/// - basicAnimationKeyPath: 动画对应的唯一标示
/// - animationKey: 渐变色 添加的 动画 唯一标示
/// - toChangeColors: 改变的颜色数组
/// - duration: 动画时间
private func addAnimationForCaGradientLayer(basicAnimationKeyPath:String,
animationKey:String,
toChangeColors:[CGColor],
durationTime:CFTimeInterval = 0.05){
//添加渐变动画
let colorChangeAnimation = CABasicAnimation(keyPath: basicAnimationKeyPath)
colorChangeAnimation.delegate = self
colorChangeAnimation.duration = durationTime
colorChangeAnimation.toValue = toChangeColors
colorChangeAnimation.fillMode = CAMediaTimingFillMode .forwards
colorChangeAnimation.isRemovedOnCompletion = false
caGradientLayer.add(colorChangeAnimation, forKey: animationKey)
} 开始定时器是
self.addAnimationForCaGradientLayer(basicAnimationKeyPath: "colorSelected", animationKey: "colorChangeToSelected", toChangeColors: self.cgColors.select) 然后倒计时结束的时候
self.setTitle("重新发送", for: .normal)
self.addAnimationForCaGradientLayer(basicAnimationKeyPath: "colorNormal", animationKey: "colorChangeToNormal", toChangeColors: self.cgColors.normal)
swift - layer - 渐变色 - CAGradientLayer的更多相关文章
- OCiOS开发:CAGradientLayer 渐变色
OCiOS开发:CAGradientLayer 渐变色 CAGradientLayer 简介 CAGradientLayer是CALayer图层类的子类,用于处理渐变色的层结构. CAGradient ...
- Swift - LineChart绘制折线图
LineChart,就使用Core Graphics和QuartzCore框架中的CAShapeLayer绘制.这样执行效率明显比堆砌UIView的方法效率高--占用资源少,执行快. 看看CALaye ...
- swift:打造你自己的折线图
看到苹果Health里的折线图了吗.我们就是要打造一个这样的折线图.没看过的请看下图. 我们的主题在于折线图本身.其他的包括步数.日平均值等描述类的内容这里就不涉及了. 首先观察,这个图种包含些什么组 ...
- iOS—Mask属性的使用
Mask属性介绍 Mask平时用的最多的是masksToBounds 吧. 其实除此以外Mask使用场景很多,看完之后你会发现好真是好用的不要不要的... 先来了解下Mask属性到底是什么? Mask ...
- iOS 开发技巧-制作环形进度条
有几篇博客写到了怎么实现环形进度条,大多是使用Core Graph来实现,实现比较麻烦且效率略低,只是一个小小的进度条而已,我们当然是用最简单而且效率高的方式来实现. 先看一下这篇博客,博客地址:ht ...
- iOS一分钟学会环形进度条
有几篇博客写到了怎么实现环形进度条,大多是使用Core Graph来实现,实现比较麻烦且效率略低,只是一个小小的进度条而已,我们当然是用最简单而且效率高的方式来实现.先看一下这篇博客,博客地址:htt ...
- iOS圆弧渐变进度条的实现
由于项目需要一个环形渐变进度条显示课程,这方便网上的确有很多相关资料但是,都是比较零散的而且,大多数只是放一堆代码就算完了.这里我想详细写一篇我自己实现这个进度条的过程. 实现一个圆弧进度条主要分为三 ...
- 在iOS 4中创建一个LDGradientView样式的渐变视图
本教程将演示如何在 Swift 4 中创建一个多功能的.@IBDesignable 样式的渐变视图类.你可以将 CAGradientView 放到 storyboard 中,并在设计时预览,或者以编程 ...
- 渐变UI
1.h #import <UIKit/UIKit.h> @interface UIView (Gradient) /* The array of CGColorRef objects de ...
随机推荐
- WDA-3-ALV查询
主要是梳理下WebDynpro For ABAP开发过程: 1.创建WebDynpro组件 2.创建WebDynpro应用 1.创建WebDynpro组件 1.1创建 路径:选择Package--&g ...
- jquery查找筛选器
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- 命名空间与use
以下是自己读PHP手册命名空间这一节的一些笔记,还有自己上机做命名空间测试的一些整理,原创博客,有错欢迎指正: 1.命名空间声明必须是第一条语句,若没有声明命名空间的脚本,则被认为是全局空间的脚本.若 ...
- 函数mmap()的使用
函数mmap是linux的一个系统函数.如下: 函数原型:void *mmap(void *addr, size_t length, int prot, int flags,int fd, off_t ...
- js实现ctrl+v粘贴上传图片(兼容chrome、firefox、ie11)【转载】
我们或多或少都使用过各式各样的富文本编辑器,其中有一个很方便功能,复制一张图片然后粘贴进文本框,这张图片就被上传了,那么这个方便的功能是如何实现的呢? 原理分析 提取操作:复制=>粘贴=> ...
- Oracle重建表空间操作实例
由于环境维护或者性能测试需要,经常需要对表空间进行重建操作.重建表空间操作主要分3中情况介绍,分别是业务表空间.临时表空间和回滚段表空间的重建. 重建业务表空间 由于业务规划要求,重建后的业务表空间名 ...
- 16.1 用auth0服务 实现用登录和管理 使用auth版本的2个大坑。
这是三周内容,实现用户登录和管理 回到master分支 切换到 han分支 更新一下 然后工作 开始工作写代码了 安装2个angular端的auth0的lib,也可不安装,后边有不安装的做法 不安装的 ...
- Jsp基本语法 第二章
今天是星期天,我学习了关于Jsp的一些基本页面元素 首先学习了一些基本页面注释 1.HTML的注释 <!-- htmI注释-->// 客户端可见 2.JSP的注释: <%-- ...
- 法门扫地僧总结vue面试题(部分来源网络)
Front-End 前端开发工程师面试宝典! (本文部分有转载,不定期更新!) 前言(README.md) 本仓库是我整理的前端常见面试题,大部分由我整理,其中个别部分参考 ...
- 吴裕雄 14-MySQL DELETE 语句
以下是 SQL DELETE 语句从 MySQL 数据表中删除数据的通用语法:DELETE FROM table_name [WHERE Clause]如果没有指定 WHERE 子句,MySQL 表中 ...