SwiftUI—通过Button打开一个模态窗口

简介: SwiftUI—通过Button打开一个模态窗口

当点击按钮时,使用按钮控件的sheet方法,弹出Modal模态窗口。


示例代码:


struct ContentView : View {
    @State var isPresented = false //决定模态窗口的显示和隐藏
    var body: some View {
        VStack{
            Button("Show modal") { //设置按钮标题文字
                self.isPresented = true //当按钮被点击时,设置布尔属性的值为真
            }.sheet(isPresented: $isPresented, content: { //调用Button控件的sheet方法,并设置isPresented的值为当前的布尔属性。当属性的值为真时,显示sheet中的内容
                MyDetailView(message: "Modal window") //将自定义视图作为按钮控件的sheet内容
            })
        }
    }
}
struct MyDetailView: View { //定义一个遵守View协议的指定名称的结构体,作为一个新的自定义视图。结构体相对于类来说更加轻量,所以SwiftUI使用结构体来定义视觉控件
    let message: String
    var body: some View { //实现View协议中必须要实现的body属性,所有自定义视图中的元素都需要放在body中
        VStack {
            Text(message)
                .font(.largeTitle)
        }
    }
}


2466108-562c55cd23c7fcb8.webp.jpg


注:模态窗口与非模态窗口的区别

目录
相关文章
|
8月前
|
JavaScript
dialog打开时重新渲染
dialog打开时重新渲染
107 0
|
5月前
【Qt 学习笔记】Qt常用控件 | 按钮类控件 | Radio Button的使用及说明
【Qt 学习笔记】Qt常用控件 | 按钮类控件 | Radio Button的使用及说明
840 1
|
5月前
【Qt 学习笔记】Qt常用控件 | 按钮类控件 | Push Button的使用及说明
【Qt 学习笔记】Qt常用控件 | 按钮类控件 | Push Button的使用及说明
217 0
【Qt 学习笔记】Qt常用控件 | 按钮类控件 | Push Button的使用及说明
|
JavaScript
原生js实现鼠标长按事件
原生js实现鼠标长按事件
163 0
element-ui框架的el-dialog弹出框被遮罩层挡住了
element-ui框架的el-dialog弹出框被遮罩层挡住了
355 0
element-ui框架的el-dialog弹出框被遮罩层挡住了
|
iOS开发
SwiftUI极简教程08: Button按钮的使用
SwiftUI极简教程08: Button按钮的使用
1347 0
SwiftUI极简教程08: Button按钮的使用
SwiftUI极简教程23:创建一个简单的SearchBar搜索栏
SwiftUI极简教程23:创建一个简单的SearchBar搜索栏
704 0
SwiftUI极简教程23:创建一个简单的SearchBar搜索栏
SwiftUI—Button按钮控件的使用
SwiftUI—Button按钮控件的使用
527 0
SwiftUI—Button按钮控件的使用
SwiftUI—如何快速打开一个模态窗口
SwiftUI—如何快速打开一个模态窗口
459 0
SwiftUI—如何快速打开一个模态窗口
|
数据可视化
UGUI系列-Button绑定事件的多种实现
今天分享一下UGUI Button绑定事件的几种方法,以及优点和缺点 有哪些地方不懂的小伙伴也可以联系我的QQ,我的QQ就在博客链接中隐藏着,看能不能找到咯