button渐变色 ios_UIButton 背景色渐变动画

最新推荐文章于 2024-04-29 11:04:08 发布
最新推荐文章于 2024-04-29 11:04:08 发布
阅读量1k 收藏 1
点赞数
文章标签： button渐变色 ios
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_32063287/article/details/114161932
版权

项目有个需求需要UIButton上的背景色是渐变动画的效果，如下。

73a9ab4c5639ee7dfe0412e1303bb4e2.gif

实现原理

CAGradientLayer 用于实现渐变效果，CABasicAnimation用于对Layer做动画

源码:https://github.com/LSnumber1/...

思路

看gif图我们发现动画是从右到左，颜色一直渐变向左滑动的，把效果拆解下，可以分为两部分：

实现颜色的阶梯变化

对实现的阶梯颜色做动画

颜色阶级渐变

初始化一个CAGradientLayer，他的frame的宽高和UIButton的一致。

var caGradientLayer = CAGradientLayer()

caGradientLayer?.frame = CGRect(x: 0, y: 0, width: 200, height: 50)

CAGradientLayer涉及到一个坐标，该坐标体系以左上角为圆点(0，0)，右下角为终点(1，1)

a0404acb8b7b24cbd2e8ddded20e738e.png

CAGradientLayer的startPoint是绘制阶级颜色的起始点&

