SwiftUI2.0更新内容四

**

Lable

**
同时显示图标以及文字,有点类似于Image+Text
对比一下:

VStack {
            //如果用Text+Image的方式显示
            HStack {
                Image(systemName: "person.crop.circle")
                Text("我是文本+图片")
            }
            Label("我是简单的Label", systemImage: "person.crop.circle")
            Label {
                Text("otherlabel")
                    .foregroundColor(.primary)
                    .background(Color.gray.opacity(0.2))
                    .clipShape(Capsule())
            } icon: {
                Image(systemName: "person.crop.circle")
                    .frame(width: 64, height: 64)
            }

在这里插入图片描述
再加入嵌入List与Section的Lable对比一下

List {
                            Section(header: Text("Drama")) {
                                //...
                                Label("One", systemImage: "film")
                                    .listItemTint(.gray)
                            }
                            Section(header: Text("Comedy")) {
                                Label("Two", systemImage: "film")
                                    //.listItemTint(.gray)
                            }
                                
                        }
                            .listStyle(SidebarListStyle())

在这里插入图片描述
图片与文字的高度差消失了。

**

onChange Modifier

**
非常有用的Modifier,之前为了实现这个功能,挺麻烦的,现在简单了。
这个例子只是为了表明当输入框变化时,可以有这样的操作,并不是说只能通过例子的方式来获取字数,其实直接显示name.count就好了。

@State private var name = ""
    @State private var countOfname = 0
    
    func count() -> Int{
        return name.count
    }

        var body: some View {
            List {
                TextField("你的名字:", text: $name)
                    .padding(EdgeInsets(top: 8, leading: 16, bottom: 8, trailing: 16))
                    .overlay(
                        RoundedRectangle(cornerRadius: 8)
                            .stroke(lineWidth: 2)
                            .foregroundColor(Color(red: 238/255, green: 229/255, blue: 248/255))
                    )
                    
                    .onChange(of: name) { newValue in
                        self.countOfname = self.count()
                }
                Text("字数 : \(countOfname)")
                    
            }
        }
}

在这里插入图片描述

**

Link

**
很简单的访问网络方式

struct LinkTest: View {
    var body: some View {
        Link("苹果SwiftUI学习",
              destination: URL(string: "https://developer.apple.com/tutorials/swiftui")!)
            .font(.title)
            .foregroundColor(.red)
    }
}

在这里插入图片描述

在这里插入图片描述

**

DisclosureGroup

**

很简单,直接上代码

@State private var revealDetails = false

       var body: some View {
           VStack {
               DisclosureGroup("隐藏的秘密", isExpanded: $revealDetails) {
                   Text("药逢气类方成象,道在虚无合自然" + "\n一粒灵丹吞入腹,始知我命不由天。")
               }
               .padding()

               Spacer()
           }
       }
}

在这里插入图片描述

在这里插入图片描述

猜你喜欢

转载自blog.csdn.net/jackwsd/article/details/107158923