xib_storyboard的使用

本文介绍界面构建的四个实用技巧,包括如何在视图中添加辅助线、实现可视化的坐标距离、批量移动视图到父级视图及解决常见的IBOutlet连接问题。

1、为视图添加辅助线

搞设计的一般都知道辅助线是多么重要,我们在为视图布局时也可以为视图添加辅助线,方便我们布局时更加准确

添加:双击某个View,按下shift+Command+-添加横向辅助线,shift+Command+|添加纵向辅助线,添加的位置都是左右/上下居中的

移动:光标移动到线上时会出现可拖动的按钮,按住左右/上下拖动到想要的位置,拖动时可以看到辅助线线距离视图左右/上下的距离

删除:方式也很简单,与删除断点方式一样,快速拖动到视图看不见的地方即可删除

操作示意图8




2、可视化坐标距离

IB最烦人的问题就是对齐。用代码的时候我们可以明确地指定x,y坐标,但是换到IB的时候我们更多的时候是靠拖拽UIView来布局。比如需要三个间隔相同的label,除了用强大的肉眼来估测距离是否相等以外,难道只能乖乖分别选中三个label,记下它们的坐标然后打开计算器来做加减法么?

显然不要那么笨,试试看选中一个label,然后按住option键并将鼠标移动到其他label上试试?你可以发现view之间的距离都以很容易理解的方式显示出来了。不仅是同层次的view,被选中view与其他层次的view之间的距离关系也可以同样显示。

选择之后效果与下文添加辅助线示例图类似


3、将多个view视图合并到一个视图层级

有时候添加了多个控件,而且千辛万苦终于调整好了对齐,间距

操作示意图4

发现要将这些控件放在一个父类视图中方便操作,最直观地,拖动一个view到面板上,选中这些控件,拖拽到这个view上,悲剧就发生了,难道只能再次睁大双眼,一个个对齐,调整么

操作示意图5

显然不用,选中这些控件,选择菜单栏上 Editor->Embed in->View/Scroll view

操作示意图6

最终控件还是按照原来样式排练在一个view上

操作示意图7

同样,要将其从父类view上移到另一个视图,选择上图中Editor->Unembed 就可以了



4、出现问题:Terminating app due to uncaught exception 'NSUnknownKeyException', reason: '[<UIViewController 0x687ef50> setValue:forUndefinedKey:]: this class is not key value coding-compliant for the key datePicker.'

解决方案:


要检查这一问题,可以从两个方面入手。

第一种出错的原因可能是错误的IBOutlet连接,即xib中定义了某个IBOutlet,但是在对应的头文件中,该IBOutlet已经被修改或删除。要检查这一问题,可以打开xib文件,在File's Owner上点击右键,然后在弹出的窗口中检查是否有“惊叹号”提示的IBOutlet连接,基本上可以找到问题所在。

第二种出错的原因可能是在xib文件中没有正确指定对象的类。要检查这一问题,可以打开xib文件,查看自定义视图控制器或者视图的Custom Class是否定义正确即可。

6、xib的使用参见http://www.cnblogs.com/wendingding/p/3750378.html

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值