爬爬爬之路:UI(四) 晃动响应 触摸响应 响应者链 显示动态图片

引言

其实, 手机做的只有两件事. 一个是显示信息, 一个交互.
对于开发者来说, 显示信息属于铺设界面. 交互则属于事件响应.
对于ios开发人员而言, 苹果已经提供了一套完整的硬件支持, 类库, 框架和响应方法接口. 我们只需要获取这个接口, 并写入操作信息, 系统会自动响应我们的代码逻辑.

---

先说响应者链

在之前的文章中已经大致的提过.
必须是继承自UIResponder类的子类才拥有响应事件的能力. (可视化控件都是继承或者间接继承UIResponder类的.)
响应者链主要分为两个过程:

1. 查询过程
   当每一次点击屏幕时,系统通过硬件反馈判定触屏具体操作, 将该信息发送至应用程序, 应用程序开始从低向上一层层查找. 顺序大致为: 应用程序->window->控制器->self.view->view子视图 一一查找, 查找到屏幕触碰的点在屏幕最上层的地方所在的视图. 直到定位到被点击的子视图.

2. 响应过程.
   当定位到具体的子视图时, 会自动检测本视图有无响应的对应操作的处理方法. 比如简单的单点屏幕, 系统会查到被点击的控件里是否实现了响应点击(touchBegan touchEnded等方法), 若无则往下寻找, 找到其父视图, 若仍无继续往下找. 知道window为止. 如果都没有响应的处理方法(无处理). 则会遗弃该次点击时间.(无效点击)

当控件2上发生了点击事件, 系统通过硬件获得了该事件(并判断出具体是点击还是滑动等), 先从应用底层往上找, 直到获得发生点击事件的坐标, 判断该坐标在最上层所属的控件. 比如判断此时是控件2来响应事件. 然后判断控件2是否有相应时间的处理方法, 若无, 继续查子视图上有无处理方法, 一层层找到UIWindow. 若最后都没找到响应的处理方式. 就会把该事件抛给应用程序, 如果应用程序也没法处理该事件, 就会丢弃该事件.

响应者链不是不可断的. 我们可以人为的对控件的属性进行设置. 让某个控件不响应事件.
button.userInteractionEnabled = NO; // 阻断查询过程的方法.
通过userInteractionEnabled属性设置某个控件是否可以响应用户操作.
若设为no, 则该控件无法响应用户操作.

• 本属性阻断的是响应者链的查询过程.
• UILabel和UIImageView控件的交互 默认是关闭的. 添加在UILabel或者UIImageView上的控件比如(UIButton)是不会被响应的. 若需要操作必须首都把其交互打开label.userInteractionEnabled = YES;

---

响应点击和滑动事件

 // 开始触摸触发
