- 浏览: 13629555 次
- 性别:
- 来自: 洛杉矶
文章分类
- 全部博客 (1994)
- Php / Pear / Mysql / Node.js (378)
- Javascript /Jquery / Bootstrap / Web (435)
- Phone / IOS / Objective-C / Swift (137)
- Ubuntu / Mac / Github / Aptana / Nginx / Shell / Linux (335)
- Perl / Koha / Ruby / Markdown (8)
- Java / Jsp (12)
- Python 2 / Wxpython (25)
- Codeigniter / CakePHP (32)
- Div / Css / XML / HTML5 (179)
- WP / Joomla! / Magento / Shopify / Drupal / Moodle / Zimbra (275)
- Apache / VPN / Software (31)
- AS3.0/2.0 / Flex / Flash (45)
- Smarty (6)
- SEO (24)
- Google / Facebook / Pinterest / SNS (80)
- Tools (22)
最新评论
-
1455975567:
xuezhongyu01 写道wocan23 写道我想问下那个 ...
Mysql: LBS实现查找附近的人 (两经纬度之间的距离) -
xuezhongyu01:
wocan23 写道我想问下那个111.1是怎么得来的我也看不 ...
Mysql: LBS实现查找附近的人 (两经纬度之间的距离) -
18335864773:
试试 pageoffice 在线打开 PDF 文件吧. pag ...
jquery在线预览PDF文件,打开PDF文件 -
青春依旧:
opacity: 0.5; 个人喜欢这种方式!关于其他css特 ...
css透明度的设置 (兼容所有浏览器) -
July01:
推荐用StratoIO打印控件,浏览器和系统的兼容性都很好,而 ...
搞定网页打印自动分页问题
Storyboard 是在 iOS 5 SDK 中才出现的新名词,它其实就是原本的 Xib 档案(Interface Builder),用来制作介面排版方面的工具,当然在 Storyboard 里也多了很多应用的元件,其中 Storyboard Segue 可以让你几乎连程式码都不用写,就轻松完成两个 UIViewController 的切换工作,以下是我们的示范。
首先在开啓新专案时选择 Single View Application 来简化流程,可以少制作一个 UIViewController 与它对应的 class 档,如果各位有需要当然也可以开啓完全空白的干净的新专案,再自行加入 storyboard 与 UIViewController。
接着来到专案下的 storyboard 画面,从右下方的元件库中拉一个 UIViewController 到 storyboard 中,并且分别对两个 UIViewController 做介面上的设计:增加 Navigation Bar 来辨识彼此,与一个用来做页面切换按钮,如下图。
我们希望在页面 1 按下前往页面 2 的按钮时,画面能切换至页面 2,之后也能以同样的方法返回页面 1,为了达到目的,必须使用 Storyboard Segue 元件将两个 UIViewController,给连起来,由于 Storyboard Segue 是动态产生的,所以并不会出现在元件 Storyboard 的元件库中。
产生 Storyboard Segue 的方法常简单,就如同替介面元件和程式码做连结的拖曳方式一样的直觉,使用滑鼠右键将页面 1 内的按钮拖曳连结至页面 2 ,并选择 Model 做连结,Storyboard Segue 就会自动连结两个 UIViewController,如下图。
现在你可以用模拟器执行看看,在 Segue DEMO 页面 1 按下前往页面 2 的按钮时,画面就会切换至页面 2,如果想要使用不同的换页效果,可以在 Storyboard Segue 中的 Transition 属性做修改,范例中所使用的是翻页 Partial Curl 效果。
下来就是从页面 2 「返回」页面一,在这里我们特别强调「返回」而不是前往,一个错误的做法,是按照上面的步骤将页面 2 的按钮拖曳连结至页面一的 Model,使整个 Storyboard 的佈局如下图。
如果你按照这样的设计方式来执行,你会发现两个页面的确可以互相切换,功能上是正确,但是背后的意义却大不相同,而且在多次切换后很有可能创造过多的 UIViewController 实体,这样做画面每次都会朝同样的方向来做切换的效果,每次都会建立一个新的 UIViewController 实体来使用。
我想大家应该都猜到正确的做法应该是在页面 2 的程式码中使用 dismissModalViewControllerAnimated: 方法,或是 dismissViewControllerAnimated:completion: 方法来解散页面 2,并返回先前的页面。
替专案新增一个 UIViewController 的 Subclass,我们命名为 Page2ViewController,并取消 With XIB for user interface(我们已经建立了它的介面),接着在其中实作一个按钮事件来解散页面,程式码如下。
- (IBAction)returnToFirstPage:(id)sender { [self dismissViewControllerAnimated:YES completion:^{}]; }
最后回到专案下的 Storyboard,将我们新产生的 UIViewController 与 Page2ViewController 做连结,连结的方式是在 UIViewController 的属性中选择对应的 class 档,如下图,之后将其按钮元件与 Page2ViewController 的按钮事件做连结即可。
现在再用模拟器执行看看,按下页面 2 中的按钮,画面会以相反的方向的切换效果来返回页面 1。
我们已经成功建立两个可以互相切换的 UIViewController,一个是透过 Storyboard Segue 来切换,另一个则是使用 dismissViewControllerAnimated: 的方法来返回先前的 UIViewController,接下来就是要解决两个 UIViewController 之间传值的问题,这里同样提供两个方法,在页面 1 的部份同样使用 Storyboard Segue 来帮助我们传递资讯给页面 2,而在页面 2 的部份,则是使用老方法,透过代理委托 delegate 的方式来传送资讯。
首先我们在两个 UIViewController 分别拉一个 UITextField 元件,并将此元件与 class 做连结,分别命名为 page1TextField 与 page2TextField,连结的方式可以参考从使用 UIButton 说 Hello 开始说起(上)ㄧ文,如果是使用 Xcode 4 的朋友也可以直接参考 Xcode 4 的 Assistant Editor 关联编辑功能ㄧ文,节省撰写程式码的时间。
在透过 Storyboard Segue 传值的部份,我们必须在页面 2 的 UIViewController class 里设置一个 NSString 的变数,它的目的是用来接收由页面 1 透过 Storyboard Segue 所传过来的资讯,程式码如下。
@property (weak) NSString *string; //别忘了在对应的实作档中加入@synthesize string;
之后在 viewDidLoad 的函式里我们将 string 的值指定给 page2TextField,这个动作会让页面 2 的画面在被开啓时就会把 page2TextField 的内容设成 Storyboard Segue 所传送过来的值。
- (void)viewDidLoad { [super viewDidLoad]; page2TextField.text = string; }
接着回到页面 1 的 UIViewController class 里,新增一个内建的函式如下,就完成透过 Storyboard Segue 传值的方法。
- (void)prepareForSegue:(UIStoryboardSegue *)segue sender:(id)sender { //将page2设定成Storyboard Segue的目标UIViewController id page2 = segue.destinationViewController; //将值透过Storyboard Segue带给页面2的string变数 [page2 setValue:page1TextField.text forKey:@"string"]; }
另一个方法就是使用代理委托 delegate 的方法,透过建立一个协定 @protocol 的方式,让其它的採纳此协定的 class 可以实作协定内的函式,我们在页面 2 的 UIViewController class 里设置一个协定,并且在页面 1 的 UIViewController class 里实作协定里的方法,让程式执行到页面 2 时,仍然能够取得页面 1 的实例 Instance,进而使用协定里的方法来设定 page2TextField 的数值。
首先来到页面 2 的 UIViewController class,建立一个协定 Page2Delegate,并且定义其内部的方法 passValue:,接着宣告一个採用此协定的物件 delegate,其程式码如下。
#import <UIKit/UIKit.h> //建立一个协定 @protocol Page2Delegate //协定中的方法 - (void)passValue:(NSString *)value; @end @interface Page2ViewController : UIViewController @property (weak, nonatomic) IBOutlet UITextField *page2TextField; @property (weak) NSString *string; //宣告一个採用Page2Delegate协定的物件 @property (weak) id delegate; @end
接下来就是决定协定中的方法要在什么时候生效,也就是要在什么地方呼叫 passValue: 方法函式,而此函式会在採用此协定的类别 Class 中被实作。回顾程式的需求,我们希望在页面 2 按下返回页面 1 的按钮时,能将 page2TextField 的数值传给页面 1 的 page1TextField,所以呼叫协定 passValue: 方法的程式码,势必要写在此按钮事件中。
- (IBAction)returnToFirstPage:(id)sender { [self dismissViewControllerAnimated:YES completion:^{}]; //呼叫协定中的方法并带入page2textField的数值 [delegate passValue:page2TextField.text]; }
现在,当我们按下页面 2 的按钮时,就会呼叫採用 Page2Delegate 协定的 class,而此 class 必须要实作此协定内的方法,所以回到页面 1 的 UIViewController class,我们要替此 class 採用 Page2Delegate 的协定,并且实作协定内的 passValue: 方法函式。
採用协定的方式是在 @interface 区段的地方加上 <协定名称> 的程式码,由于此协定是写在别的 class 中,所以在採用协定之前别忘了先引用它,以下是页面 1 的 UIViewController class .h 标头档。
#import <UIKit/UIKit.h> //引用持有Page2Delegate协定的class #import "Page2ViewController.h" @interface MLViewController : UIViewController //採用协定 @property (weak, nonatomic) IBOutlet UITextField *page1TextField; @end
接着在 .m 实作档中实作协定内的 passValue: 方法函式。
- (void)passValue:(NSString *)value { //设定page1TextField为所取的的数值 page1TextField.text = value; }
最后一个步骤,也就是大家常常会忘记的,要将代理 delegate 设成自己(页面 1 的 UIViewController),也就是大家在使用协定时最常写的一行程式码 object. delegate = self(object 指的就是页面 2 的 UIViewController),至于这行程式码要写在哪里?还记得之前透过 Storyboard Segue 传值的部份,我们已经藉由内建的函式取得页面 2 的 UIViewController 实例 page2,所以我们修改此内建函式,利用 page2 来设定 delegate 变数。
- (void)prepareForSegue:(UIStoryboardSegue *)segue sender:(id)sender { //将page2设定成Storyboard Segue的目标UIViewController id page2 = segue.destinationViewController; //将值透过Storyboard Segue带给页面2的string变数 [page2 setValue:page1TextField.text forKey:@"string"]; //将delegate设成自己(指定自己为代理) [page2 setValue:self forKey:@"delegate"]; }
如果忽略此步骤,页面 2 里的 delegate 参数在呼叫 passValue 方法时,并不会知道是谁(哪个 class)实作了它的方法,因此参数也无法由页面 2 传递至页面 1。
ps:如果你对于解散 UITextField 的小键盘有问题,可以参考UITextField 输入结束后的收起小键盘的方式ㄧ文。
来源:http://furnacedigital.blogspot.com/2011/12/storyboard-segue-uiviewcontroller.html
评论
发表评论
-
手机firebug查看网页代码 How to View Website Source Codes on iPad / iPhone
2016-04-26 02:41 1120You’re using your iPad to br ... -
Android模拟器genymotion的安装和使用
2016-03-18 01:16 2470Genymotion概述 Genymotion是一套完整的 ... -
编码之道:取个好名字很重要
2015-10-14 05:19 1116代码就是程序员的孩子,给“孩子”取个好听的名字很重 ... -
Genymotion - 强大好用高性能的 Android 模拟器 (在电脑流畅运行APK安卓软件游戏的利器)
2015-06-05 13:34 7319随着 Android 系统的应用和游戏越来越丰富,甚至有 ... -
收集几个移动平台浏览器的User-Agent
2014-07-23 02:33 2972List of all Mobile Browsers ... -
常用浏览器修改User-Agent的方法
2014-06-28 02:58 10901之前有介绍收集的几个移动平台浏览器的User-Agent,以 ... -
更简洁的方式修改Chrome的User Agent,轻松体验移动版网络
2014-06-28 02:53 6865国庆节在家宅着,使用3g上网卡上网,和在公司上网不一样的是 ... -
3个检测浏览器User-Agent信息的网站
2014-06-28 02:52 2495刚刚在收集各个移动平台浏览器的User-Agent(参见这 ... -
根据移动设备屏幕像素密度,给予不同分辨率的图片
2014-06-26 00:52 2905在出现iphone4之前的相当长的时间内,网站开发人员 ... -
视网膜New iPad与普通分辨率iPad页面的兼容处理
2014-06-26 00:44 1268一、这是篇经验分享 ... -
iOS8开发-Swift编程
2014-06-25 00:45 1825课时列表 章节1:第一个Swift应用 ... -
Swift中文教程(二十三) 高级运算符
2014-06-25 00:43 780除了基本操作符中所讲的运算符,Swift还有许多复杂的高级 ... -
Swift中文教程(二十二) 泛型
2014-06-25 00:35 1002泛型代码可以让你写出根据自我需求定义、适用于任何类型的,灵 ... -
Swift中文教程(二十一) 协议
2014-06-24 05:25 1003Protocol(协议)用于统一方法和属性的名称,而不实现任 ... -
Swift中文教程(二十) 扩展
2014-06-24 00:47 682扩展就是向一个已有的类、结构体或枚举类型添加新功能(fun ... -
Swift中文教程(十九) 类型嵌套
2014-06-24 00:44 883枚举类型常被用于实现特定类或结构体的功能。也能够在有多种变量 ... -
Swift中文教程(十八) 类型检查
2014-06-24 00:41 721类型检查是一种检查类实例的方式,并且或者也是让实例作为它的 ... -
Swift中文教程(十七) 可选链
2014-06-17 05:11 862可选链(Optional Chaining)是一种可以请求 ... -
Swift中文教程(十六) 自动引用计数
2014-06-17 05:05 1241Swift使用自动引用计数(ARC)来管理应用程序的内存使 ... -
Swift中文教程(十五) 析构
2014-06-17 04:57 995在一个类的实例被释放之前,析构函数会被调用。用关键字dei ...
相关推荐
使用storyboard 的segue 从后向前进行传值
在StoryBoard动态加入UIViewController 我们先创建一个Tabbed Aplicaiton,这里包含两个viewController,一个first view controller ,一个second view controller ,我们想动态的创建第三个viewController , 即一点...
Crank Storyboard Suite汽车仪表盘设计实例
这个UIViewController的类别提供了一个便利的方法,可以直接生成一个控制器实例,而不用理会这个控制器是在哪个storyboard中创建的。 github:https://github.com/developforapple/DDStoryboard 欢迎给 star
storyboard的unwind segue用法小结,博客文章:http://blog.csdn.net/kid_devil/article/details/23218195
示例说明了StoryBoard视图切换的几种方式以及如何返回
使用storyboard布局的TabbarViewController框架,包含多个storyboard,xib与storyboard混合使用,并提供两种侧滑返回上一个页面的方法。兼容iphone,ipad,支持ios6以上
这个Demo只是简单的使用storyboard的跳转和传值
一、使用Storyboard进行跳转 1)纯Storybard界面操作 2)使用代码进行跳转 二、Storyboard界面传值 1)使用prepareForSegue方法进行跳转: 2)Storyboard Id跳转
storyboard的使用范例,关键掌握跳转,赋值,跳回;
ios通过storyboard实现helloworld显示
iOS引入storyboard后,写控件再没有这么简单了。从前只写控件就需要好几页的代码,现在只需要简单的拖拽就实现了。不过,如果是在合作开发中,如果两个人同时修改同一个storyboard文件时,就会引起代码冲突,因此...
作者developforapple,源码DDStoryboard,这个UIViewController的类别,提供了一个便利的方法,可以从storyboard中取出实例,而不用理会这个控制器是在哪个storyboard中创建的。 使用方法: 1:在storyboard中拖...
IOS制作启动广告图,兼容LaunchImage加载启动图和LaunchScreen启动,详细讲解可以查看博客:http://blog.csdn.net/wx_jin/article/details/50617041
一个演示xcode中Storyboard使用的小例子,出处为ios5 by tutorials这本书。详见raywenderlich.com
用storyboard开发了一个小的tableview的demo,供大家学习storyboard使用。
示例列举了使用StoryBoard的详细情况,以及使用多个StoryBoard,StoryBoard与xib文件的混用
NULL 博文链接:https://luckfox.iteye.com/blog/1826416
ios 5.1 Storyboard 多视图切换包括实现自定义协议delegate等
Storyboard和XIB简单的混合使用