「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...

相关推荐
大熊猫侯佩4 天前
Xcode 预览新升级:arguments 让界面调试井井有条
swiftui·xcode·swift
大熊猫侯佩5 天前
WWDC26:把 SwiftUI Toolbar 真正握在手心里
swiftui·swift·apple
大熊猫侯佩5 天前
WWDC 26 全新 ResultsObserver:终于能在 View 外面盯着 SwiftData 了
swiftui·swift·apple
东坡肘子6 天前
Apple Intelligence 已通过审核,即将在中国提供服务 -- 肘子的 Swift 周报 #148
人工智能·swiftui·swift
2501_9151063211 天前
SwiftUI项目创建详解:使用Xcode从零开始创建第一个App项目
ide·vscode·ios·swiftui·个人开发·xcode·敏捷流程
东坡肘子13 天前
热茶还是冰咖啡 -- 肘子的 Swift 周报 #147
人工智能·swiftui·swift
2501_9160074717 天前
SwiftUI 声明式语法与 Xcode 预览功能详解
ide·vscode·ios·swiftui·个人开发·xcode·敏捷流程
东坡肘子20 天前
不是模型变慢了,是任务变大了 -- 肘子的 Swift 周报 #146
人工智能·swiftui·swift
Lvan的前端笔记25 天前
SwiftUI:iOS 常用视图组件速查
ios·swiftui·swift
HarderCoder1 个月前
SwiftUI 可复用视图设计解剖:从语义到 API 的完整实践
swiftui·swift