服务器之家:专注于服务器技术及软件下载分享
分类导航

PHP教程|ASP.NET教程|Java教程|ASP教程|编程技术|正则表达式|C/C++|IOS|C#|Swift|Android|VB|R语言|JavaScript|易语言|vb.net|

服务器之家 - 编程语言 - IOS - iOS应用开发中StoryBoard搭建UI界面的基本使用讲解

iOS应用开发中StoryBoard搭建UI界面的基本使用讲解

2021-01-08 14:10吕文翰 IOS

这篇文章主要介绍了iOS应用开发中StoryBoard搭建UI界面的基本使用,代码基于传统的Objective-C,需要的朋友可以参考下

storyboard 的本质
storyboard 是苹果在 ios 5 中引入的新技术方案,目的是给纷繁复杂的 nib、xib 们一个温暖的家,让他们之间的关系更直观地展示出来,并提供了一种新的页面间跳转方式 segue。

storyboard 的本质是一个 xml 文件,描述了若干窗体、组件、auto layout 约束等关键信息。示例文件:https://github.com/johnlui/autolayout/blob/master/autolayout/base.lproj/main.storyboard

但是,我们应该认识到一个更重要的本质:使用 storyboard 的 ios 项目均以初始化 storyboard 文件作为整个程序的初始化入口,uiviewcontroller 类是由于被 storyboard 绑定而初始化,从而开始运行的。从下面两个地方可以找到蛛丝马迹:

iOS应用开发中StoryBoard搭建UI界面的基本使用讲解

iOS应用开发中StoryBoard搭建UI界面的基本使用讲解

奇怪的 bug
初学 ios 开发的时候,如果使用了 storyboard,大家可能遇到过这个奇怪的 bug,页面全黑:

iOS应用开发中StoryBoard搭建UI界面的基本使用讲解

如果大家跟我一样纯靠找资料自学而没有人教的话,一定出现过死活找不到原因而新建一个项目的尴尬情况吧 o(╯□╰)o,其实秘密在这里:

iOS应用开发中StoryBoard搭建UI界面的基本使用讲解

这表示这个窗体是此 storyboard 的初始窗体的意思,这样 app 在启动以后,会先启动主 storyboard,主 storyboard 会启动它的初始窗体,初始窗体启动跟他绑定的类,这样 app 就启动完成了。

多 storyboard 最佳实践
托福喵 【已下架】1.0 版是我第一个上架的项目,只用了初始化项目时建立的那唯一的 main.storyboard,里面有二十几个窗体,在 xcode 里每次点击打开都要等五秒才能完全渲染完毕,而且 segue 线交错纵横,非常凌乱。这显然不是个好的组织方式。

我现在正在重写的托福喵第二版已经采用了多 storyboard 的解决方案,把一些独立的窗体组合放到一起使用一个 storyboard 进行组织,比如登陆注册的几个窗体,考试界面的几个窗体,关于我们的几个窗体等。下面我们将一起学习如何使用多 storyboard。

新建第二个 storyboard

如下图:

iOS应用开发中StoryBoard搭建UI界面的基本使用讲解

给 second.storyboard 拖入一个 view controller:

iOS应用开发中StoryBoard搭建UI界面的基本使用讲解

如何调用 second.storyboard 中的窗体?

首先,编译项目,我们得到如下警告:

iOS应用开发中StoryBoard搭建UI界面的基本使用讲解

这个警告的意思是,这个窗体没有入口,无法被触达。如何让他能够被触达?两种方式:

设置为该 storyboard 的初始窗体:

iOS应用开发中StoryBoard搭建UI界面的基本使用讲解

给该窗体设置一个 storyboard id:

iOS应用开发中StoryBoard搭建UI界面的基本使用讲解

能够被触达之后,让我们用代码调用他们:

① 作为初始窗体

复制代码 代码如下:

let vc = uistoryboard(name: "second", bundle: nil).instantiateinitialviewcontroller() as! uiviewcontroller
self.navigationcontroller?.pushviewcontroller(vc, animated: true)


② 设置了 storyboard id

复制代码 代码如下:

let vc = uistoryboard(name: "second", bundle: nil).instantiateviewcontrollerwithidentifier("first") as! uiviewcontroller
self.navigationcontroller?.pushviewcontroller(vc, animated: true)


当然,也可以用 self.presentviewcontroller 调用他们。

 

查看效果

iOS应用开发中StoryBoard搭建UI界面的基本使用讲解

 

多个storyboard间跳转总结
stroyboard 可以被看作一个管理view画面的集合。也就是说一个ios专案裡面并没有限制只能有一个storyboard。
所以在你的app专案中,你可以把功能相近的view放到同一个app之中,形成一个群组,方便功能上的管理。

1.在专案中准备2个storyboard

在一个ios的专案裡面建立两个storyboard。

2. 在第一个storyboard中,我们拉出了一个navigation 的template,在[main view controller]这个中view裡面拉进一个button。

3. 接著在第二个storyboard裡面我们也拉出一个navigation template。
在画面中拉一个label标籤,并且在裡面我们把文字改成storyboard2。这只是用来识别目前我们被带到哪一个画面之中。

4. 在第一个storyboard画面中的botton裡面,我们要在按钮的[touchupinside]事件中撰写底下的程式码。

复制代码 代码如下:

uistoryboard *secondstoryboard = [uistoryboard storyboardwithname:@"storyboard2" bundle:nil];
uiviewcontroller* test2obj = [secondstoryboard instantiateviewcontrollerwithidentifier:@"test2"];  //test2为viewcontroller的storyboardid
[self.navigationcontroller pushviewcontroller:test2obj animated:yes];


第一步就是要先指定uistoryboard物件,这边我们要指向专案中的第二个storyboard。
接下来我们要先new出一个controller物件,这是你要push到的下一个view页面,他所对应的controller。
最后使用self.navigationcontroller推网页到下一页。

延伸 · 阅读

精彩推荐
  • IOS解析iOS开发中的FirstResponder第一响应对象

    解析iOS开发中的FirstResponder第一响应对象

    这篇文章主要介绍了解析iOS开发中的FirstResponder第一响应对象,包括View的FirstResponder的释放问题,需要的朋友可以参考下...

    一片枫叶4662020-12-25
  • IOSiOS通过逆向理解Block的内存模型

    iOS通过逆向理解Block的内存模型

    自从对 iOS 的逆向初窥门径后,我也经常通过它来分析一些比较大的应用,参考一下这些应用中某些功能的实现。这个探索的过程乐趣多多,不仅能满足自...

    Swiftyper12832021-03-03
  • IOSiOS布局渲染之UIView方法的调用时机详解

    iOS布局渲染之UIView方法的调用时机详解

    在你刚开始开发 iOS 应用时,最难避免或者是调试的就是和布局相关的问题,下面这篇文章主要给大家介绍了关于iOS布局渲染之UIView方法调用时机的相关资料...

    windtersharp7642021-05-04
  • IOSIOS开发之字典转字符串的实例详解

    IOS开发之字典转字符串的实例详解

    这篇文章主要介绍了IOS开发之字典转字符串的实例详解的相关资料,希望通过本文能帮助到大家,让大家掌握这样的方法,需要的朋友可以参考下...

    苦练内功5832021-04-01
  • IOSiOS 雷达效果实例详解

    iOS 雷达效果实例详解

    这篇文章主要介绍了iOS 雷达效果实例详解的相关资料,需要的朋友可以参考下...

    SimpleWorld11022021-01-28
  • IOS关于iOS自适应cell行高的那些事儿

    关于iOS自适应cell行高的那些事儿

    这篇文章主要给大家介绍了关于iOS自适应cell行高的那些事儿,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的...

    daisy6092021-05-17
  • IOSiOS中tableview 两级cell的展开与收回的示例代码

    iOS中tableview 两级cell的展开与收回的示例代码

    本篇文章主要介绍了iOS中tableview 两级cell的展开与收回的示例代码,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧...

    J_Kang3862021-04-22
  • IOSIOS 屏幕适配方案实现缩放window的示例代码

    IOS 屏幕适配方案实现缩放window的示例代码

    这篇文章主要介绍了IOS 屏幕适配方案实现缩放window的示例代码,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要...

    xiari5772021-06-01