1.h

#import <UIKit/UIKit.h>

@interface UIView (Gradient)

/* The array of CGColorRef objects defining the color of each gradient

* stop. Defaults to nil. Animatable. */

@property(nullable, copy) NSArray *colors;

/* An optional array of NSNumber objects defining the location of each

* gradient stop as a value in the range [0,1]. The values must be

* monotonically increasing. If a nil array is given, the stops are

* assumed to spread uniformly across the [0,1] range. When rendered,

* the colors are mapped to the output colorspace before being

* interpolated. Defaults to nil. Animatable. */

@property(nullable, copy) NSArray<NSNumber *> *locations;

/* The start and end points of the gradient when drawn into the layer's

* coordinate space. The start point corresponds to the first gradient

* stop, the end point to the last gradient stop. Both points are

* defined in a unit coordinate space that is then mapped to the

* layer's bounds rectangle when drawn. (I.e. [0,0] is the bottom-left

* corner of the layer, [1,1] is the top-right corner.) The default values

* are [.5,0] and [.5,1] respectively. Both are animatable. */

@property CGPoint startPoint;

@property CGPoint endPoint;

+ (UIView *_Nullable)gradientViewWithColors:(NSArray<UIColor *> *_Nullable)colors locations:(NSArray<NSNumber *> *_Nullable)locations startPoint:(CGPoint)startPoint endPoint:(CGPoint)endPoint;

- (void)setGradientBackgroundWithColors:(NSArray<UIColor *> *_Nullable)colors locations:(NSArray<NSNumber *> *_Nullable)locations startPoint:(CGPoint)startPoint endPoint:(CGPoint)endPoint;

@end

2.m

#import "UIView+Gradient.h"

#import <objc/runtime.h>

@implementation UIView (Gradient)

+ (Class)layerClass {

return [CAGradientLayer class];

}

+ (UIView *)gradientViewWithColors:(NSArray<UIColor *> *)colors locations:(NSArray<NSNumber *> *)locations startPoint:(CGPoint)startPoint endPoint:(CGPoint)endPoint {

UIView *view = [[self alloc] init];

[view setGradientBackgroundWithColors:colors locations:locations startPoint:startPoint endPoint:endPoint];

return view;

}

- (void)setGradientBackgroundWithColors:(NSArray<UIColor *> *)colors locations:(NSArray<NSNumber *> *)locations startPoint:(CGPoint)startPoint endPoint:(CGPoint)endPoint {

NSMutableArray *colorsM = [NSMutableArray array];

for (UIColor *color in colors) {

[colorsM addObject:(__bridge id)color.CGColor];

}

self.colors = [colorsM copy];

self.locations = locations;

self.startPoint = startPoint;

self.endPoint = endPoint;

}

#pragma mark- Getter&Setter

- (NSArray *)colors {

return objc_getAssociatedObject(self, _cmd);

}

- (void)setColors:(NSArray *)colors {

objc_setAssociatedObject(self, @selector(colors), colors, OBJC_ASSOCIATION_COPY_NONATOMIC);

if ([self.layer isKindOfClass:[CAGradientLayer class]]) {

[((CAGradientLayer *)self.layer) setColors:self.colors];

}

}

- (NSArray<NSNumber *> *)locations {

return objc_getAssociatedObject(self, _cmd);

}

- (void)setLocations:(NSArray<NSNumber *> *)locations {

objc_setAssociatedObject(self, @selector(locations), locations, OBJC_ASSOCIATION_COPY_NONATOMIC);

if ([self.layer isKindOfClass:[CAGradientLayer class]]) {

[((CAGradientLayer *)self.layer) setLocations:self.locations];

}

}

- (CGPoint)startPoint {

return [objc_getAssociatedObject(self, _cmd) CGPointValue];

}

