SwiftUI:如何使用多个 Sheet

当我们在工作中,总会遇到弹出多个Sheet的情况。弹出一两个的情况下,我们可以使用绑定Boolean变量来完成。但是如果有很多种情况,会弹出很多种不同的Sheet我们该如何了来做呢?这就是我们今天要解决的问题

绑定 Bool 值的方法

SwiftUI 复制代码
.sheet(isPresented: <#T##Binding<Bool>#>, content: <#T##() -> View#>)

这种方法当我们有多个sheet要弹出时,就很麻烦。所以我们建议使用下面方法来完成sheet的弹出,它具有更好的扩展性。

绑定Item方法

SwiftUI 复制代码
.sheet(
item: <#T##Binding<Identifiable?>#>, 
content: <#T##(Identifiable) -> View#>)

它需要一个实现了 Identifiable 协议的 Binding 值。

我们用一个 Model 来承载显示的内容,让model实现 Identifiable 协议。

model 如下:

SwiftUI 复制代码
struct ItemModel: Identifiable {
    let id = UUID().uuidString
    let title: String
}

在使用sheet的地方写上如下代码:

SwiftUI 复制代码
.sheet(item: $selectItemModel) { itemModel in
  NextScreenView(itemModel: itemModel)
}

当你点击某个控件时,我们需要改变 selectItemModel 的值。

SwiftUI 复制代码
Button("BUTTON (index)") {
  selectItemModel = ItemModel(title: "(index)")
}

这样就是可以实现多个sheet弹出的效果。


以下是全部代码

SwiftUI 复制代码
// multiple sheets
struct ItemModel: Identifiable {
    let id = UUID().uuidString
    let title: String
}

struct MultipleSheetsSample: View {
    @State var selectItemModel: ItemModel? = nil
    
    var body: some View {
        ScrollView {
            VStack(spacing: 20) {
                ForEach(0..<20) { index in
                    Button("BUTTON (index)") {
                        selectItemModel = ItemModel(title: "(index)")
                    }
                }
            }
            .sheet(item: $selectItemModel) { itemModel in
                NextScreenView(itemModel: itemModel)
            }
        }
    }
}

struct NextScreenView: View {
    let itemModel: ItemModel
    var body: some View {
        Text(itemModel.title)
            .font(.largeTitle)
    }
}

大家有什么看法呢?欢迎留言讨论。

公众号:RobotPBQ

相关推荐
Frank学习路上7 小时前
【IOS】XCode创建firstapp并运行(成为IOS开发者)
开发语言·学习·ios·cocoa·xcode
瓜子三百克14 小时前
CALayer的异步处理
macos·ios·cocoa
吴Wu涛涛涛涛涛Tao14 小时前
一步到位:用 Very Good CLI × Bloc × go_router 打好 Flutter 工程地基
flutter·ios
杂雾无尘17 小时前
开发者必看:如何在 iOS 应用中完美实现动态自定义字体!
ios·swift·apple
kymjs张涛19 小时前
零一开源|前沿技术周报 #6
前端·ios·harmonyos
与火星的孩子对话1 天前
Unity进阶课程【六】Android、ios、Pad 终端设备打包局域网IP调试、USB调试、性能检测、控制台打印日志等、C#
android·unity·ios·c#·ip
恋猫de小郭2 天前
Flutter Widget Preview 功能已合并到 master,提前在体验毛坯的预览支持
android·flutter·ios
点金石游戏出海3 天前
每周资讯 | Krafton斥资750亿日元收购日本动画公司ADK;《崩坏:星穹铁道》新版本首日登顶iOS畅销榜
游戏·ios·业界资讯·apple·崩坏星穹铁道
旷世奇才李先生3 天前
Swift 安装使用教程
开发语言·ios·swift
90后的晨仔3 天前
Xcode16报错: SDK does not contain 'libarclite' at the path '/Applicati
ios