横竖屏布局效果如下:
横竖屏不同布局和约束.gif
在inspector中可以看到Trait Variation取代了之前的sizeclass(关于sizeclass这篇文章不错sizeclass介绍),和sizeclass一样默认选中状态(以下截图都是Xcode8.2环境)
D6D7AEAD-0590-4650-A67E-E64A70E0FBB2.png
用Trait Variations实现横竖屏不同约束
之前sizeclass 的compact,regular,any位置有所改变,如下:
1.png
准备工作##############
在storyBoard上拖入任意view,设置颜色
2.png
1.竖屏
a.先选中竖屏图标(横屏时选中横屏图标)
2385DFA8-EAD6-42EF-B9DE-2BA740E82B45.png
b.点击右侧的Vary for Traits,在弹出的小提示框选择width和height(观察左侧图标横竖屏的变化),竖屏时选中height,width选不选都可以,区域变蓝
c.选中view添加约束,填完后点击"Done Varing"
2.横屏
操作步骤同竖屏,如下:
选中横屏--->点击Vary for Traits--->选择width(height选不选都可以)--->添加约束--->点击Done Varing
4BA68577-C7CC-4E51-84E6-ECDE4C6BC8F8.png
效果如图:
横竖屏不同约束添加.gif
(在我敲这个粗体"竖屏"的时候,发现原来字体是这么调节的,用#号来控制,文字前面一个#应该是最大的字体,#越多字越小#,6个#最小;重启一行才有效果,应该是为标题之类的专门设置的哇,个人总结欢迎指正)
一个井
前六个井的效果
文字划线:前后两个波浪线的效果
斜体:前后三个星号的效果
2BD481AF-EDF8-4963-8A10-2BE88458207E.png
