SwiftUI 实战之带文本框TextField的Alert组件解决中文问题(教程含源码)

实战需求

Alert是iOS中最基础组件,很多时候我们需要通过Alert来收集数据,那么如何将TextField放入到Alert中呢?

本文价值与收获

看完本文后,您将能够作出下面的界面

文本框TextField的Alert组件

文本框TextField的Alert组件

看完本文您将掌握的技能

  • Alert组件高级使用
  • 解决TextField

代码

1、主界面

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
import SwiftUI

struct ContentView: View {
    @State var showAlert = false
    @State var text = ""
    var body: some View {
        NavigationView{
            VStack{
                Text("SwiftUI Alert With Text")
                    .padding(.all, 10)
                Text("输入的内容:\(self.text)")
             
            }
            .navigationBarItems(
                 trailing:  Button(action: {
                    //action add
                    withAnimation {
                        self.showAlert.toggle()
                    }
                   
                }, label: {
                    Image(systemName: "plus.square.fill")
                        .font(.system(size: 30))
                })
        )
        }
        .alert(isPresented: $showAlert, TextAlert(title: "请添加内容",placeholder: "请输入", action: {
            if let name = $0 {
                self.text = name
            }
        }))
    }
}

2、封装好的Alert组件