在SwiftUI中顯示模態視圖
簡介
這里教大家如何彈出一個簡單的模態視圖,分別有兩個頁面,ContentView和GCPresentedView,以下對應簡稱為A和B,我們要做的是在A視圖中點擊按鈕跳轉到B視圖,然后再從B視圖點擊按鈕回傳到A視圖,
步驟
在A視圖中創建按鈕和模態視圖代碼
struct ContentView: View {
@State var isPresented = false
var body: some View {
Button(action: {
self.isPresented = true
}, label: {
Text("Present Modally")
})
.sheet(isPresented: $isPresented) {
GCPresentedView()
}
}
}
使用@State對屬性進行修飾,在 SwiftUI 內部會自動轉換為一對getter,setter,對這個屬性進行賦值時會觸發視圖更新,
$isPresented能夠將值參考(參考方法是在值前方加一個$符號),當參考的值發生改變時,這個改變會向外傳遞,
.sheet方法用于彈出一個模態視圖,在SwiftUI中的定義為,
public func sheet<Content>(isPresented: Binding<Bool>, onDismiss: (() -> Void)? = nil, @ViewBuilder content: @escaping () -> Content) -> some View where Content : View
在B視圖中創建按鈕和關閉模態視圖代碼
struct GCPresentedView: View {
@Environment(\.presentationMode) var mode
var body: some View {
Button(action: {
self.mode.wrappedValue.dismiss()
}, label: {
Text("Dismiss")
})
}
}
@Environment獲取環境變數presentationMode,我們可以通過這個變數呼叫wrappedValue.dismiss()可以關閉模態視圖,
直接在 Xcode 運行預覽

總結
使用 SwiftUI 框架處理界面方便很多,不用太多的定義,我們只需要將界面進行描述出來就可以了,這個教程示例中使用到了 Button 和 Text 控制元件,也用到了@State, Binding, @Environment 技術點,教程很簡單,放上來大家一起學習,教程里的代碼已放在了GitHub上面,點擊這里獲取代碼,
宣告
博文作者:GarveyCalvin
博文出處:http://www.cnblogs.com/GarveyCalvin/
本文著作權歸作者和博客園共有,歡迎轉載,但須保留此段宣告,并給出原文鏈接,謝謝合作!
轉載請註明出處,本文鏈接:https://www.uj5u.com/yidong/5596.html
標籤:iOS
上一篇:iOS編程實戰 — 新的UI范式
