iOS开发3-实现基本交互

目标

这里编写一个简单的交互应用，所说的交互就是用户能进行操作，程序进行响应。

应用有两个按钮和一个标签，如下图，当用户按下一个按钮时，标签上的文本会相应地改变显示。

内容

1.MVC方法

在学习之前，先介绍一个基本理论。Cocoa Touch设计者们采用MVC模式（Model-View-Controller,模型-视图-控制器）作为指导原则。在基于图形用户界面的应用程序中，使用MVC可以非常合乎逻辑地对代码进行拆分。目前，几乎所有面向对象编程框架都在一定程度上借鉴了MVC的设计理念，但很少有像Cocoa Touch 这样忠实于MVC的。

MVC模式把代码功能划分为3个不同类。

模型：保存应用程序数据的类。

视图：包括窗口、控件以及其他一些用户可以看到并能与之交互的元素。

控制器：把模型和视图绑定在一起的代码，包括处理用户输入的应用程序逻辑。



MVC的目标是最大限度的分离这3类代码。创建的任何对象都应该非常清晰明确，让人一看便知这个对象所属的分类（模型、视图或控制器），尽量不要包含那些可能被认为属于多个分类的功能。

分层一定要分彻底，例如:

实现按钮对象不应该包含按钮点击时处理数据的代码;

实现银行账户的对象不应该包含绘制表格以显示交易数据的代码。

MVC可以帮助确保代码的最大可重用性。一个实现通用按钮的类可以在任何应用程序中使用，否则，如果实现按钮的类要在点击按钮时进行一些特定计算，那这个类就只能在最初实现它的应用程序中使用。

随着对Cocoa Touch 的深入学习，很快就可以看到UIKit框架中的类遵循MVC原则的情况。在开发时牢记这些概念，就能够创建出简洁而易于维护的代码。

2.创建应用

2.1创建项目

启动Xcode，创建工程：

2.2 设计用户界面

调节Storyboard中界面尺寸：

选中界面（变为蓝色边框），在“检查器面板”中选择“属性面板”，选择Size。



在Size的下拉列表中，选择合适的尺寸，依据模拟器的尺寸来。这里选择4.7寸（iphone5s,iphone6的尺寸）。



在storyboard中控件库面板下方的搜索框中输入“button”然后在搜索出的控件面板上，拖放”Button控件”到界面上。



双击刚拖放的Button按钮，更改按钮名称为“Left”：



按照“Left”按钮做法，放好“Right”按钮：



同样在搜索栏输入“label”找到“Label控件”，将这个控件拖入到界面中心位置：

2.3代码部分

删除ViewController.h和ViewController.m中的多余代码，然后按下面代码编写：

ViewController.h

//
//  ViewController.h
//  03-Demo
//

#import <UIKit/UIKit.h>

@interface ViewController : UIViewController

@property (weak,nonatomic)IBOutlet UILabel *statusLabel;

- (IBAction)buttonPressed:(UIButton *)sender;

@end

ViewController.m

//
//  ViewController.m
//  03-Demo
//

#import "ViewController.h"

@implementation ViewController

-(IBAction)buttonPressed:(UIButton *)sender
{
NSString *title = [sender titleForState:UIControlStateNormal];
NSString *plainText = [NSString stringWithFormat:@"%@ button pressed.",title];
_statusLabel.text = plainText;
}
@end

2.4 界面与代码关联

没有关联之前，图上的关联点是空心点，如下图：



关联方法1：（界面->代码）



关联方法2：（代码->界面）



关联方法3：（界面直接生成代码）

2.5 优化

界面设计完了，控制器代码写完了，也将这两者关联好了，然后就运行模拟器，结果如下：



点击“Left”、”Right”按钮，发现Label控件没有显示完全。

怎么办？

返回界面设计，调节Label控件长度即可，如下图：



再次运行：

2.6 代码分析

按钮响应的代码：

-(IBAction)buttonPressed:(UIButton *)sender
{
NSString *title = [sender titleForState:UIControlStateNormal];
NSString *plainText = [NSString stringWithFormat:@"%@ button pressed.",title];
_statusLabel.text = plainText;
}

第一行使用sender参数获取被点击的按钮的标题。由于按钮在不同状态下可以有不同的标题，因些使用UIControlStateNormal参数表明我们需要获取的是按钮在正常状态时（未被按下时）的标题。获取控件（按钮是控件的一种）标题时，通常使用的都是这种状态。

第二行创建了一个新的字符串，新字符串的内容是在按钮标题（上一行代码获取到的标题）末尾添加”button pressed.“文本拼接而成的。因此，如果点击标题为Left的按钮，就会创建一个内容为”Left button pressed.“的字符串。

第三行就是把这个新的字符串赋给标签的text属性，这
4000
样就可以改变标签的显示文本。

2.7 代码改进

增加标签的文本样式。

-(IBAction)buttonPressed:(UIButton *)sender
{
NSString *title = [sender titleForState:UIControlStateNormal];
NSString *plainText = [NSString stringWithFormat:@"%@ button pressed.",title];

//_statusLabel.text = plainText;

NSMutableAttributedString *styledText = [[NSMutableAttributedString alloc]
initWithString:plainText];

NSDictionary *attributes = @{
NSFontAttributeName :[UIFont boldSystemFontOfSize:_statusLabel.font.pointSize]
};

NSRange nameRange = [plainText rangeOfString:title];

[styledText setAttributes:attributes range:nameRange];

_statusLabel.attributedText = styledText;
}

代码分析：

新代码做的第一件事就是基于我们要显示的文本创建一个属性字符串（NSMutableAttributedString的一个实例）。这里需要使用可变的属性字符串，因为需要改变它的属性。

接下来，创建一个用于保存字符串属性的字典。现在只需要一种属性，所以这个字典里只包含一个键值对。通过名为NSFontAttributeName的键可以为属性字符串的一部分指定字体。这里这里传入的值是种名为”bold system font“的字体，字体的大小与标签当前使用的字体大小一致。相对于使用硬编码的字体名称，通过这种方式指定字体更加灵活，因为系统总是能够恰当地展现加粗的字体。

运行结果：

小结

介绍了MVC设计模式，充分理解MVC设计模式的意义。

写了一个有两个按钮一个标签的小应用，主要搞清楚如何将界面和代码相关联。