【知识总结】sizeclass使用

作者: 小子爱搞事 | 来源:发表于2016-05-11 00:16 被阅读84次

作用:

1,仅仅对屏幕进行分类,真正排布UI元素还得使用autolayout;
2,不再有横竖屏的概念,只有屏幕尺寸的概念;
3,不再有具体尺寸的概念,只有抽象尺寸的概念。

属性介绍:

把宽度和高度分为3中情况:
1,Compact:紧凑(小)
2,Any:任意
3,Regular: 宽松(大)

屏幕快照 2015-10-12 下午10.39.37.png
 符号代表:
                -:Compact
                *:Any
                +:Regular
 继承性:
                * * :能被其他8种情况继承
                * - :能被 + - \  - - 继承
                + *:能被 + - \ + + 集成
                以此类推。

使用:

1,需求

一个控件(比如switch)在不同的屏幕尺寸的情况下,现在在不同的位置。

2,实现

拖入一个switch

拖入switch控件.png

在右边的工具栏第三项中,勾选 Installed,说明可以显示

勾选Installed显示.png

通过点击 “ + ”按钮添加显示的情况

添加需要显示的屏幕情况.png
例如:

只勾选了如图所示的情况

勾选的为需要显示的屏幕.png

那么switch控件只有在对应的屏幕下才可以显示,其他屏幕下是看不见的


可显示的情况.png

不同屏幕下实现不同的autolayout约束

如果想要设置不同屏幕下的自动布局,就可以通过例子中的方法,切换到不同的屏幕下,通过autoLayout设置对应的约束

########例如
添加不同的Installed,选择不同的屏幕,进行布局

wCompapct hCompact屏幕下设置约束.png

添加约束:

添加约束.png

观察运行结果:

竖屏情况.png 横屏情况.png

最后,介绍一下如何查看不同屏幕下的显示情况

查看步骤

添加需要查看的屏幕尺寸

添加不同尺寸的屏幕

相关文章

网友评论

  • 舒大福:请问 对应的屏幕是指的哪一个呢?
    小子爱搞事:@舒大福 多用就知道了。我也只会一些
    舒大福:@小子爱搞事 谢谢回复,但是对于布局这一方面感觉还是太深奥了。:disappointed_relieved::disappointed_relieved::disappointed_relieved:
    小子爱搞事:@舒大福 你看文中的第一张图片,那里可以选择你通过 “ + ”添加的对应屏幕

本文标题:【知识总结】sizeclass使用

本文链接:https://www.haomeiwen.com/subject/hcgyrttx.html