最低0.47元/天 解锁文章
非流
关注
  • 0
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
button渐变色 ios_ios开发
weixin_29811891的博客
12-29 443
这些坑踩的好疼个人的域名和blog搭建好了有一段时间，但是一直没有抽时间来写自己的blog。所以就抽了一点时间来记录一下，最近项目中遇到的一些坑。言归正传，最近的项目中，UI的设计图里出了一个渐变色的按钮，而且按钮点击的时候还需要一个透明度为0.3的黑色遮盖在渐变色上。然后，坑就开始了。第一个大坑(hitTest:withEvent:)我实现的大体思路是把渐变色绘制成image设置成按钮的背景图，...
UIButton 背景色渐变动画
一品大帅的专栏
04-17 2885
项目有个需求需要UIButton上的背景色是渐变动画的效果，如下。 实现原理 CAGradientLayer 用于实现渐变效果，CABasicAnimation用于对Layer做动画 源码:https://github.com/LSnumber1/ButtonColorGradientAnimation 思路 看gif图我们发现动画是从右到左，颜色一直渐变向左滑...
jbutton 按钮 圆角 渐变色
a704397849的博客
04-29 231
鼠标按压时背景色改变。
button渐变色 ios_总结iOS实现渐变颜色的三种方法
weixin_39847556的博客
12-19 444
在iOS开发过程中有的时候会需要用到渐变的颜色，这篇文章总结了三种方法来实现，有需要的朋友们下面来一起看看吧。一、CAGradientLayer实现渐变CAGradientLayer是CALayer的一个特殊子类，用于生成颜色渐变的图层，使用较为方便下面介绍下它的相关属性：colors 渐变的颜色locations 渐变颜色的分割点startPoint&endPoint 颜色渐变的方向，范...
button渐变色 ios_iOS一个方法搞定view渐变色
weixin_36212198的博客
02-15 371
Code使用效果//包含头文件UIView+Gradient.h[self.label az_setGradientBackgroundWithColors:@[[UIColor redColor],[UIColor orangeColor]] locations:nil startPoint:CGPointMake(0, 0) endPoint:CGPointMake(1, 0)];[self....
iOS UIButton 渐变色、边框渐变色、字体渐变色
xixi
02-17 5666
需求： 1、UIButton 的背景需要渐变色 2、UIButton 的边框需要渐变色，背景是白色，字体也需要渐变色 需求一 ： UIButton 的背景需要渐变色： 思路： 我们可以利用 CAGradientLayer 来做渐变色 然而我不是直接套在UIButton 的layer 上面进行操作。 我是 1、 首先创建一个临时的 UIView 2、 然后利用 CAGradientLayer...
ios开发UIButton背景色渐变
热门推荐
ly410726的专栏
07-27 1万+
UIButton *thirdBtn = [UIButton buttonWithType:UIButtonTypeCustom]; thirdBtn.frame = CGRectMake(10, 50, 200, 44); CAGradientLayer *gradientLayer = [CAGradientLayer layer]; gradientLayer....
iOS开发值button(按钮)设计渐变背景色
坤宇的博客
08-20 1930
- (UIButton *)oneClickBtn{ if(_oneClickBtn == nil){ _oneClickBtn = [UIButton buttonWithType:UIButtonTypeCustom]; [_oneClickBtn addTarget:self action:@selector(oneClickMethod) forCo...
UIButton设置渐变色背景
gaoyp的专栏
08-02 2515
-(void)setBottomButton{ CGFloat w = 345*SCALE; CGFloat h = 50*SCALE; UIButton *button = [UIButton buttonWithType:UIButtonTypeCustom]; [self.view addSubview:button]; ...
iOS实现渐变按钮Gradient Button的方法示例
01-20
渐变色按钮（Gradient Button）是一种流行的设计元素，可以增加UI的视觉吸引力。本文将详细介绍如何在iOS中使用Category来实现渐变按钮，同时提供不同的实现方法供开发者参考。 首先，我们需要了解渐变色的概念。...
实现渐变色按钮(button)效果
04-03
该效果支持实现了不要任何的图片的效果就可以实现渐变色按钮button，同时也可以自定义任何颜色的渐变，都是采用了纯代码来编写实现的，并且还提供4种不同的渐变方式的效果，效果代码主要实现成UIButton子类型，...
ios-渐变色按钮.zip
07-11
在"STGradientButton.swift"中，开发者通常会定义一个自定义的UIButton子类，比如`STGradientButton`，通过扩展按钮的默认功能来支持渐变色。以下是一些可能的关键实现点： 1. **属性设置**：定义两个CGColor变量，...
swift-自定义背景色渐变的Button
08-15
在这个场景中，我们关注的是如何创建一个背景色具有渐变效果的Button，这通常用于制作更吸引人的用户界面。`XMColorButton`可能是一个开源项目，用于实现这种效果。下面将详细介绍如何在Swift中实现自定义背景色渐变...
pi_heif-0.17.0-pp310-pypy310_pp73-macosx_12_0_x86_64.whl
07-27
pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。
mmexport1722080103662.jpg
07-27
mmexport1722080103662.jpg
matlab 20244a 6
07-27
matlab 20244a 6
pi_heif-0.17.0-cp310-cp310-macosx_12_0_x86_64.whl
最新发布
07-27
pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。
pillow-10.4.0-cp312-cp312-musllinux_1_2_aarch64.whl
07-27
基本介绍 名称与起源：Pillow，原名为PIL（Python Imaging Library），但PIL只支持Python 2版本。随着Python 3的普及，Pillow作为PIL的一个分支出现，兼容Python 3并提供更多的功能和改进。 主要功能：Pillow支持多种图像格式的打开、保存、显示以及基本的图像操作和处理，如裁剪、缩放、旋转、翻转、滤镜应用等。 跨平台性：Pillow库可以在不同的操作系统上运行，包括Windows、Linux和MacOS等。 主要功能模块 Pillow库包含多个功能模块，每个模块都提供了特定的图像处理功能。以下是一些常用的模块： Image：用于处理图像文件，提供打开、保存、调整大小、旋转、裁剪、滤镜等功能。 ImageDraw：提供在图像上绘制各种形状（如线条、矩形、圆形）和文本的功能。 ImageFont：用于加载和使用TrueType字体文件，以便在图像上绘制文本时设置字体样式、大小和颜色。 ImageFilter：提供各种滤镜效果，如模糊、锐化、边缘增强等，用于图像增强、特效处理和图像识别等应用。 ImageEnhance：用于调整图像的亮度、对比度、颜色饱和度等参数，使图像更加清晰、明亮或具有特定的调色效果。 高级功能 除了基本的图像处理功能外，Pillow还支持一些高级功能，如色彩空间转换、直方图均衡化等。这些功能可以帮助用户进行更复杂的图像处理和分析。
ios按钮背景渐变色OC代码实现
08-19
可以使用以下代码来实现 iOS 按钮的背景渐变色：CAGradientLayer *gradient = [CAGradientLayer layer]; gradient.frame = self.btn.bounds; gradient.colors = [NSArray arrayWithObjects:(id)[[UIColor whiteColor...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值