UILabel的基本使用

简介: UILabel的基本使用

UILabel的基本使用


我们在项目中经常看见这样的效果

我们第一印象是个UICollectionView 可是是否发现这个不需要去创建一个UICollectionView

image.png

2406962-871d3d5a8a8897ee.p

我们只需要六个按钮就可以了,当然 如果很多的话,也是一样的我们只需要改变个数就可以了

废话不多说  直接上代码

小弟为了给大家方便理解,给大家每一行都加了注释

![Uploading 2406962-d7d7867e64c1596b_785170.png . . .]

给大家看一下效果图

2406962-f1038f255573e980.png

如果你不是需要8个按钮,而是需要9个  只需要改一下个数就可以了,是不是很方便。

同时,如果你需要改变每个按钮的大小,直接改变那个宽:W  高:W的值就可以了。

这里涉及到一个自定义按钮,我就下篇文章告诉大家吧,这个其实也很简单,为了大家方便,快速的使用起来,我给大家上代码,可以直接复制过去使用

int totalColumns = 4; // 每行放多少个
//按钮的宽
CGFloat W = 80;
//按钮的高
CGFloat H = W;
//按钮之间的间隔 同时也是按钮距离左右屏幕的间隔
CGFloat margin = (self.view.frame.size.width - totalColumns*W)/(totalColumns + 1);
//总数是多少个
NSInteger number = 8;
//循环创建按钮
for (int i = 0; i < number; i++)
{
//自定义按钮
UIButton *button = [UIButton buttonWithType:UIButtonTypeCustom];
//决定在哪一行
int row = i /totalColumns;
//决定在哪一列
int col = i %totalColumns;
//按钮的背景颜色
button.backgroundColor = [UIColor redColor];
//给按钮设图片
[button setImage:[UIImage imageNamed:@"1.jpg"] forState:UIControlStateNormal];
//每个按钮的X值
CGFloat X = margin + col *(W + margin);
//每个按钮的Y值
CGFloat Y = 20 + row*(H + margin);
//按钮尺寸大小和位置
button.frame = CGRectMake(X, Y, W, H);
//每个按钮添加到父控件上
[self.view addSubview:button];
}

还有需求是这样的

当然如果你需要让他们左右两边没有边距,但是中间所有的按钮都有边距,然后文字在图片的下面,我们知道系统提供的按钮设置图片和文字的话,图片在左边,文字会在图片 所以我们需要自定义按钮 右边看效果图

image.png

2406962-2a363eecb0ba1f71.png

同样直接给大家上代码哈

image.png

2406962-bf1822e0a60d04ff.png

这里涉及到一个自定义按钮,我就下篇文章告诉大家吧,这个其实也很简单,为了大家方便,快速的使用起来,我给大家上代码,可以直接复制过去使用

// 每行放多少个
int totalColumns = 3;
//每个按钮的宽
CGFloat W = WIDTH/3;
//每个按钮的高
CGFloat H = W;
//总数是多少个
int number = 12;
//创建按钮
for (int i = 0; i < number; i++)
{
//自定义按钮
CustomButton *button = [CustomButton buttonWithType:UIButtonTypeCustom];
//按钮所在哪一行
int row = i / totalColumns;//行
//按钮所在哪一列
int col = i % totalColumns;//列
//按钮设置图片
[button setImage:[UIImage imageNamed:@"1.jpg"] forState:UIControlStateNormal];
//按钮设置文字
[button setTitle:@"你好" forState:UIControlStateNormal];
//按钮的X
CGFloat X = col * (W + 1);
//按钮的Y
CGFloat Y = row * (H + 1);
//按钮的尺寸位置
button.frame = CGRectMake(X, Y, W, H);
//添加都父控件
[self.view addSubview:button];
}

最后给大家看一下思路,直接看图,基本就懂了

image.png

相关文章
|
算法 Java 调度
混合算法(GA+TS)求解作业车间调度问题(JSP)-禁忌搜索部分
混合算法(GA+TS)求解作业车间调度问题(JSP)-禁忌搜索部分
624 0
混合算法(GA+TS)求解作业车间调度问题(JSP)-禁忌搜索部分
|
10月前
|
存储 供应链 算法
深入解析区块链技术的核心原理与应用前景
深入解析区块链技术的核心原理与应用前景
381 0
|
SQL 关系型数据库 API
SQLAlchemy模型使用
SQLAlchemy模型使用
SQLAlchemy模型使用
|
11月前
|
缓存 NoSQL Redis
Redis命令:列表模糊删除详解
Redis命令:列表模糊删除详解
329 3
|
编解码 定位技术
航摄比例尺、成图比例尺、地面分辨率与航摄设计用图比例尺
航摄比例尺、成图比例尺、地面分辨率与航摄设计用图比例尺
666 0
|
存储 监控 物联网
MQTT协议问题之OTA升级包下载如何解决
MQTT协议是一个轻量级的消息传输协议,设计用于物联网(IoT)环境中设备间的通信;本合集将详细阐述MQTT协议的基本原理、特性以及各种实际应用场景,供用户学习和参考。
612 3
|
Web App开发 JavaScript 前端开发
为掘金编写了一款简易版一键三连的油猴脚本(二)
为掘金编写了一款简易版一键三连的油猴脚本(二)
306 0
|
消息中间件
【图解RabbitMQ-6】说说交换机在RabbitMQ中的四种类型以及使用场景
【图解RabbitMQ-6】说说交换机在RabbitMQ中的四种类型以及使用场景
606 1
|
缓存 移动开发 小程序
走进小程序【七】微信小程序【常见问题总结】
走进小程序【七】微信小程序【常见问题总结】
546 1
走进小程序【七】微信小程序【常见问题总结】
|
存储 机器学习/深度学习 弹性计算
阿里云ECS计算型c8y服务器CPU倚天710 ARM架构性能详解
阿里云服务器ECS计算型c8y倚天710 ARM架构CPU处理器性能详解,CPU处理器采用Yitian 710,ECS计算型c8y实例采用阿里云自研倚天710 ARM架构CPU,依托第四代神龙架构
1272 0
阿里云ECS计算型c8y服务器CPU倚天710 ARM架构性能详解

热门文章

最新文章