iOS UI控件了解一下
在iOS开发及测试中，除了业务逻辑和算法之外，UI控件是最重要的一部分，因此熟悉UI控件及实现原理，对于了解开发实现和测试是相当必要的，这篇文章将给大家介绍常用的UI控件及实现。
UI相关概念
1. UI UI（User Interface）用户界面，即用户能看到的各种各样的页面元素，iOS App 主要是由各种各样的UI控件加业务逻辑和算法构成，想要开发出一款精美的应用程序，需要熟练掌握各种各样UI控件的用法。 2. UIWindow widow是窗口，每个app都需要借助window将内容展现给用户看，在iOS中，使用UIWindow类来表示窗口，通常一个应用程序只创建一个UIWindow对象； 创建window示例代码：self.window = [[UIWindow alloc] initWithFrame:[[UIScreen mainScreen] bounds]]; window如何呈现内容？下面我们将引入UIView； 3. UIView view(视图)代表屏幕上的一个矩形区域。iOS中用UIView来表示视图，App中能看到的元素，都是UIView及其子类，通俗的说各种UI控件都属于view，不同的控件代表不同种类的view。iOS中所有能看到的内容都是view或其子类。 创建view的步骤如下: ①开辟空间并初始化视图(初始化时,给出视图位置和大小) ②对视图做一些设置(比如:背景颜色) ③将视图添加到window上进行显示 ④释放视图对象 视图创建代码： UIView *blueView = [[UIView alloc]initWithFrame:CGRectMake(100, 100, 120, 100)]; blueView.backgroundColor = [UIColor blueColor]; [self.window addSubview:blueView]; [blueView release]; UIView作为所有可视化控件的BaseClass,提供了许多属性和方法：显示效果控制(frame、alpha等)、视图添加和移除(addSubview: 等)、视图层次调整(bringSubviewToFront:等)等。 4. UIView的属性frame、bounds、center 1）frame：描述当前视图在其父视图中的位置和大小； frame是一个结构体,包含2部分内容:origin和size。origin也是一个结构体,包含2部分内容：x和y（ios坐标系以左上角为坐标原点(0,0)，以原点向右侧为X轴正方向，原点下侧为Y轴正方向）；size同样是一个结构体,包含2部分内容:width和height，frame的origin和size是相对于父视图来说的。CGRectMake()函数可以帮我们快速构造一个CGRect变量。 -(CGRect)frame{ return CGRectMake(self.frame.origin.x,self.frame.origin.y,self.frame.size.width,self.frame.size.height); } 2）bounds：描述当前视图在其自身坐标系统中的位置和大小； bounds(边界)同frame一样是一个CGRect结构体变量。当一个view设置bounds时,会把自己当成一个容器,定义自己的边界大小以及左上角的初始坐标。当子视图添加到此视图时,会根据bounds指定的原点(0,0)计算frame,而非左上角。 -(CGRect)bounds{ return CGRectMake(0,0,self.frame.size.width,self.frame.size.height); } 3）center：描述当前视图的中心点在其父视图中的位置； center(中心点)也是个结构体,包含2个部分:x和y，center与frame有着密切的联系。 center.x = frame.origin.x + frame.size.width/2; center.y = frame.origin.y + frame.size.height/2; bounds和frame和center有着微妙的联系（详见下图）：
5. UIView的操作方法 1）添加视图 UIView的addSubview:方法可以添加子视图,对于同一个视图的所有子视图来讲,后添加的子视图会把已加的子视图盖在下面。 UIView提供了其他添加视图的方法（详见下表）：
2）管理视图层次 UIView除了提供添加视图的方法,还提供了管理视图层次的方法（详见下表）：
3）视图重要属性 UIView作为其他UI控件的BaseClass,提供了很多属性（详见下表）：
常用UI控件介绍
UIView其实就是承载各种控件的一个容器，很多的控件都继承于UIView，只要继承UIView的控件，那么就相应的继承了UIView的各种属性，可以说UIView是视图控件之父。 下表是常用UI控件一览表：
下面详细介绍几种最常用的控件及属性： 1. UILabel 1）UILabel是什么？ （1）UILabel(标签):是显示文本的控件，在App中UILabel是出现频率最高的控件。 （2）UILabel是UIView子类，作为子类一般是为了扩充父类的功能,UILabel扩展了文字显示的功能,UILabel是能显示文字的视图。 2）如何使用UILabel？ （1）创建UILabel与创建UIView的步骤很相似。 ①开辟空间并初始化(如果本类有初始化方法,使用自己的;否则使用父类的)。 ②设置文本控制相关的属性。 ③添加到父视图上,用以显示。 ④释放。 （2）视图创建代码： UILabel *userNameLabel = [[UILabel alloc]initWithFrame:CGRectMake(30, 100, 100, 30)]; userNameLabel.text = @"用户名"; [containerView addSubview:userNameLabel]; [userNameLabel release]; 3）如何控制文本显示？ UILabel的主要作用是显示一段文本,因此提供了很多与显示文本相关的API（详见下表）
2. UITextField 1）UITextField是什么？ （1）UITextField(输入框):是控制文本输入和显示的控件。在App中UITextField出现频率也比较高； （2）iOS系统借助虚拟键盘实现输入,当点击输入框,系统会自动调出键盘,方便 你进一步操作。在你不需要输入的时候,可以使用收回键盘的方法,收回弹出的键盘； （3）UITextField和UILabel相比,UILabel主要用于文字显示,不能编辑, UITextField允许用户编辑文字(输入)。 2）如何使用UITextField？ 创建UITextField与创建UILabel的步骤很相似。 ①开辟空间并初始化(如果本类有初始化方法,使用自己的;否则使用父类的)； ②设置文本显示、输入相关的属性； ③添加到父视图上,用以显示； ④释放； 3）UITextField使用示例： UITextField *userNameTextField = [[UITextField alloc]initWithFrame:CGRectMake(100, 100, 190, 30)]; userNameTextField.borderStyle =UITextBorderStyleRoundedRect; userNameTextField.placeholder = @"手机号/邮箱"; [containerView addSubview:userNameTextField]; [userNameTextField release]; 4）UITextField更多 UITextField核心功能主要包含3个方面: ①文本显示 ②输入控制 ③外观配置。 5）文本显示： UITextField提供了许多API方便我们控制文本的显示，包括字体颜色、对齐方式、占位符等等（详见下表）
6）输入控制： UITextField类提供了许多控制输入的API，包括密码模式、键盘样式、自定义键盘等（详见下表）
7）外观控制： UITextField同样提供了外观控制的API，包括边框样式、清除按钮、辅助视图等；
3. UIButton 1）UIButton是什么？ （1）UIButton(按钮):是响应用户点击的控件。在App中UIButton是出现频率很高的控件； （2）UIButton与UILabel、UITextField侧重点不同,侧重于处理点按。当然UIButton类也提供了一些方法控制按钮外观。 2）如何使用UIButton？ 创建UIButton与创建UILabel、UITextField、UIView的步骤很相似。 ①创建button对象(如果本类有初始化方法,使用自己的;否则使用父类的)； ②设置按钮显示相关的属性； ③为按钮添加点击事件； ④添加按钮到父视图上,用以显示； ⑤按钮无需释放(因为使用的是类方法创建的button)。 3）UIButton使用示例： UIButton *loginButton = [UIButton buttonWithType:UIButtonTypeSystem]; loginButton.frame = CGRectMake(30, 200, 60, 30); [loginButton setTitle:@"登录" forState:UIControlStateNormal]; [loginButton addTarget:self action:@selector(login:) forControlEvents:UIControlEventTouchUpInside]; [containerView addSubview:loginButton]; 4）UIButton添加事件： UIButton从父类UIControl那继承了控制相关的方法,比如添加事件、移除事件等。 注:UIButton : UIControl : UIView（详见下表）
5）外观控制： UIButton提供了外观控制的API。包括标题、背景图⽚片、前景图⽚片等（详见下表）
总结
该文主要分享了UI相关的概念，重点介绍了所有可视化控件的基类UIView及其属性和相关方法，并详细介绍3个最常见的UI控件-UILabel（标签）、UITextField（输入框）、UIButton（按钮）的属性及其使用，其他控件的使用都是类似的，了解了各种UI控件的属性及开发使用之后，就可以在测试用例设计及UI相关测试中，更精准地设计测试用例，针对每一类UI控件根据其属性设计特定的测试方法。