Xib和StoryBoard对比

  • 共同点:
  1. 都是用来描述软件界面
  1. 都用Interface Builder工具来编辑
  2. 本质都是转换成代码去创建控件
  • 不同点:
  • Xib是轻量级的,用来描述局部 UI界面
    Xib和StoryBoard对比_第1张图片
    1M1`2[YI)IWQ5R4IL]~GUS6.jpg
    Xib文件通过里边部件的下标来添加元素。创建Xib
    Xib和StoryBoard对比_第2张图片
    IM(W)(M_S2B}AFH1NFE6N9V.png
    选择View出来的直接是一个view界面,选择Empty,可以自定义
  • StoryBoard是重量级的,用来描述整个软件的多个界面,并且能展示多个界面之间的跳转关系。

*为视图添加辅助线

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

  1. 添加:双击某个View,按下shift+Command+-添加横向辅助线,shift+Command+|添加纵向辅助线,添加的位置都是左右/上下居中的
    移动:光标移动到线上时会出现可拖动的按钮,按住左右/上下拖动到想要的位置,拖动时可以看到辅助线线距离视图左右/上下的距离
    删除:方式也很简单,与删除断点方式一样,快速拖动到视图看不见的地方即可删除
    Xib和StoryBoard对比_第3张图片
    屏幕快照 2016-06-17 下午10.08.38.png
  2. 当添加辅助线之后,除了查看方便外,还具有吸附功能,当新添加的小控件靠近辅助线后,会自动和辅助线对齐

选中一个控件,按住Alt键,直接使用鼠标去触碰目标控件,即可知道兄弟视图之间的距离

如果视图层次很多,最直接的方法是在左侧目录中直接查看,


Xib和StoryBoard对比_第4张图片
屏幕快照 2016-06-17 下午10.09.16.png

也可选中目标控件,按住shift,右击便可查看该控件的层次关系.


Xib和StoryBoard对比_第5张图片
屏幕快照 2016-06-17 下午10.10.07.png

选中一个控件通过Alt键可以复制产生一个全新的控件.

在Xcode中如果可视化操作出现下图两个页面的情况

Xib和StoryBoard对比_第6张图片
B9B71044-E128-4CA5-87B8-83B681C81607.png

是通过点击双环产生的效果,
屏幕快照 2016-06-17 下午7.45.30.png

可以点右上角的叉号直接退出代码页面,也可按快捷键 com+回车退出上图红色箭头指向页面
对于上图关联的属性,关联后,如果删除代码,程序运行报错;如果保留关联的代码,删除可视化控件中的对应项,除了此控件不显示外,其余没影响.

每个的详细介绍可以参考这里

你可能感兴趣的:(Xib和StoryBoard对比)