开发笔记 - storyboard的一些初级使用

简介: 开发笔记 - storyboard的一些初级使用

本来想写一些高大上的东西,例如运行时机制,以及关于上架方面的新的.想了好久,我认为自己的水平还处于UI学徒的汪洋大海中 ,开发张的很多很多问题,其实你只需要一个谷歌浏览器,提问的当很多都是手到擒来的.话说还是有很多人,学历高,开发中的问题也多,不善于总结.甚至只需要你百度一下,谷歌搜索就能解决的问题,还是拿到群里,各种提问,苦逼的是,回答的时候,回答者,除非自己遇见过的惊天大坑,还是要依赖谷歌来回答.算不算是一种讽刺? 好像话又离题了.我认为现在如果是初级程序员,完全不是面向对象编程,而是面向搜索引擎编程,只要get搜索的能力,那么%99.9999 的需求以及功能都是可以解决的.

为熟而已!

扯了这么多,还是拿一点最初级的知识.献给大家吧. 一来学习是为了分享,分享的同时也是提升,输出.现在已经不喜欢去copy一些技术文来糊弄读者,一是对自己的不尊重,而是对原创作者尊重.这些我是顿时领悟到的.只有自己写,自己输出才是自己的.不怕写的不好,写的好了自然就有人看,写的不好,给自己看~~~

一般人用布局两种StoreBoard跟纯代码.那种优劣?

玩不转StoreBoard的都喜欢用纯代码.不解释.

(1)StoreBoard优点:

Auto Layout,做适配很方便;

多语言很方便;

静态TableView,CollectionView极其方便;

最重要的是直观,结构清晰,一目了然!

冲突问题:storyboard一般只是用于展示页面布局,布局不是个经常变动的东西,如果需要修改,修改的次数也非常的少。一般在团队中专门约定几名负责人专门修改页面布局就可以了。如果真的需要很多人改,请拆分storyboard。

性能问题:性能的瓶颈真的在这里吗?有这些时间多多优化一下代码,多使用异步block的效果更为明显吧。

大型项目的问题:大型项目中细分storyboard不仅可以解决打开卡顿的问题,也会使产品线更为直观。

复用问题:storyboad的确不能复用,可复用的组件可以用NIB进行封装,然后引入storyboad。

(3)什么时候使用storyboard?

组织多种view的层级关系,也就是传说中的segue。使用一些列表或表格单元的模板的时候。能使用storyboard的情况下尽量用storyboard。

什么时候不建议使用storyboard?

动态或复杂布局,这时候可能需要用代码来计算相关view的位置。如果一个view已经用NIB或代码实现

(4)什么时候使用nib?

模态框(如登录提示什么的)可复用视图组件或模板

什么时候不推荐使用nib?

有动态内容的视图

不方便在IB中进行设计的试图

(5)什么时候使用代码?

纯代码好处就是灵活,接手项目的时候好改。缺点,很明显慢。

什么时候不推荐使用代码?

什么时候使用代码都是一个好方法,但不一定是最好的。

纯代码可以使用masonry,可视化编程使用AutoLayout

我自己的项目可以说是所有界面均有SB和XIB 组合而成.很多人说storyboard的跟XIB不好,实际是因为玩的不够溜而已

下面我来介绍一下storyboard 的几个常用的用法


image.png

上面这张图就是传说中的连线 ,segue 简称色鬼 你可以用它来传值,也可以用它来跳转控制器

- (IBAction)goAction:(id)sender

{

// 根据指定线的ID跳转到目标Vc

[self performSegueWithIdentifier:@"SendValue" sender:self];

}

- (void)prepareForSegue:(UIStoryboardSegue *)segue sender:(id)sender {

// segue.identifier:获取连线的ID

if ([segue.identifier isEqualToString:@"SendValue"]) {

// segue.destinationViewController:获取连线时所指的界面(VC)

ReceiveViewController *receive = segue.destinationViewController;

receive.name = @"Garvey";

receive.age = 110;

// 这里不需要指定跳转了,因为在按扭的事件里已经有跳转的代码

// [self.navigationController pushViewController:receive animated:YES];

}

}


image.png

除此之外你还可以这样用


image.png

你可能不知道上面的图有什么卵用?


image.png

再来看一下方法内部的实现

image.png

你看谁说SB不好跳转控制器啥的.写个方法放在基类,只要保持规范,随便你跳跳跳!

在看下SB做布局


image.png


image.png

在这里,你可以直接给控件做布局, top left button right 上左下右

宽,高,自身比例

image.png

水平,垂直居中.看英文跟符号你就能知道意思了.

image.png

在这里你可以做相对布局了.

一般,我的做法是直接 父控件 做等宽高

然后MultiPlier 不是有一个1 吗?

