美文网首页
SwiftUI-HStack

SwiftUI-HStack

作者: 普通上班族老王 | 来源:发表于2019-12-08 12:00 被阅读0次

    前言

    个人学习 SwiftUI 的记录,如有错误,请指教哈!

    HStack

    横向布局, 就字面意思, 用来包裹其他 View, 从左到右的横向布局

    先上效果图

    在这里插入图片描述

    代码

    
    import SwiftUI
    
    struct XQHStackView: View {
        var body: some View {
            VStack {
                
                // 横向布局
                // alignment: 布局对齐格式, 默认为 .center
                // spacing: 子 View 的间距, 系统默认为 8
                HStack.init(alignment: .bottom, spacing: 20) {
                    Text("我是第一个Lab\nasdasd\nasdas")
                    Text("我是第二个Lab")
                }
                .padding()
                .background(Color.orange)
                .cornerRadius(20)
                .shadow(radius: 10)
                
                HStack {
                    Text("我是第一个Lab\nasdasd\nasdas")
                    Text("我是第二个Lab")
                }
                .padding()
                .background(Color.orange)
                .cornerRadius(20)
                .shadow(radius: 10)
                .padding(.top, 10)
                
                HStack {
                    Text("我在左边")
                    // 如何把 View 分到 左右两边呢
                    // 增加 Spacer()
                    Spacer()
                    Text("我在右边")
                }
                .padding()
                .background(Color.orange)
                .cornerRadius(20)
                .shadow(radius: 10)
                .padding(.top, 10)
                
            }
        }
    }
    
    

    相关文章

      网友评论

          本文标题:SwiftUI-HStack

          本文链接:https://www.haomeiwen.com/subject/tukmgctx.html