2.3 文本控件——UILabel
在任意一款应用中,随处可见各种各样的文字标签,Label(标签)是应用UI体系中最基础也是最简单的一个控件。顾名思义,其主要作用是在屏幕视图上显示一行或者多行的文本,十分类似于生活中的便条标签。在UIKit框架中,UILabel有很多可定制属性提供给开发者进行控件的自定义设置。
2.3.1 使用UILabel在屏幕上创建一个标签控件
在第一章中,通过storyboard文件很轻松的在视图上创建了显示Hello World的标签,这一小节我们使用代码来实现同样的效果。打开Xcode开发工具,创建一个名为HelloWorldText的工程,在ViewController.m中的viewDidLoad方法里添加如下代码:
- (void)viewDidLoad { [super viewDidLoad]; UILabel * label = [[UILabel alloc]initWithFrame:CGRectMake(20, 100, 28 0, 30)]; label.text = @"Hello World"; [self.view addSubview:label]; }
上面代码中,initWithFrame:方法是UILabel 类中的一个初始化方法,这个方法中需要传入一个CGRect类型的结构体,这个参数决定了在屏幕上创建UILabel控件的位置和尺寸,CGRect在iOS的UI系统中描绘了一个矩形区域,CGRectMake()方法可以构造出一个CGRect结构体,其中的4个参数依次设置了这个矩形区域的x坐标、y坐标、宽度和高度。
提示
在UIKit框架中,UI坐标系与生活中的数学坐标系略有不同,生活中横向为x轴,向右增大,纵向为y轴,向上增大,在UI坐标系中,横向为x轴,向右增大,纵向为y轴,向下增大,即原点在左上角。
UILabel类的text属性用于设置标签上的文字,必须设置为一个NSString 类型的字符串值。在调用UIView的addSubview:方法后,将UILabel控件添加在了当前的视图上,运行工程会看到如图2-3的效果。
图2-3 代码创建的UILabel控件
2.3.2 自定义标签控件的相关属性
上面创建的HelloWorldText 工程中标签控件的样式是系统默认的模样,有时候,开发者需要更多元化的标签,比如各种颜色,各种字体等,UILabel中有大量的属性提供给开发者进行自定义,代码示例如下:
- (void)viewDidLoad { [super viewDidLoad]; UILabel * label = [[UILabel alloc]initWithFrame:CGRectMake(20, 100, 280, 3 0)]; label.text = @"Hello World"; //设置背景颜色 label.backgroundColor = [UIColor redColor]; //设置字体和字号 label.font = [UIFont systemFontOfSize:23]; //设置字体颜色 label.textColor = [UIColor whiteColor]; //设置对齐模式 label.textAlignment = NSTextAlignmentCenter; //设置阴影颜色 label.shadowColor = [UIColor greenColor]; //设置阴影的偏移量 label.shadowOffset =CGSizeMake(10, 10); [self.view addSubview:label]; }
backgroundColor 属性设置了标签的背景颜色,实际上backgroundColor 并非是UILabel 特有的属性,很多通过继承UIView来的子类都有这样一个属性。font属性设置UILabel控件上的字体相关属性;textColor属性设置了UILabel 控件上字体的颜色;TextAlignment属性设置UILabel控件上文字的对齐模式,默认是居中对齐,设置对齐模式使用如下枚举值:
typedef NS_ENUM(NSInteger, NSTextAlignment) { NSTextAlignmentLeft = 0, // 居左对齐 NSTextAlignmentCenter = 1, // 居中对齐 NSTextAlignmentRight = 2, // 居右对齐 };
shadowColor属性设置文字的阴影颜色,shadowOffset属性设置了阴影的偏移量,即阴影与本体之间的偏移距离,这个属性要设置一个CGSize类型的结构体,CGSize中的两个参数分别代表横向偏移量和纵向偏移量。通过添加上面的代码,再次运行工程,效果如图2-4所示。
图2-4 自定义属性的UILabel
2.3.3 多行显示的UILabel与换行模式
通过initWithFrame:初始化方法创建的UILabel控件,会有一个宽度,如果文字长度超过了UILabel控件的宽度,默认的UILabel控件并不会换行,而是用省略号代替超出的部分,例如将UILabel控件高度和text属性改为如下所示:
UILabel * label = [[UILabel alloc]initWithFrame: CGRectMake(20, 100, 280, 100)]; label.text = @"Hello World, It is a good idea, So, what do you want to konw? ";
提示
UILabel可以多行显示的前提是有足够的高度。
运行工程,如图2-5所示,会看到多出的文字被截断了,UILabel并没有换行。
图2-5 文字被截断的UILabel控件
默认的UILabel都是单行显示的,可以通过如下属性设置显示的行数:
label.numberOfLines = 0;
numberOfLines设置为一个整数值,代表支持多少行显示,如果设置为0,则代表无限换行,直到文字结束或者到达UILabel控件的最底端为止。
UILabel中还有一个lineBreakMode属性,这个属性可以设置换行和截断模式,这个属性设置的值为NSLineBreakMode枚举,意义如下:
typedef NS_ENUM(NSInteger, NSLineBreakMode) { NSLineBreakByWordWrapping = 0, // 以字符为标准换行 NSLineBreakByCharWrapping, // 以单词为标准换行 NSLineBreakByTruncatingHead, // 头部截断 NSLineBreakByTruncatingTail, // 尾部截断 NSLineBreakByTruncatingMiddle // 中间截断 } NS_ENUM_AVAILABLE(10_0, 6_0);
上面这个枚举值的设置效果如图2-6~图2-10所示。
图2-6 NSLineBreakBy WordWrapping
图2-10 NSLineBreakBy TruncatingMiddle
图2-7 NSLineBreakBy CharWrapping
图2-8 NSLineBreakBy TruncatingHead
图2-9 NSLineBreakBy TruncatingTail