SwiftUI—使用HStack在水平方向排列视图

简介: SwiftUI—使用HStack在水平方向排列视图

HStack视图可以使其子视图,在水平方向上等距排列。


示例代码:


struct ContentView : View {
    var body: some View {
        HStack(alignment: .bottom, spacing: 40){ //设置水平排列的对齐方式为底部对齐,所有的子视图在HStack里,按照他们的底部边缘进行对齐。设置子视图的水平距离为40
            Image(systemName: "book.fill")
            Text("Interactive Tutorials")
            Spacer() //它的作用是自动调整自身的宽度,以使VStack里的所有子视图,在水平方向上撑满整个屏幕
            Image(systemName: "icloud.and.arrow.down") //在空格视图的右侧,添加另一个图像视图。这样空格视图,将其它的子视图分成左右两侧。空格视图的宽度根据屏幕尺寸的不同,会进行自动的调整。
        }
        .padding()
    }
}


2466108-9d74b7961ef9eaae.webp.jpg


目录
相关文章
SwiftUI—使用VStack在垂直方向排列视图
SwiftUI—使用VStack在垂直方向排列视图
174 0
SwiftUI—使用VStack在垂直方向排列视图
SwiftUI—使用ZStack在深度方向排列视图
SwiftUI—使用ZStack在深度方向排列视图
218 0
SwiftUI—使用ZStack在深度方向排列视图
SwiftUI—创建一个水平方向上的滚动视图
SwiftUI—创建一个水平方向上的滚动视图
215 0
SwiftUI—创建一个水平方向上的滚动视图
|
数据可视化 Android开发 容器
【约束布局】ConstraintLayout 引导线 Guideline 约束 ( 简介 | 可视化操作 | 属性 | 水平引导线 | 垂直引导线 | 开始结束尺寸 | 百分比位置 | 约束组件 )(一)
【约束布局】ConstraintLayout 引导线 Guideline 约束 ( 简介 | 可视化操作 | 属性 | 水平引导线 | 垂直引导线 | 开始结束尺寸 | 百分比位置 | 约束组件 )(一)
818 0
【约束布局】ConstraintLayout 引导线 Guideline 约束 ( 简介 | 可视化操作 | 属性 | 水平引导线 | 垂直引导线 | 开始结束尺寸 | 百分比位置 | 约束组件 )(一)
|
数据可视化
【约束布局】ConstraintLayout 引导线 Guideline 约束 ( 简介 | 可视化操作 | 属性 | 水平引导线 | 垂直引导线 | 开始结束尺寸 | 百分比位置 | 约束组件 )(二)
【约束布局】ConstraintLayout 引导线 Guideline 约束 ( 简介 | 可视化操作 | 属性 | 水平引导线 | 垂直引导线 | 开始结束尺寸 | 百分比位置 | 约束组件 )(二)
620 0
【约束布局】ConstraintLayout 引导线 Guideline 约束 ( 简介 | 可视化操作 | 属性 | 水平引导线 | 垂直引导线 | 开始结束尺寸 | 百分比位置 | 约束组件 )(二)
|
iOS开发
SwiftUI极简教程34:LazyVGrid垂直网格和LazyHGrid水平网格的使用
SwiftUI极简教程34:LazyVGrid垂直网格和LazyHGrid水平网格的使用
1811 0
SwiftUI极简教程34:LazyVGrid垂直网格和LazyHGrid水平网格的使用
|
算法 索引
一种求任意多边形内部水平方向似最大矩形的算法
文章版权由作者李晓晖和博客园共有,若转载请于明显处标明出处:http://www.cnblogs.com/naaoveGIS/ 1.背景        在前一篇中,我们探讨了如何求凸多边形中的似最大圆,但是针对实际情况需求,我们并没有完全解决问题。
3008 0
|
自然语言处理 iOS开发
SwiftUI极简教程03:VStack, HStack, ZStack视图排列的使用(上)
SwiftUI极简教程03:VStack, HStack, ZStack视图排列的使用(上)
1519 0
SwiftUI极简教程03:VStack, HStack, ZStack视图排列的使用(上)
SwiftUI极简教程04:VStack, HStack, ZStack视图排列的使用(下)
SwiftUI极简教程04:VStack, HStack, ZStack视图排列的使用(下)
727 1
SwiftUI极简教程04:VStack, HStack, ZStack视图排列的使用(下)

热门文章

最新文章