Storyboard新手入门(一)

摘要:
接下来,将Storyboard设置为默认UI管理器。因此,在Storyboard中添加一个NavigationController,并创建一个新的ViewController,并为其创建相应的ViewController类。界面如下:添加一个按钮,然后根据上述方法通过push将该按钮连接到另一个View。

      SB作为苹果推荐的管理界面的方式,虽然和代码控制UI各有千秋,但我们还是要紧跟苹果的潮流,既然是苹果力荐的,那么苹果一定会发力优化,那么在未来的开发中也会越来越普及。arc和mrc不就是个很好的例子么,现在还坚持mrc的开发者应该都绝迹了吧!在一些比较简单的UI上使用SB+自动布局将为我们带来许多方便,也免去适配的苦恼。复杂的地方再配合代码,事半功倍!

一、Storyboard与XIB的区别

      在之前使用XIB进行iOS应用的界面管理时,使用IB只能对一个界面一个界面进行单独管理,界面之前的逻辑关系需要开发程序员来牢记,如果界面过多,那会是一个非常复杂的关系。引入Storyboard后,我们可以看到上面的图可以看出,我们可以在一个窗口中管理多个View,多个View之间的关系非常清晰,所以这极大方便了开发者理清各个View之间的逻辑关系。

二、Storyboard中的元素     

      在Storyboard中有三种元素——起始标签、各个界面的View(scene)和联系各个View关系的转场(Segue)。

1、起始标签

      Storyboard新手入门(一)第1张

      一个Storyboard有且只有一个起始标签,起始标签指向的是这个Storyboard被启动时首先显示的界面,也就是程序的UI入口。相当于代码或XIB时AppDelegate里面的RootViewController。

2、ViewController(VC)

Storyboard新手入门(一)第2张

      一个VC对应一个界面,类似于一个XIB。任意添加subViews

3、Segue

      Segue表示了VC之间的转场关系,push ,present。分为Modal方式的Segue,Navigation方式的Segue,Push方式的Segue

          Storyboard新手入门(一)第3张          Storyboard新手入门(一)第4张

三、创建并运行一个Storyboard

      手动创建一个Storyboard的方法是选择新建一个文件(Command+N),然后在左边选择User Interface,再在右边的模版中选择Storyboard。然后选择设备类型(Device Family),可以选择iPhone、iPad。iPhone表示这个界面是为iPhone设备设计的,iPad表示这个界面是为iPad设备设计的。然后输入文件名并保存,我这里保存为User。接下来就要将这个Storyboard设置为默认的UI管理器。有两种方法,一种是在项目文件管理器中选择项目名称,然后选择General,然后设置Main Interface。

      另一种方法是在代码中来完成的,打开项目的AppDelegate.m文件,修改- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions方法如下:

