SwiftUI—创建一个水平方向上的滚动视图

简介: SwiftUI—创建一个水平方向上的滚动视图

本节课继续演示ScrollView滚动视图的使用,您将创建一个水平方向上的滚动视图。


示例代码:


struct ContentView : View {
    var body: some View {
            ScrollView(.horizontal, showsIndicators: true) {
                HStack(alignment:.center, spacing: 20){
                    Image("iPhone")
                        .resizable()
                        .frame(width: 300, height: 556, alignment: .center)
                    Image("iPhoneSerial")
                        .resizable()
                        .frame(width: 823, height: 556, alignment: .center)
                    Image("iPhone")
                        .resizable()
                        .frame(width: 300, height: 556, alignment: .center)
                }
            }
            .background(Color.orange)
            .padding(10)
        }
    }


2466108-9687561165edf993.webp.jpg


目录
相关文章
|
4月前
|
前端开发 JavaScript 开发者
告别居中难题!揭秘未知宽高元素如何轻松实现水平和垂直居中的神奇技巧!
【8月更文挑战第23天】本文介绍了在Web前端开发中实现未知宽度和高度元素的水平垂直居中的四种方法:使用Flexbox布局、Grid布局、绝对定位结合transform属性以及利用负margin。每种方法均提供了示例代码,帮助开发者根据不同场景和兼容性需求选择最合适的解决方案,从而轻松应对各种居中布局需求。
39 1
|
iOS开发
iOS开发 - 渐变导航条升级版(判断滚动的方向和改变方向时的位置)
iOS开发 - 渐变导航条升级版(判断滚动的方向和改变方向时的位置)
143 0
iOS开发 - 渐变导航条升级版(判断滚动的方向和改变方向时的位置)
|
编解码 前端开发 UED
每日一学—设置页面文字大小随屏幕大小变化而变化(rem布局)
每日学一点加强技术水平,夯实基础。 阅读这篇文章,一起学习rem布局吧。
418 0
每日一学—设置页面文字大小随屏幕大小变化而变化(rem布局)
实现RecycleView横向、竖向无限循坏(基于自定义RecyclerView.LayoutManager)
实现RecycleView横向、竖向无限循坏(基于自定义RecyclerView.LayoutManager)
376 0
|
前端开发 容器
web前端学习(二十五)——CSS3布局(水平 & 垂直对齐)的相关设置
web前端学习(二十五)——CSS3布局(水平 & 垂直对齐)的相关设置
web前端学习(二十五)——CSS3布局(水平 & 垂直对齐)的相关设置
SwiftUI—使用HStack在水平方向排列视图
SwiftUI—使用HStack在水平方向排列视图
648 0
SwiftUI—使用HStack在水平方向排列视图
SwiftUI—使用VStack在垂直方向排列视图
SwiftUI—使用VStack在垂直方向排列视图
169 0
SwiftUI—使用VStack在垂直方向排列视图
SwiftUI—使用ZStack在深度方向排列视图
SwiftUI—使用ZStack在深度方向排列视图
210 0
SwiftUI—使用ZStack在深度方向排列视图
|
Android开发 Java 数据格式