现在的位置: 首页 > 综合 > 正文

IOS StoryBoard视图切换

2017年12月07日 ⁄ 综合 ⁄ 共 2975字 ⁄ 字号 评论关闭

IOS StoryBoard视图切换


一、视图切换类型

在storyboard中,segue有几种不同的类型,在iphone与ipad的开发中segue的类型是不同的,
在iphone中,segue有:push、modal、custom三种类型,区别主要在于新页面出现的方法
在ipad中,segue有:push、modal、popover、replace、custom五种不同的类型


二、视图切换类型说明

1、Push是树形导航

push类型一般是需要头一个界面是NavigationController的,是在NavigationController向下一级滑动的时候使用相当于[self.navigationController pushViewController:nil animated:YES];,在栈中压入一个viewcontroller,返回的时候相当于:[self.navigationController
popViewControllerAnimated:YES];弹出一个viewcontroller

2、Model是模态导航模式

常用场景是新的场景盖住旧的场景,用户没有办法与上一个场景交互,除非关闭当前场景
是viewcontroller中的标准切换方式,可以包括淡出以及切换动画
相当于代码的[self presentModalViewController:nil animated:YES];(modal方式跳转)
[self dismissModalViewControllerAnimated:YES];(modal方式返回)

3、custom

自定义跳转方式

4、popover(iPad only)

popover类型,就是采用浮动窗的形式把页面展示出来

5、Replace(iPad only)

替换当前scene


三、视图切换方法

接下来我们来说页面切换
首先新建一个Project,命名StoryBoardSegueDemo,新建完成以后,打开storyboard,界面如图,选中ViewController,点击顶部菜单栏Editor->Embed In->Tab Bar Controller,完成以后如下图

然后在向storyboard在添加一个ViewController,选中刚刚添加的ViewController,点击顶部菜单栏中的Editor->Embed In -> Navigation Controller,完成以后如下图:

然后右键点击Tab Bar Controller,显示如下:

点击view controllers后面的圆圈,指向Navigation Controller,完成以后如下图:

然后分别上上面的viewcontroller拖放button,分别命名为First与second,然后在向storyboard拖放两个viewcontroller,分别在放两个Button,修改文本为First_Next,Second_Next

1、视图切换(通过Button的Action)

鼠标选中First按钮,右键点击,如下图:点击Triggered Segues->action后面的空心圆圈,指向viewcontroller上面按钮为First_Next的viewcontroller,松手以后选择“modal"(只能选中modal,不能使用push,根controller不是Navigation
Controller),
同样的方法选中Second按钮,指向viewcontroller上面按钮为second_Next的viewcontoller,然后松手,这次选择"push"(由于根controller是Navigation Controller,当然了也可以选择modal),全部完成以后如下图:

2、视图切换方式二(通过StoryBoard上面定义的ViewController的identify)

然后再次向storyboard上拖放一个viewcontroller,同时设置其identity->Storyboard ID为"firsttothree",然后拖放一个button,命名First_Three,如下图:

在First_Next按钮所在的viewcontroller上面,拖放一个button,修改text为Go To Three,新建一个类,命名FirstNextViewController,继承自UIViewController,如下图:

打开storyboard,选择viewcontroller上面为First_Next按钮的controller,修改”Custom Class" 为刚刚新建的类,打开FirstNextViewController的头文件
定义一个函数,然后在.m文件中实现,截图如下:

选择"Go To Three"按钮,右键点击,将"Touch up Inside"指向First Next View Contrlller,指向上面定义的点击函数,如下图:

3、视图切换(通过ViewController的Segues)

我们再次添加一个viewcontroller,在上面拖放一个按钮,命名为First_Four,同时在viewcontroller上面有First_Three的controller上面再次拖放一个按钮,修改text为Go To Four,新建一个类,命名为FirstThreeController,继承自UIViewController,完成以后修改viewcontroller的"Custom Class"为FirstThreeViewController,在FirstThreeViewController.h头文件中定义一个点击函数,并且在.m文件中实现,代码如下图:

让"Go To Four"的点击事件指向上面定义的函数,选中该viewcontroller,右键点击,选择Tigggered Segues->manual 后面的空心圆圈,指向下一个viewcontroller,选中这两个viewcontroller的连线,设置identifier属性为firsttofour,如下图:

4、视图切换返回

接下来我们做返回(modal方式的),在viewcontroller上面分别有First_Three与First_Four的controller分别添加两个按钮,修改text分别是"Back To up"与"Back To First",完成以后如下图:

在FirstThreeViewController中定义返回函数,让Back To up的点击事件的指向该返回函数,


这样就可以返回上一级了,然后我们说一下怎么回到根目录,在根viewcontroller的类文件中定义一个函数(此例中我们的根viewcontroller指向的类是LTViewController),函数如下:

- (IBAction)unwindSegue:(UIStoryboardSegue *)sender{
    NSLog(@"unwindSegue %@", sender);
}

选中根viewcontroller的“Exit",按住Ctrl,拖动鼠标指向执行返回根viewcontroller的viewcontroller上面的按钮,如下图:


这样就返回到了根目录

示例代码下载

抱歉!评论已关闭.