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 ...
随机推荐
- 链表有环判断,快慢指针两种方法/合并链表/删除重复元素/二分递归和while
public static boolean hasCycle(ListNode head) { if (head == null || head.next == null) { return fals ...
- Service的启动,绑定,绑定后通信,跨应用绑定,跨应用绑定后通信
Service介绍: 与Acitivity平级的Android四大组件之一,对比Activity而言,就是没有交互界面,且可以一直在后台执行,只用于处理下载,I/O等长时间信息交流的任务. Servi ...
- 命名空间与use
以下是自己读PHP手册命名空间这一节的一些笔记,还有自己上机做命名空间测试的一些整理,原创博客,有错欢迎指正: 1.命名空间声明必须是第一条语句,若没有声明命名空间的脚本,则被认为是全局空间的脚本.若 ...
- python笔记之强制函数以关键字参数传参
最近学习python,学到了函数传参,看到了以下这个特殊情况,特此来做个笔记 def add(*, x, y): print(x, y) 以上函数定义后,该怎么传参?前面的那个*号是做什么用的? 我们 ...
- gitbash上使用tree
gitbash上使用tree vscode从cmd设置gitbash之后,想在使用windows下的tree命令发现运行不了,有两种解决方案. 1,在gitbash上cmd //c tree,就等同c ...
- Windows下查看端口常用命令以及关闭端口的方法
1.C:\Users\JavaKam> netstat -ano|findstr 1099 TCP LISTENING TCP [::]: [::]: LISTENING 2.出现: C:\Us ...
- 网络层——IP报文头介绍
IP数据包也叫IP报文分组,传输在ISO网络7层结构中的网络层,它由IP报文头和IP报文用户数据组成,IP报文头的长度一般在20到60个字节之间,而一个IP分组的最大长度则不能超过65535个字节. ...
- C++ 关于MFC多线程编程中的一些注意事项 及自定义消息的处理
在多线程编程中,最简单的方法,无非就是利用 AfxBeginThread 来创建一个工作线程,看一下这个函数的说明: CWinThread* AFXAPI AfxBeginThread( AFX_T ...
- js 乘法 4.39*100 出现值不对问题解决
https://www.jianshu.com/p/a026245661bb //除法函数,用来得到精确的除法结果 //说明:javascript的除法结果会有误差,在两个浮点数相除的时候会比较明显. ...
- Java中的IO流(一)
一,IO流的分类 A,按照操作的对象不同可分为字节流与字符流 B,按照流的方向不同可分为输入(指从外部存储设备拿文件到内存)流也叫读与输出(指从内存把文件写入到外部存储设备)流也叫写 注:字节流可以操 ...