ScrollView的自动布局:如何给ScrollView设置contentSize |
您所在的位置:网站首页 › uiscrollview怎么读 › ScrollView的自动布局:如何给ScrollView设置contentSize |
一、开发环境 XCode11.4,autoLayout。 二、布局目标 如下图,scrollView上面放一个蓝色块和一个绿色块。保持scrollView始终和屏幕等宽高,蓝色和绿色块始终和scrollView等宽,高度随scrollView变化。 二、布局步骤 1、给scrollView添加约束。 相对于view/Safe Area:添加上左下右均为0的约束。 2、对蓝色块添加约束 相对于scrollView:上左右约束均为0。高度为scrollView的0.2倍。 相对于绿色块底部相对绿色块间距20。 注意,一定要点击约束的下拉三角标,选择相对scrollView。 3、给绿色块添加约束。 相对于scrollView:左右约束为0。高度为scrollView的0.3倍。 4、给scrollView设置contentSize。 这是最重要的一步。scrollView的contentSize是由子视图决定的,如何让scrollView有确定的contentSize又保证子视图可以动态宽高。这是最难的部分。 首先:我们要知道autoLayout里面的Content Layout Guide和Frame LayOut Guide是什么东西。 Content Layout Guide:指scrollView的内容区域,相当于scrollView的contentSize。 Frame Layout Guide:指scrollView的边框,相当于scrollView的frame。 所以,要设置scrollView的contentSize,其实就是利用Content Layout Guide和Frame LayOut Guide设置contentSize的宽和高。 对于contentSize的高:其实就是蓝色块和绿色块的高度加上它们的top,bottom。现在高度和top我们都设置好了,就差bottom了。只要让绿色块的bottom与Content Layout Guide的bottom相等就可以确定contentSize的高了。 注意:如果让绿色块的bottom与scrollView的bottom相等并设置一定的constant值也可以确定contentSize的高,但是这样的话这个bottom就写死了。红色块和绿色块无法实现动态高。 对于contentSize的宽:选择其中一个子视图,这里我们选绿色块,相对于Frame LayOut Guide设置左右约束为0即可。 |
今日新闻 |
推荐新闻 |
CopyRight 2018-2019 办公设备维修网 版权所有 豫ICP备15022753号-3 |