- (void)setStartPoint:(CGPoint)startPoint {

objc_setAssociatedObject(self, @selector(startPoint), [NSValue valueWithCGPoint:startPoint], OBJC_ASSOCIATION_RETAIN_NONATOMIC);

if ([self.layer isKindOfClass:[CAGradientLayer class]]) {

[((CAGradientLayer *)self.layer) setStartPoint:self.startPoint];

}

}

- (CGPoint)endPoint {

return [objc_getAssociatedObject(self, _cmd) CGPointValue];

}

- (void)setEndPoint:(CGPoint)endPoint {

objc_setAssociatedObject(self, @selector(endPoint), [NSValue valueWithCGPoint:endPoint], OBJC_ASSOCIATION_RETAIN_NONATOMIC);

if ([self.layer isKindOfClass:[CAGradientLayer class]]) {

[((CAGradientLayer *)self.layer) setEndPoint:self.endPoint];

}

}

3.调用

- (void)gradientTest {

self.view.backgroundColor = [UIColor whiteColor];

UILabel *label = [[UILabel alloc] initWithFrame:CGRectMake(0, 80, 200, 30)];

UIButton *btn = [[UIButton alloc] initWithFrame:CGRectMake(0, 120, 200, 30)];

UIView *tempView = [[UIView alloc] initWithFrame:CGRectMake(0, 160, 200, 30)];

UIImageView *imageView = [[UIImageView alloc] initWithFrame:CGRectMake(0, 200, 200, 30)];

[self.view addSubview:label];

[self.view addSubview:btn];

[self.view addSubview:tempView];

[self.view addSubview:imageView];

label.backgroundColor = [UIColor clearColor];

btn.backgroundColor = [UIColor blueColor];

tempView.backgroundColor = [UIColor blueColor];

imageView.backgroundColor = [UIColor blueColor];

[label setGradientBackgroundWithColors:@[[UIColor redColor],[UIColor orangeColor]] locations:nil startPoint:CGPointMake(0, 0) endPoint:CGPointMake(1, 0)];

[btn setGradientBackgroundWithColors:@[[UIColor redColor],[UIColor orangeColor]] locations:nil startPoint:CGPointMake(0, 0) endPoint:CGPointMake(1, 0)];

[tempView setGradientBackgroundWithColors:@[[UIColor redColor],[UIColor orangeColor]] locations:nil startPoint:CGPointMake(0, 0) endPoint:CGPointMake(1, 0)];

[imageView setGradientBackgroundWithColors:@[[UIColor redColor],[UIColor orangeColor]] locations:nil startPoint:CGPointMake(0, 0) endPoint:CGPointMake(1, 0)];

label.text = @"Text";

label.textAlignment = NSTextAlignmentCenter;

[btn setTitle:@"Button" forState:UIControlStateNormal];

}

@end

@implementation UILabel (Gradient)

+ (Class)layerClass {

return [CAGradientLayer class];

}

@end

原链接为:https://www.jianshu.com/p/e7c9e94e165b

在网上找的代码,如有侵权,请联系本人,谢谢

