天天看点

iOS之UI--主流框架的搭建--仿制QQ的UI框架

使用xcode搭建多个控制器界面,一般在实际开发中建议超过四个控制器界面使用纯代码。

下面的实例其实已经超过了四个,总结详细步骤的目的,主要是更熟悉xcode的storyboard使用细节。

先直接上我们这个主流框架要达到的效果:

iOS之UI--主流框架的搭建--仿制QQ的UI框架

首先我们需要设置应用程序的图标:

iOS之UI--主流框架的搭建--仿制QQ的UI框架
iOS之UI--主流框架的搭建--仿制QQ的UI框架
iOS之UI--主流框架的搭建--仿制QQ的UI框架
iOS之UI--主流框架的搭建--仿制QQ的UI框架
iOS之UI--主流框架的搭建--仿制QQ的UI框架

最后记得:

iOS之UI--主流框架的搭建--仿制QQ的UI框架

然后首次启动应用程序效果:

iOS之UI--主流框架的搭建--仿制QQ的UI框架

最后还要记得把应用图标显示的名字改改:

iOS之UI--主流框架的搭建--仿制QQ的UI框架

效果:

iOS之UI--主流框架的搭建--仿制QQ的UI框架

接着开始主流ui框架的搭建,去掉storyboard原来默认自带的uiviewcontroller:

iOS之UI--主流框架的搭建--仿制QQ的UI框架

接着为tab bar viewcontroller连接新的子控制器

iOS之UI--主流框架的搭建--仿制QQ的UI框架

然后也要为uinavigation controller连接新的可编辑title的uitableviewcontroller

iOS之UI--主流框架的搭建--仿制QQ的UI框架
iOS之UI--主流框架的搭建--仿制QQ的UI框架

然后可以编辑:

iOS之UI--主流框架的搭建--仿制QQ的UI框架
iOS之UI--主流框架的搭建--仿制QQ的UI框架

总之要搭建成这样的,其实真正搭建起来很麻烦的,因为范围比较大,视图比较多。

一般实际开发中建议使用纯代码搭建,或者是一个控制器代码对应一个xib视图。

iOS之UI--主流框架的搭建--仿制QQ的UI框架

然后接着设置图标和标题:

在第一个消息子控制器中

iOS之UI--主流框架的搭建--仿制QQ的UI框架
iOS之UI--主流框架的搭建--仿制QQ的UI框架

在第二个"联系人"子控制器中

iOS之UI--主流框架的搭建--仿制QQ的UI框架
iOS之UI--主流框架的搭建--仿制QQ的UI框架

在第三个"动态"子控制器中,uitableview设置为static,然后:

iOS之UI--主流框架的搭建--仿制QQ的UI框架
iOS之UI--主流框架的搭建--仿制QQ的UI框架
iOS之UI--主流框架的搭建--仿制QQ的UI框架

最后运行动态图展示效果:

iOS之UI--主流框架的搭建--仿制QQ的UI框架

补充:隐藏底部tabbar

iOS之UI--主流框架的搭建--仿制QQ的UI框架