IOS开发入门之六——storyboard的使用(中)

    上节我们了解了使用storyboard如何在单个页面上放置视图,并且设置这些视图的属性、位置约束等使之达到我们设计的效果。需要了解的人请点击"IOS开发入门之五——storyboard的使用(上)"

    这节我们继续介绍storyboard怎么实现从一个页面跳转到另一个页面。这两节都是纯粹介绍storyboard的使用,不会涉及到任何代码,来体验这样一种感受:使用storyboard即使我们没有写一行代码,也能做出一个像样的App。

一、创建项目    

    打开Xcode软件,创建一个"Single View App"项目,项目命名为"StoryboardDemo",不清楚怎么创建,请参看"IOS开发入门之二——第一个App"

二、创建第一个页面

    点击Main.storyboard文件,在storyboard的默认页面上加一个UILabel视图,不懂操作细节的人请点击"IOS开发入门之五——storyboard的使用(上)",如下图所示(阴影效果不会设置的请忽略):

    IOS开发入门之六——storyboard的使用(中)

    接下来我们继续在第一个页面上添加一个按钮UIButton视图,如下图所示:

IOS开发入门之六——storyboard的使用(中)

三、添加第二个页面

    我们先为第二个视图腾出一点空间,好放置它。如下图所示,通过适当的缩放以及位置调整,使页面大小适中,位置靠左一点。

IOS开发入门之六——storyboard的使用(中)

    接着我们在storyboard中加入第二个页面。如下图所示,在红色方框1处输入"UIViewController",然后按箭头2所示的视图拉到第一个页面的旁边,这样第二个视图就创建完成了。

IOS开发入门之六——storyboard的使用(中)

四、设置页面跳转

鼠标放置在第一个页面的按钮上,等鼠标图片变成一只手时按住右键并拖动到第二个页面,看到第二个页面整个变成蓝色时放开鼠标按键,这时会弹出下图所示的黑色框,我们选择最上面的"Show"这个选项。

IOS开发入门之六——storyboard的使用(中)

这时会出现如下图红色方框所示的一个图案,就说明跳转已经创建成功。这时就可以运行App了。

IOS开发入门之六——storyboard的使用(中)

有兴趣的读者,可以点击下面的链接继续了解:

IOS开发入门之七——storyboard的使用(下)