首页 > 移动平台 > 详细

学习方法和阶段介绍 、 iOS界面开发引入 、 构造第一个App 、 视图控制器和视图 、 控件与事件 、 InterfaceBuilder

时间：2015-12-15 21:10:48      阅读：390      评论：0      收藏：0      [点我收藏+]

1 创建并运行第一个App

1.1 问题

使用Xcode创建一个App项目，该应用实现功能在界面上显示Hello World标签，在模拟器中的运行结果如图－1所示：

技术分享

图－1

1.2 方案

分析图－1，首先使用Xcode创建一个Single ViewApplicaton应用，起名为MyFirstApp，如图-2所示：

技术分享

图－2

然后删除Xcode的导航栏里只保留TRAppDelegate.h文件和TRAppDelageat.m文件，其他代码文件、storyboard文件以及xib文件删除，如图-3所示：

技术分享

图-3

然后选择TRAppDelegate.h文件，右边的代码编辑区可见TRAppDelegate继承至UIResponder类，并遵守UIApplicationDelegate协议，并且有一个UIWindow类型的属性window，即该程序的主窗口视图，代码如下所示：

  1. #import<UIKit/UIKit.h>
  2. @interfaceTRAppDelegate : UIResponder<UIApplicationDelegate>
  3. @property (strong, nonatomic) UIWindow *window;
  4. @end