渐变UI的更多相关文章

  1. photoshop基础教程视频-贺叶铭-传智播客-笔记

    界面构成 1.菜单栏 2.工具箱 3.工具属性栏 4.悬浮面板 5.画布 ctrl+n 新建对话框 (新建画布) 画布200*200大小,是指以毫米为单位,当不说单位,默认是毫米. 打开对话框:ctr ...

  2. UI设计趋势:渐变设计风格重新回归主流

    在扁平化设计刚刚兴起之时,渐变是设计师们避之不及的设计手法,然而今天它已经正式回归.几乎是在一夜之间,无数的网站开始使用渐变色. 从背景到图片上的色彩叠加,包括UI元素上所遮盖的色彩,所有的这一切都表 ...

  3. jQuery ui背景色动态渐变导航菜单

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  4. UI 设计中的渐变

    简评: 渐变是通过两种或多种不同的色彩来绘制一个元素,同时在颜色的交界处进行衰减变化的一种设计.从拟物到扁平再到渐变,人们慢慢发现它能创造出从未有过的一种色彩感觉 -- 独特.现代和清爽.(本文译者@ ...

  5. (UWP)通过编写算法实现在地图中的渐变路径

    目前的一个App中需要实现这个需求,但是在UWP自带的Bing Map中,绘制的MapPolyline的StrokeColor的类型是Windows.UI.Color,也就是说一条MapPolylin ...

  6. iOS 2D绘图 (Quartz2D)之阴影和渐变(shadow,Gradient)

    原博地址:http://blog.csdn.net/hello_hwc/article/details/49507881 Shadow Shadow(阴影) 的目的是为了使UI更有立体感,如图 sha ...

  7. iOS开发UI篇—CAlayer层的属性

    iOS开发UI篇—CAlayer层的属性 一.position和anchorPoint 1.简单介绍 CALayer有2个非常重要的属性:position和anchorPoint @property ...

  8. 浅谈UI设计中妙用无穷的深色系背景

    英文:medium 译者:优设网 - 陈子木 链接:http://www.uisdc.com/ui-benefits-of-dark-background# --------------------- ...

  9. css3实现颜色渐变以及兼容性处理

    有时我们会看到网站上的一些图片是渐变色的,这些图片有的是ui设计出来的,有的则是直接通过css3制作出来的.下面就讲一下css3实现渐变色的方法,以及在各个浏览器上的兼容性. CSS3 Gradien ...

随机推荐

  1. 《图解HTTP》读书笔记(二:各种协议与HTTP协议之间的关系)

    涉及到DNS协议.TCP协议.IP协议,话不多说,上图:

  2. 60道Python面试题&答案精选!找工作前必看

    需要Word/ PDF版本的同学可以在实验楼微信公众号回复关键词"面试题"获取. 1. Python 的特点和优点是什么? 答案:略. 2. 什么是lambda函数?它有什么好处? ...

  3. jenkins centos slave起不来报错The SSH key presented by the remote host does not match the key saved in the Known Hosts file against this host. Connections to this host will be denied until the two keys mat

    场景:我的centos-204是一台centos的机器,本来用https://www.cnblogs.com/zndxall/p/8297356.html 的centos slave方式搭建ok的,一 ...

  4. python --(链表)

    链表的使用 #/usr/bin/python#-*- coding: utf-8 -*-#Function: simulate the link-list in python#__author__: ...

  5. caffe 环境搭建

    1.VS安装 VS社区版(个人免费): http://download.microsoft.com/download/B/4/8/B4870509-05CB-447C-878F-2F80E4CB464 ...

  6. Windows 2008 r2上安装MySQL

    用MSI安装包安装 根据自己的操作系统下载对应的32位或64位安装包.按如下步骤操作: MySQL数据库官网的下载地址http://dev.mysql.com/downloads/mysql,第一步: ...

  7. 微信小程序之回调函数

    在微信小程序中众所周知在js里面得方法都是异步执行,我最近再做项目得时候也遇到了这个问题,再方法里面调用另一个方法里面的接口数据,第一次是调取不到的, 因为两个方法是同时开始执行得,所以怎么都取不到值 ...

  8. vs2017 git凭证问题

    安装完tfs2017(自带git)后,连接git代码服务器,报authorication错误.这是vs2017的bug.尝试了许多种方案后,最简单的干脆手动添加如下3个凭证.一定要核对好地址中的.  ...

  9. CentOS 7 安装Apache 2.4.39

    使用源码在CentOS 7下安装 apache 2.4.39,之前趟了一遍,简单做个笔记. STEP 1 安装apr STEP 1.1 检查是否安装apr [root@study ~]# yum li ...

  10. 洛谷 K短路(魔法猪学院)

    A*+迪杰特斯拉... 第十一个点卡爆 不管了 #include<iostream> #include<algorithm> #include<cstring> # ...