「SwiftUI」Alert弹窗

IOS Alert弹窗

说明:gif制作会有重影,但代码实际并不会出现此问题,请大家谅解

相应代码

swift 复制代码
@State var isShowAlert:Bool = false
    var body: some View {
        VStack{
            Button {
                self.isShowAlert.toggle()
            } label: {
                Text("ShowAlert")
            }
        }
        .alert(isPresented: self.$isShowAlert) {
            Alert(title: Text("Title"), message: Text("message"))
        }
        
    }
通过使用视图修饰符来创建一个Alert弹窗,该弹窗需要绑定一个Binding类型,当Binding类型为true时,弹窗出现。上面代码设定一个isShowAlert的Binding监听变量,当摁下摁钮时,isShowAlert为true,弹窗出现

Alert默认参数

swift 复制代码
 Alert(title:Text,message:Text?,dismissButton:Alert.Button?) -> Alert
  • Title:弹窗标题
  • message:弹窗内容
  • dismissButton:可能为空的Alert.Button
    ps:message和dismissButton都可以选择使用
    当dismissButton为nil时,默认为"OK"的摁钮

有一个摁钮,并有相应action执行时

相应代码

swift 复制代码
@State var isShowAlert:Bool = false
    var body: some View {
        VStack{
            Button {
                self.isShowAlert.toggle()
            } label: {
                Text("ShowAlert")
            }
        }
.alert(isPresented: self.$isShowAlert) {
            Alert(title: Text("Title"), message: Text("message"), dismissButton:
                        .default(Text("关闭"), action: {
                print("dismissButton Action") //code
            }))
        }
 }

在点击"关闭"按钮时,触发action内容代码,实现print()

Button类型:

  • .default :具有默认样式的警报按钮

  • .cancel :

    • .cancel((() -> Void)?) -> Alert.Button :使用系统提供的标签创建一个指示取消的警报按钮
    • cancel(Text,action:(() -> Void )?) -> Alert.Button : 使用自定义标签创建一个指示取消的警报按钮
  • destructive : 具有指示破坏性操作的样式的警报按钮

两个摁钮,实现各自不同的action指令

相应代码

swift 复制代码
 @State var isShowAlert:Bool = false
    var body: some View {
        VStack{
            Button {
                self.isShowAlert.toggle()
            } label: {
                Text("ShowAlert")
            }
        }
        .alert(isPresented: self.$isShowAlert) {
            Alert(title: Text("Title"), message: Text("message"),
                  primaryButton: .default(
                      Text("Try Again"),
                      action: {
                          print("Try Again")
                      }
                  ),
                  secondaryButton: .destructive(
                      Text("Delete"),
                      action: {
                          print("Delete")
                      }
                  ))
        }
   }

需要添加primaryButton和secondaryButton(均为Alert Button类型),使用方法于dismissButton相同

提醒:该方法在Ios13之后已经弃用,大家各自使用时请注意

Apple开发者文档相应网址:

developer.apple.com/documentati...

相关推荐
Lvan的前端笔记4 天前
SwiftUI:iOS 常用视图组件速查
ios·swiftui·swift
HarderCoder6 天前
SwiftUI 可复用视图设计解剖:从语义到 API 的完整实践
swiftui·swift
东坡肘子6 天前
当灵感跑在了结果前面 -- 肘子的 Swift 周报 #145
人工智能·swiftui·swift
霍霍哈嗨11 天前
swiftUI框架基础
ios·swiftui·swift
东坡肘子13 天前
当每一次写入都有了新价格 -- 肘子的 Swift 周报 #144
人工智能·swiftui·swift
CHB19 天前
uni-app x 蒸汽模式 iOS版 性能测试基准报告 Benchmark
ios·uni-app·swiftui
大熊猫侯佩19 天前
SwiftUI 侦探笔记:iPhone 14 失踪的“刘海”与侯佩的像素诡计
swiftui·swift·apple
大熊猫侯佩19 天前
WWDC26 新 @ContentBuilder 修饰符:SwiftUI 终于有了户口本
swiftui·swift·wwdc
东坡肘子20 天前
当 Linux 成为“空气”:容器、Agent 与不再重要的“桌面之争” -- 肘子的 Swift 周报 #143
人工智能·swiftui·swift
东坡肘子1 个月前
SPI 加入 Apple,Swift 迈向自举 -- 肘子的 Swift 周报 #142
人工智能·swiftui·swift