这里就是你可以调整比例 从0 -1  

至于怎么算比例,例如 我想做一个view 大小100 并且在任何6显示正常 在5s 跟6S 相对根据比例来增大怎么做呢?

如果你直接写死宽度 100 跟高度100

那么恭喜你,在6是正常的.在5S就会看起来大了一点,因为机型跟分辨率高了.在6S就更小了.

是不是有这种情况.那么我用SB怎么做呢?先看分辨率机型图

iphone5屏幕尺寸320 x 568屏幕分辨率640x1136

iphone6屏幕尺寸375 x 667屏幕分辨率640x1334

iphone6Plus屏幕尺寸414 x 736屏幕分辨率1080x1920。

image.png

image.png


设置的宽度跟高度,都是跟View去做的等宽高.

我是以6的原型去参照. 那么它就会去算比例,在6s的时候, 高度就会变成屏幕高度 * (100/667.0)

宽度就会变成 屏幕宽度*(100/375)

你看这样他就会根据机型来觉得view的宽高,从而显示不同的宽高.是不是很灵活呢?

image.png

这个选项,决定了会不会参与编译.如果你不勾选,那么就不会参与编译.

image.png

简单点说就是automaticallyAdjustsScrollViewInsets根据按所在界面的status bar,navigationbar,与tabbar的高度,自动调整scrollview的 inset,设置为no,不让viewController调整,我们自己修改布局即可~

下面我还要花20000+ 的文字来描述SB 的好用之处.自己脑补去吧,任何技能你想要get记住,只能多谷歌,不要去百度.自己多去练习,真的想别人免费给你写文章文字来告诉你技能?只能告诉你想多了,哈哈哈.一切再好的文章不如亲手实操几遍来的快.


相关文章
|
10月前
|
uml
CocosCreator3.8研究笔记(二十一)CocosCreator Tween系统理解(1)
CocosCreator3.8研究笔记(二十一)CocosCreator Tween系统理解
470 0
|
10月前
CocosCreator3.8研究笔记(二十一)CocosCreator Tween系统理解(2)
CocosCreator3.8研究笔记(二十一)CocosCreator Tween系统理解
|
10月前
CocosCreator3.8研究笔记(二十一)CocosCreator Tween系统理解(3)
CocosCreator3.8研究笔记(二十一)CocosCreator Tween系统理解
198 0
|
图形学
unity-初级动画系统
unity-初级动画系统
91 0
C#编程-127:WPF初级入门
C#编程-127:WPF初级入门
C#编程-127:WPF初级入门
|
JSON 小程序 API
小程序开发-第三章第二节下拉刷新,上拉加载-全栈工程师之路-中级篇
小程序开发-第三章第二节下拉刷新,上拉加载-全栈工程师之路-中级篇
115 0
小程序开发-第三章第二节下拉刷新,上拉加载-全栈工程师之路-中级篇
|
小程序
小程序开发-第二章第六节tabBar详细说明-全栈工程师之路-中级篇
小程序开发-第二章第六节tabBar详细说明-全栈工程师之路-中级篇
166 0
小程序开发-第二章第六节tabBar详细说明-全栈工程师之路-中级篇
|
设计模式 XML 人工智能
太牛了!Android开发高级工程师实战手写框架
导语 又到了金九银十的面试季,自己也不得不参与到这场战役中来,其实是从去年底就开始看,Android的好机会确实不太多,但也还好,3年+的android开发经历还是有一些面试机会的,不过确实不像几年前门槛那么低了,总的体会就是小的创业公司比较注重你的项目经历是否和自己的贴合,直接能过来独当一面。 大厂除了看中项目经历外,还比较注重你知识面的广度,是广度、深度和解决方案等多方面的考察,平时够工作要好好积累临时刷题只聊点皮毛估计是过不了关的。下面就总结一些大厂面试遇到必定会问的知识点,我把网络上讲解的最好的视频给大家整理出来了,各种风格的都有。
太牛了!Android开发高级工程师实战手写框架
|
Web App开发 信息无障碍 UED
【编译】UI设计师必读的13篇文章
【CSDN编译】导读:UI界面的设计目标是能够轻松吸引用户眼球并使之具有实效性。在实现目标方面,它通常被称为用户中心设计。一个好的用户界面设计,便于帮助设专注于网站的建设,而图表设计通常用来增强可用性。
1182 0
|
程序员
【全面解禁!真正的Expression Blend实战开发技巧】第二章 你好,UI设计师
原文:【全面解禁!真正的Expression Blend实战开发技巧】第二章 你好,UI设计师 你好,UI设计师   曾几何时我从没想过要与艺术家打交道,但是Silverlight改变了这一切。UI设计师,已经成为Silverlight项目开发中必不可少的一员。
1279 0