iOS开发 SwiftUI 14：ScrollView 滚动视图

很多时候内容确实比屏幕大也不是什么都能用缩放来解决此时能滚动查看就是非常理想的。目录ScrollView滚动条ScrollView我们先写一个超出屏幕宽度的文本Text(Hello, World!aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaA)效果是屏幕上下居中并自动换行放入ScrollView里面ScrollView(.horizontal){ Text(Hello, World!aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaA) }效果仍然上下居中但是没有自动换行。此时可以滚动屏幕来看到超出屏幕宽度的部分注意文本最后一个字符是“A”说明确实看到全部了。再加点超大图片套个竖向ScrollView实现上下左右都能滑动ScrollView(.vertical){ ScrollView(.horizontal){ Text(Hello, World!aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaA) Image(pic1) Image(pic2) } }因为图片非常大会把文字顶到找不到上下左右滑动找找滚动条仔细观察会发现上下滚动会出滚动条左右滚动却不会出滚动条。关闭滚动条ScrollView(.vertical,showsIndicators: false){ ...... }将上面的ScrollView套在Form里并给上下增加一个Textvar body: some View { Form{ Text(a) ScrollView(.vertical,showsIndicators: false){ ScrollView(.horizontal){ Text(Hello, World!aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaA) Image(pic1) Image(pic2) } } Text(b) } }效果并不如我们预期虽然确实显示了Form的框架但仍然是整个屏幕滚动而不是在Form里面滚动而且滚动时横竖滚动条都出现了但是横向滚动条确实是显示在ScrollView里面的。效果后一张横向滚动时并没有观察到横向滚动条。考虑到套了Form我们去掉Form看看效果下面的代码没有套Form并增加了一个独立的横向ScrollViewvar body: some View { Text(a) ScrollView(.horizontal) { Text(Hello, World!aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaA) } ScrollView(.vertical, showsIndicators: false) { ScrollView(.horizontal) { Text( Hello, World!aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaA ) Image(pic1) Image(pic2) } } Text(b) }效果这下效果符合预期两个ScrollView独立滚动仔细观察滚动条发现横向滚动条显示在ScrollView的底部如果进行了纵向滚动滚动条就被滚到下面看不见了这应该是个BUG。至于前面套了Form的问题大概是Form的处理造成的局部小面积滚动也不合理ScrollView之内放Form才合适。