Storyboard 自动布局

最新推荐文章于 2021-05-27 14:31:56 发布

twttt

最新推荐文章于 2021-05-27 14:31:56 发布

阅读量273

点赞数

版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。

本文链接：https://blog.csdn.net/twttt/article/details/51100440

版权

首先在 storyboard中将 size class 设置为宽与高均为any ,这样的话能适配所有的机型.

屏幕快照 2016-03-19 下午11.13.11.png - ###****

- 1. >1设定VIew为固定大小并居中显示.或是以屏幕居中点进行偏移.``

选中要操作的view 屏幕快照 2016-03-19 下午11.23.09.png

点击右下方的pin图标屏幕快照 2016-03-19 下午11.23.28.png 弹出如下的菜单项并将width 与 Height 勾选 .如下图所示 .设置宽与高这样view的大小就确定了屏幕快照 2016-03-19 下午11.23.53.png

下一步是让其居中显示按下右下边的Align键,如下图所示屏幕快照 2016-03-19 下午11.27.18.png 并勾选最下方的 Horizontally in Container 和Vertically in Container 右边的为居的值当为0 0 时为屏幕正中. 当为正数时将向下进行偏移.负的话向上偏移.自己可以试一试屏幕快照 2016-03-19 下午11.27.33.png

当出现黄线的时候证明有约束.需要进行刷新新的位置. 需要刷新frame 屏幕快照 2016-03-19 下午11.33.12.png

最终如图所示屏幕快照 2016-03-19 下午11.34.07.png

模拟器运行后为

坚屏屏幕快照 2016-03-19 下午11.35.53.png

横屏

屏幕快照 2016-03-19 下午11.36.04.png

这样居中显示固定大小就完成了.

2 与屏幕的宽高等比例VIew制做

和第1条一样 ,我们先做个居中的视图但不弄pin的大小

屏幕快照 2016-03-19 下午11.45.50.png

按着control键托动子View到父视View上弹出如下窗口屏幕快照 2016-03-19 下午11.46.14.png

色选等宽与等高屏幕快照 2016-03-19 下午11.46.36.png

如图所示

屏幕快照 2016-03-19 下午11.46.45.png

找到右边的 Show the inspector 屏幕快照 2016-03-19 下午11.50.02.png

勾选设比例为1:4 屏幕快照 2016-03-19 下午11.50.19.png

屏幕快照 2016-03-19 下午11.50.48.png

最终结果为屏幕快照 2016-03-19 下午11.51.22.png

模拟器运行为

屏幕快照 2016-03-19 下午11.53.58.png

屏幕快照 2016-03-19 下午11.54.12.png

第三种自适应横坚屏textfield拉伸

屏幕快照 2016-03-24 下午9.38.44.png

屏幕快照 2016-03-24 下午9.39.39.png

屏幕快照 2016-03-24 下午9.40.43.png

最终效果如下图所示

屏幕快照 2016-03-24 下午9.47.03.png

屏幕快照 2016-03-24 下午9.47.12.png

评论

被折叠的条评论为什么被折叠?

到【灌水乐园】发言

查看更多评论

添加红包

成就一亿技术人!

hope_wisdom

发出的红包

实付元

使用余额支付

点击重新获取

扫码支付

钱包余额 0

抵扣说明：

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