Storyboard新手入门(一)第5张Storyboard新手入门(一)第6张
1 - (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
2 {
3     // Override point for customization after application launch.
4     // 创建一个UIStoryboard对象
5     UIStoryboard * storyboard = [UIStoryboard storyboardWithName:@"User" bundle:nil];
6     // 将storyboard设置为要显示的UI
7     self.window.rootViewController = [storyboard instantiateInitialViewController];
8     return YES;
9 }
View Code

      注意,如果项目中设置的Main Interface为Main.storyboard,又在代码中添加的其他storyboard为起始storyboard,那么代码添加的方式优先级最高。

四、Storyboard中各个界面间的切换Segue

1、类似于XIB的界面间切换

Storyboard新手入门(一)第7张Storyboard新手入门(一)第8张
- (IBAction)onClick:(id)sender {
    // 通过Storyboard中的View的Identifier标签来创建对应的ViewController
    XCViewCController * controller = [self.storyboard instantiateViewControllerWithIdentifier:@"viewC"];
    // 将这个ViewController设置为当前的ViewController
    [self presentViewController:controller animated:YES completion:nil];
}
View Code


      这里的Identifier在Identify Inspector中设置。

      Storyboard新手入门(一)第9张

2、使用modal方式的segue来控制界面中的逻辑关系。

      对于通常的View之间的UI界面切换,都可以使用modal方式。这里还新建一个ViewBController,并在其中添加一个名为Show A的button。再在ViewAController中添加一个Show B的button,界面已经在上面给出了。将ViewAController中的Show B按钮选中,然后按住键盘上的control按钮,并用鼠标拖出一条蓝线,将蓝线指到ViewBController中,松开鼠标,弹出一个对话框如下:

      Storyboard中选择Segue的方式

这里选择modal方式,这里也可以看出,Segue的方式有push、modal和custom三种方式。

3、使用push方式的segue来控制界面之间的逻辑关系

      push方式就是上面所见到的Action Segue中的push方式。

      push方式与modal方式不同的是,push方式只能使用在通过Navigation Controller派生出来的View中。所以这里在Storyboard中添加一个Navigation Controller,并再新建一个ViewController并分别为其创建对应的View Controller类,界面如下:

      Navigation Controller

      添加一个按钮,然后按照上面的方法将按钮通过push方式连接到另外一个View中。至于custom方法就是自定义传递方式了,这个segue需要自定义。

五、Storyboard中View间的数据传递

      Storyboard中View之间的数据传递是通过Segue来传递的,当为一个按钮添加一个push或modal方法后,用户点击按钮时,在界 面跳转的同时,还会触发方法- (void)prepareForSegue:(UIStoryboardSegue *)segue sender:(id)sender 。我们可以通过segue来传递数据到另外一个VC中。如上图,当用户点击button后,跳转到另外一个VC中,并传递另外一个VC中Label所要显示的类容。但一个View中可能有多个Segue,那来怎么判断呢?点击Segue,为每个Segue设定一个Identifier,这个跟设置View的Identifier一样的。然后重写上面这个方法。这里代码如下:

Storyboard新手入门(一)第12张Storyboard新手入门(一)第13张
- (void)prepareForSegue:(UIStoryboardSegue *)segue sender:(id)sender {
    // 在控制台打印Segue的信息
    NSLog(@"Source Controller = %@", [segue sourceViewController]);
    NSLog(@"Destination Controller = %@", [segue destinationViewController]);
    NSLog(@"Segue Identifier = %@", [segue identifier]);
 
    // 判断是哪个segue被执行了,并执行相应的操作
    if ([[segue identifier] isEqualToString:@"buttonPush"]) {
        // 获取目标View的Controller对象
        XCButtonPushViewController * pushController = [segue destinationViewController];
        // 设置目标Controller对象的数据模型
        pushController.textFieldString = [segue identifier];
    }
}
View Code

      然后目标VC类如下:

Storyboard新手入门(一)第14张Storyboard新手入门(一)第15张
#import <UIKit/UIKit.h>
 
@interface XCButtonPushViewController : UIViewController
@property (retain, nonatomic) NSString * textFieldString;
 
@end
View Code
Storyboard新手入门(一)第16张Storyboard新手入门(一)第17张
#import "XCButtonPushViewController.h"
 
@interface XCButtonPushViewController ()
@property (weak, nonatomic) IBOutlet UILabel *textField;
 
@end
 
@implementation XCButtonPushViewController
 
- (id)initWithNibName:(NSString *)nibNameOrNil bundle:(NSBundle *)nibBundleOrNil
{
    self = [super initWithNibName:nibNameOrNil bundle:nibBundleOrNil];
    if (self) {
        // Custom initialization
    }
    return self;
}
 
- (void)viewDidLoad
{
    [super viewDidLoad];
    // Do any additional setup after loading the view.
    _textField.text = _textFieldString;
}
 
- (void)didReceiveMemoryWarning
{
    [super didReceiveMemoryWarning];
    // Dispose of any resources that can be recreated.
}
 
@end
View Code

等待补充。。。

免责声明:文章转载自《Storyboard新手入门(一)》仅用于学习参考。如对内容有疑问,请及时联系本站处理。

上篇父元素和子元素的下拉框显示详解主干(trunk)、分支(branch )、标记(tag)下篇

宿迁高防,2C2G15M,22元/月;香港BGP,2C5G5M,25元/月 雨云优惠码:MjYwNzM=

相关文章

WPF 解决文本框设置了阴影效果后,因左右的transform变化引发的拉伸渲染问题

背景 最近遇到一个动画执行时,文本位置变化的问题。如下图: 如果你仔细看的话,当星星变小时,文本往下降了几个像素。 貌似有点莫名其妙,因为控件之间并不在同一个Panel布局控件中,不存在高度限制变化引发此类问题。所以有了如下测试 测试场景 字体类型影响 1. 首先新建了一个空项目,前面是一个带阴影的文本,后面用一张普通图片循环变更它的高度。尝试了下,还是...

iOS程序的启动过程-UIWindow

UIApplicationMain main函数中执行了一个UIApplicationMain这个函数 int UIApplicationMain(int argc, char *argv[], NSString *principalClassName, NSString *delegateClassName);argc、argv:直接传递给UIAppl...

TFS(Team Foundation Server)简介和新手入门

在两部分的文章。我会介绍Team Foundation Server一些核心功能,着重于产品的日常应用是如何将这些功能结合使用。 作为一个软件开发。在我的职业生涯,。我常常用于支持软件开发过程中大量的开发工具,版本控制工具如、包、生成脚本语言、单元測试框架和需求分析工具等等。在.NET平台上,大量的支持工具可以非常好地独立工作,可是。为了使得各种工具之间...

iOS自动布局高级用法 &amp;amp;&amp;amp; 纯代码约束写法

本文主要介绍几个我遇到的总结的高级用法(当然我相信肯定有不少比这还高级的)。 简单的storyboard中上下左右约束,固定宽高啥的用法在这里就不做赘述了。 autolayout自动布局是iOS6以后出现的,但是在开始的一段时间里大家并不怎么会用,都是一上来先勾掉。之后随着5s,iPhone6的出现屏幕多种多样。用多层if来判断尺寸已经完全hold不住了才...

Wpf(Storyboard)动画简单实例

动画的三种变换方式 RotateTransform:旋转变换变化值:CenterX围绕转的圆心横坐标 CenterY纵坐标 Angle旋转角度(角度正负表示方向) ScaleTransform:缩放变换变化值:ScaleX横向放大倍数ScaleY纵向(负值时翻转) TranslateTransform:平移变换变化值:X横坐标Y纵坐标 其中 <...

【WP8】让TextBox文本支持滑动(Scroll)

通过修改样式让TextBox支持文本滑动   在Silverlight上,TextBox是有文本滚动的功能的,当TextBox的文本过长时,可以进行拖动的,TextBox使用 VerticalScrollBarVisibility 和 HorizontalScrollBarVisibility 来控制滚动条的显示 在Windows Phone上的TextB...