- (void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event;

// 触摸移动触发
- (void)touchesMoved:(NSSet *)touches withEvent:(UIEvent *)event;

// 结束触摸触发
- (void)touchesEnded:(NSSet *)touches withEvent:(UIEvent *)event; 

// 意外结束触摸触发
- (void)touchesCancelled:(NSSet *)touches withEvent:(UIEvent *)event; 

当用户点击或触摸屏幕的时候, 根据触摸的状态会分别触发以上4个方法.

参数touches储存了UITouch对象的信息, 其中包括触摸事件发生所在的控件信息, 点击次数, 上一次被点击或触摸的点相对某一视图的坐标, 本次被点击或触摸的点相对某一视图的坐标. 等等

获取触摸点:

UITouch *touch = [touches anyObject];

获取当前触摸的点相对本视图的坐标:

CGPoint locationPoint = [touch locationInView:self];

获取上一次触摸的点相对本视图的坐标

CGPoint previousPoint = [touch previousLocationInView:self];

当屏幕滑动时, 通过判断上一次触摸的点和本次触摸的点的坐标差值即可知道滑动的方向.

---

晃动事件

现在的手机除了可以响应点和滑以外, 还可以响应摇晃状态(比如摇一摇功能, 比如重力感应)

// 开始摇晃
- (void)motionBegan:(UIEventSubtype)motion withEvent:(UIEvent *)event {
    NSLog(@"屏幕开始摇晃");
}

// 摇晃结束
- (void)motionEnded:(UIEventSubtype)motion withEvent:(UIEvent *)event {
    NSLog(@"摇晃结束");
}


// 晃动意外结束
- (void)motionCancelled:(UIEventSubtype)motion withEvent:(UIEvent *)event {
    NSLog(@"摇晃意外结束");
}

模态视图
利用ViewController的平行关系进行页面跳转.
跳转方法:
[self presentViewController:self.secondVC animated:YES completion:nil];
从本视图控制器跳转到self.secondVC视图控制器.
若要从self.secondVC中跳转会本视图控制器
则在self.secondVC的响应事件中添加语句
[self dismissViewControllerAnimated:YES completion:nil];
本句的意思为跳回上一控制器. 可以理解为谁跳到这个界面, 这个界面就会回到之前那个界面.

模态视图的跳转默认动画是从下往上弹出, 跳回的默认动画是从上往下回收.
可以更改跳转动画的效果

// 设置跳转到的界面的动画效果.
self.secondVC.modalTransitionStyle = UIModalTransitionStyleCoverVertical;
// UIModalTransitionStyleCoverVertical 默认垂直向上
// UIModalTransitionStyleFlipHorizontal 翻转效果
// UIModalTransitionStyleCrossDissolve 淡入淡出效果
// UIModalTransitionStylePartialCurl 翻页效果

实现, 晃动屏幕切换界面的功能:

创建两个视图控制器:
RootViewController和SecondViewController
将self.window的根试图设置为RootViewController对象

在RootViewController中实现晃动响应方法:

// 摇晃结束
- (void)motionEnded:(UIEventSubtype)motion withEvent:(UIEvent *)event {
    SecondViewController *secondVC = [[SecondViewController alloc] init];
    // 给跳转添加一个翻页效果
    secondVC.modalTransitionStyle = UIModalTransitionStylePartialCurl;
    [self presentViewController:secondVC animated:YES completion:nil];
    [secondVC release];
}

在SecondViewController中添加方法:

- (void)motionEnded:(UIEventSubtype)motion withEvent:(UIEvent *)event {
    // 返回跳转到本界面的界面.
    [self dismissViewControllerAnimated:YES completion:nil];
}

---

UIImageView

UIView是不能直接显示图片的.
在UI界面中, 想要显示图片, 必须借助UIImageView控件.

一般来说UIImageView只显示静态图片, 但是UIImageView一样具备显示动态图片的能力.

// 创建一个UIImageView, 给定一个框架
UIImageView *imageV = [[UIImageView alloc] initWithFrame:self.view.bounds];

// animationImages是UIImageView对象专门存放UIImage对象的数组
// 按照播放顺序放入图片. .tiff是 .gif单桢图片的格式
imageV.animationImages = @[[UIImage imageNamed:@"dongtu.tiff"],[UIImage imageNamed:@"dongtu1.tiff"],[UIImage imageNamed:@"dongtu2.tiff"],[UIImage imageNamed:@"dongtu3.tiff"],[UIImage imageNamed:@"dongtu4.tiff"],[UIImage imageNamed:@"dongtu5.tiff"],[UIImage imageNamed:@"dongtu6.tiff"],[UIImage imageNamed:@"dongtu7.tiff"],[UIImage imageNamed:@"dongtu8.tiff"],[UIImage imageNamed:@"dongtu9.tiff"],[UIImage imageNamed:@"dongtu10.tiff"],[UIImage imageNamed:@"dongtu11.tiff"]];

// 设置播放时间一组图片的时间
imageV.animationDuration = 1.5f;

// 设置循环播放的次数 0为无限播放
imageV.animationRepeatCount = 0;

// 启动播放功能
[imageV startAnimating];
[self.view addSubview:imageV];
[imageV release];

mac OS X 系统下拆分gif图片非常简单, 在桌面双击gif图片即可. 将左侧列表中的所有图片取出保存即可. 便于查找方便, 建议重命名为一组有顺序关系的图片.

事实上利用UI展示动图的方法不止一种, 以后有机会再介绍