码迷，mamicode.com
首页 > 移动开发 > 详细

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

时间：2015-12-15 21:12:13      阅读：1256      评论：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年07月29日 (22)
2021年07月28日 (40)
2021年07月27日 (32)
2021年07月26日 (79)
2021年07月23日 (29)
2021年07月22日 (30)
2021年07月21日 (42)
2021年07月20日 (16)
2021年07月19日 (90)
2021年07月16日 (35)
周排行
mamicode.com排行更多图片
更多
友情链接
兰亭集智   国之画   百度统计   站长统计   阿里云   chrome插件   新版天听网
关于我们 - 联系我们 - 留言反馈
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码！