选择TRAppDelegate.m文件，右边的代码编辑区可见如下所示代码的方法，该方法是UIApplicationDelegate协议里面的一个方法，是App应用成功启动时调用的方法，此方法为程序的入口，因此需要将页面所展示的内容代码写在此方法内。

  1. - (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {
  2. }

1.3 步骤

实现此案例需要按照如下步骤进行。

步骤一：创建window对象，即应用主窗口对象

首先创建一个和屏幕大小一样的window对象，并让TRAppDelegate类的window属性指向该window对象，并将window的背景颜色设置为白色，代码如下所示：

  1. //创建window对象
  2. //frame是用来表示window原点坐标和宽高的属性，[[UIScreenmainScreen] bounds]用于获取屏幕的大小的，并将获取到的值赋给window的frame属性
  3. self.window=[[UIWindowalloc]initWithFrame:[[UIScreenmainScreen] bounds]];
  4. //设置window对象的背景颜色
  5. //backgroundColor是window用于表示背景颜色的属性，将该属性的值设置为白色
  6. self.window.backgroundColor = [UIColorwhiteColor];

步骤二：创建标签UILabel对象

UILabel类是标签控件，常用于显示各种文字信息，创建一个UILabel类的对象，通过UILabel的text属性和frame属性的值来设置显示的文字信息及标签的位置大小，并将该标签对象添加到应用程序的主窗口中，代码如下所示：

  1. //创建一个标签对象
  2. UILabel *label = [[UILabelalloc]init];
  3. //设置标签的文字信息，label对象的text属性用于记录所需显示的文字
  4. label.text = @"Hello world.";
  5. //设置label的位置和大小，label的frame属性用于记录相对于父视图的原点坐标位置和宽高
  6. CGRect frame = {50, 100, 100, 30};
  7. label.frame = frame;
  8. //将标签添加到主窗口界面
  9. [self.windowaddSubview:label];

步骤三：将window对象设置为主窗口并显示

将window对象设置为主窗口并显示出来，只有成为主窗口才能与用户交互。代码如下所示：

  1. //让window对象成为主窗口并显示出来
  2. [self.windowmakeKeyAndVisible];

1.4 完整代码

本案例的完整代码如下所示：

代码

2 创建有视图和控制器的App,并加入Label做子视图

2.1 问题

在实际开发中通常不会使用以上的方式写代码，因为以上方式只能实现非常简单的、只有一个界面的应用，然而实际的开发中的应用都是需要多界面进行切换，以上代码是无法实现的，因此我们需要使用视图和视图控制器，通常window里面显示的都是一整张的视图，不会将单个控件（例如UILabel）放进window里面显示，进入应用展示的第一个视图称为根视图，视图控制器则是用来控制视图显示的内容，通常视图控制器和视图都是配合来使用的。

2.2 方案

首先同第一个案例一样使用Xcode创建一个Single ViewApplicaton应用，并删除其他文件，只保留TRAppDelegate.h，和TRAppDelegate.m文件。

其次，点击右键可见如图-4所示窗口，选择New File创建一个新的TRMyFirstViewController类，该类继承至UIViewController，如图-5所示：

技术分享

图－4

技术分享

图－5

选择TRMyFirstViewController.m文件，右边的代码编辑区可见如下所示方法，其中viewDidLoad在视图页面已经成功加载到内存中时被调用一次，通常在此方法中设计界面的初始显示，因此需要将上一案例中页面所展示的内容代码写在此方法内，但须注意加载当前视图展示内容前需要先由父类加载视图：

  1. - (void)viewDidLoad {
  2. [superviewDidLoad];
  3. }

最后选择TRAppdelegate.m文件，导入TRMyFirstViewController类的头文件，在didFinishLaunchingWithOptions方法中，创建一个TRMyFirstViewController类的对象，作为该应用主窗口window的根视图控制器，代码如下所示：

  1. TRMyFirstViewController *myFirstViewController = [[TRMyFirstViewControlleralloc]init];
  2. self.window.rootViewController = myFirstViewController;

2.3 步骤

实现此案例需要按照如下步骤进行。

步骤一：创建标签UILabel对象

在viewDidload方法里面创建一个UILabel对象，同上一个案例一样设置其显示的文字信息、位置大小和背景颜色，并将UILabel对象添加到当前视图中，代码如下所示：

  1. - (void)viewDidLoad
  2. {
  3. [superviewDidLoad];
  4. //1. 创建一个UILabel对象
  5. UILabel *label = [[UILabelalloc]init];
  6. //2. 设置相关属性
  7. label.text = @"Hello World.";
  8. label.frame = CGRectMake(50, 60, 200, 30);
  9. label.backgroundColor = [UIColorgreenColor];
  10. //3. 将对象加入到当前视图中
  11. [self.viewaddSubview:label];
  12. }

步骤二：创建主窗口window的根视图控制器对象

在TRAppdelegate.m文件的didFinishLaunchingWithOptions程序入口方法中，创建一个TRMyFirstViewController类的对象，作为该应用主窗口window的根视图控制器，代码如下所示：

  1. - (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
  2. {
  3. self.window = [[UIWindowalloc] initWithFrame:[[UIScreenmainScreen] bounds]];
  4. self.window.backgroundColor = [UIColorwhiteColor];
  5. //创建根视图控制器对象
  6. TRMyFirstViewController *myFirstViewController = [[TRMyFirstViewControlleralloc]init];
  7. self.window.rootViewController = myFirstViewController;
  8. [self.windowmakeKeyAndVisible];
  9. return YES;
  10. }

2.4 完整代码

本案例中，TRMyFirstViewController.m文件中的完整代码如下所示：

代码

TRAppDelegate.m文件中的完整代码如下所示：

代码

3 在App的视图中加入按钮子视图

3.1 问题

创建一个按钮（UIButton类），将按钮添加到界面中，给按钮添加点击事件，用来修改一个Label的显示内容，如图-6和图-7所示：

技术分享

图-6

技术分享

图-7

3.2 方案

首先同第二个案例一样使用Xcode创建一个Single View Application，保留TRAppDelegate类，并创建好TRViewController视图控制器类，完成TRAppDelegate.m文件中的代码。

然后，给界面添加按钮和标签，代码写在TRViewController.m文件里的viewDidLoad方法中。

最后给按钮添加点击事件，修改标签中的显示内容。

3.3 步骤

实现此案例需要按照如下步骤进行。

步骤一：创建按钮button对象，并设置相关属性

使用工厂方法创建一个UIButton类的按钮对象button，并进行button的各项属性设置，添加到父视图中。代码如下所示：

  1. //1. 创建UIButton对象
  2.     UIButton *button = [UIButtonbuttonWithType:UIButtonTypeSystem];
  3. //2. 设置button的各项属性
  4. [buttonsetTitle:@"OK" forState:UIControlStateNormal];
  5. button.frame = CGRectMake(20, 40, 280, 40);
  6. button.backgroundColor = [UIColorlightGrayColor];
  7. //3. 加入到父视图
  8. [self.viewaddSubview:button];

步骤二：创建标签label对象，并设置相关属性

创建一个UILabel类的标签对象label，并进行label的各项属性设置，添加到父视图中，这里的label对象需要在整个TRViewController类中使用，因此需要设置为TRViewController类的属性。代码如下所示：

  1. @interfaceTRViewController ()
  2. @property (strong, nonatomic) UILabel *label;
  3. @end

创建label对象和属性设置的代码写在viewDidLoad方法中，代码如下所示：

  1. UILabel *label = [[UILabelalloc]init];
  2. self.label = label;
  3. label.text = @"要修改的内容";
  4. label.frame = CGRectMake(50, 160, 280, 30);
  5. label.font = [UIFont systemFontOfSize:30];
  6. [self.viewaddSubview:label];

步骤三：给按钮添加点击事件

使用addTarget:action:forControlEvents:方法给按钮添加点击事件。

target：表示目标对象，即当按钮触发了事件时会向哪个对象发消息，经常会用self, 表示向当前对象发消息。

action:表示动作，即向target对象发送的消息，这里是方法tapButton。

events:表示事件，当触发了按钮对象的某种事件时，才向target发action消息，这里使用的是UIControlEventTouchUpInside事件，即在按钮内部点击事件。

代码如下所示：

  1. [buttonaddTarget:self
  2. action:@selector(tapButton)
  3. forControlEvents:UIControlEventTouchUpInside];

步骤四：实现方法tapButton

当点击按钮出发按钮事件时，将需要完成的事情在tapButton方法里面实现，在这里需要完成的事情是修改label标签的显示内同，代码如下所示：

  1. - (void)tapButton
  2. {
  3. self.label.text = @"这是修改后的内容";
  4. }

3.4 完整代码

本案例中，TRViewController.m文件中的完整代码如下所示：

代码

4 创建带有xib的App，并在程序代码中访问xib中创建的对象

4.1 问题

在实际的开发中除了可以用代码进行界面的操作，还可以使用可视化编程工具xib进行界面的构建，以提高开发的效率，本案例使用xib构件界面并在代码中访问xib创建的各种控件，点击按钮修改标签中的显示内容。界面效果在模拟器中运行如图－8所示：

技术分享

图－8

4.2 方案

xib以前是一个独立的可视化编程工具，从xcode4开始集成到xcode中，方便程序员的使用，提高开发效率。

xib的工作原理：将界面上需要的控件(或视图)的创建、属性的设置、之间的关系等都保存到一个xml文件中，程序运行时，从xml文件中读取所有的控件(或视图)的配置，自动创建出这些对象，并加入到父视图中。

首先创建一个带有xib文件的视图控制器TRViewController，通常这个xib文件和与它关联的视图控制器的名字保持一致，这里视图控制器类名字为TRViewController，则xib文件名为TRViewController.xib，如图-9所示。

技术分享

图-9

其次从右边栏的对象库（图-10）中选择界面所需的控件，拖放到xib界面中，在右边栏的检查器（图-11）中可以设置控件的各种的属性，本案例中拖放一个Button控件和一个Label控件到xib界面。

技术分享

图-10

技术分享

图-11

然后在TRAppDelegate.m文件中创建TRViewController对象时，使用初始化方法initWithNibName:，该方法会从xib文件创建TRViewController对象，这里NibName参数就是xib文件的名字，代码如下所示：

  1. TRViewController *vc = [[TRViewControlleralloc]initWithNibName:@"TRViewController" bundle:nil];

最后将xib中拖放的控件和代码关联，通过代码访问xib创建的label和button。

4.3 步骤

实现此案例需要按照如下步骤进行。

步骤一：创建xib文件

首先同第一个案例一样使用Xcode创建一个Single View Applicaton应用，并删除其他文件，只保留TRAppDelegate.h，和TRAppDelegate.m文件。

创建TRViewController类文件，这次在创建视图控制器时，需要在Also create XIB file前的选择框上打上勾，表示在创建TRViewController对象的同时创建与之相关联的xib文件，如图-12所示。

技术分享

图-12

创建生成的xib文件如图-13所示：

技术分享

图-13

步骤二：将Button拖放到xib界面中

从对象库中选择Button控件拖放到xib界面中，在右边栏的检查器中设置Button控件的title属性，如图-14和图-15所示：

技术分享

图-14

技术分享

图-15

步骤三：将Label拖放到xib界面中

从对象库中选择Label控件拖放到xib界面中，在右边栏的检查器中设置Label控件的text属性，如图-16和图-17所示：

技术分享

图-16

技术分享

图-17

最后完成的xib界面如图-18所示：

技术分享

图-18

步骤四：将xib中的Label与代码关联

要在程序代码中访问xib创建的对象，需要使用连接输出口（IBOutlet）。IBOutlet是一种属性，这种属性指向了xib中的一个对象。

先将xib中的Label对象关联成TRViewController类的私有属性，点击Xcode工具栏右上角的辅助编辑器按钮，打开Xcode的辅助编辑器，辅助编辑界面显示的是TRViewController.m文件，如图-19所示：

技术分享

图-19

选中xib中的Label，按住control键，将Label拖拽到TRViewController.m文件中的类扩展中，释放鼠标，会弹出如图-20所示的窗口：

技术分享

图-20

在弹出窗口里的Connection栏中选择Outlet，将输出口命名为myLabel，如图-21所示：

技术分享

图-21

点击connect按钮，在类扩展里会自动生成一行代码，并且此代码前会出现一个实心的圆圈，表示xib中Label对象已经关联成功，如果未关联成功会显示一个空心的圆圈，如图-22所示：

技术分享

图-22

步骤五：给xib中的Button添加点击事件

给xib中的Button添加点击事件，需要使用动作IBAction。IBAction是一个方法，这个方法连接到了xib中的一个控件的某个事件上。当用户触发了这个控件的这个事件时，就会调用此方法。

同上一步一样打开Xcode的辅助编辑器，辅助编辑界面显示的是TRViewController.m文件，选择xib中的button对象，按住control键，将Button拖拽到TRViewController.m文件中，释放鼠标，会弹出如图-23所示的窗口：

技术分享

图-23

在弹出窗口里将动作命名为tapAction，type选择为UIButton，arguments选为none，表示不带参数的方法，如图-24所示：

技术分享

图-24

点击connect按钮，TRViewController.m文件中生成如图-25中的方法，并且此方法前会出现一个实心的圆圈，表示xib中Button对象点击事件添加成功，如果未关联成功会显示一个空心的圆圈，如图-25所示：

技术分享

图-25

最后将此方法实现，代码如下所示：

 
  1. - (IBAction)tapButton
  2. {
  3. self.myLabel.text = @"哈哈,我修改成功啦";
  4. }

4.4 完整代码

本案例，TRAppDelegate.m中的完整代码如下所示：

代码

本案例，TRViewController.m中的完整代码如下所示：

代码

学习方法和阶段介绍 、 iOS界面开发引入 、 构造第一个App 、 视图控制器和视图 、 控件与事件 、 InterfaceBuilder

原文：http://www.cnblogs.com/52190112cn/p/5049298.html
踩
(0)
赞
(0)
   
举报
评论 一句话评论（0）
分享档案
更多>
2021年09月23日 (328)
2021年09月24日 (313)
2021年09月17日 (191)
2021年09月15日 (369)
2021年09月16日 (411)
2021年09月13日 (439)
2021年09月11日 (398)
2021年09月12日 (393)
2021年09月10日 (160)
2021年09月08日 (222)
最新文章
更多>
教程昨日排行
更多>
友情链接
汇智网   PHP教程   插件网  
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣，分享程序人生！