[SwiftUI 100 天] 用 ActionSheet 显示多个选项


译自 www.hackingwithswift.com/books/ios-s…
更多内容,欢迎重视大众号 「Swift花园」
喜爱文章?不如来个 ➕三连?重视专栏,重视我

SwiftUI 供给了 Alert ,用以呈现重要通知,能够支持一到两个按钮,而 sd o e 7 Q t @ 1 Mheet() 则是在当时视图之上展现新视图,此外咱们还有 ActionSheet:它是 Alert 的替代品,能够让咱们增加更多按钮。

视觉上 alerts 和 action sheets 不同很大:在 iPhones,alertE @ w 4 e $ 是出现在屏幕中央,而且有必要经过选择一个按钮封闭,而 action sheets 是从底部滑出,包含多个按q : 8 W F – 5 {钮,即能够经过点击 Cancel 封w W O . D L (闭,也能够点击 action sheet 以外的区域封闭。

除了呈现的外观和按钮数目的差异,action sheets 和 alerts 同享许多相同的功能。两者i z Z n H &都是凭借 modifier 附加到视图层级 —— alert 用 alert(),而 action sh– C 1 e V v 9eet 用 actionSheet() —— 两者都是在某个条件成立时由 SwiftUI 自动显现,两者都运用同类的按钮,两者都有一些: B | o 9 ;内建的默认按钮款式:default()cancel()destructi= ? r d Pve()

为了阐明 action sheets 的用法,咱们首先需求一个基础的视图,用来触发某种条件。例如,先显现某个文本,点击文本时改动一个布尔值:

struct ContentView: V4 d u T Q O Z eiew {
@State private var showingActionSheet = false
@State private var backgy i [roundColor = k l # O y ` 7 Color.white
var body: some View {
Text("Hello, World!")
.frame(width: 300, height: 300)
.background* A v(backgroundColor)
.onTapGesture {
self.showingActionSheet =U G ? W b p + & true
}
}
}

然后是重要的部分:咱们需求再增加一个 modifier 到文本视图6 9 ! A ~ s d 8 @,创立并C z ^ ~ l 7 L显现 action sheet。

alert() 一样,actionSheet() modifier 接纳两个参数:一个决议当时是否显现 action sheet,一个是供给要显现的 action sheet 的闭包 —— 通常以拖尾闭包的方式供给。

咱们要给 action, / w 9 8 M % sheet 设置一个标题和一个音讯,然后是数组按钮。这些按钮会以你供给它们的次序竖向地排列,通常咱们会把取消按钮放在最终 —– s — 是的,你能够经过点击屏幕其他地方来封闭,但最好仍是给用户保留一个显式的选项。

把这个 mod{ h f T mifier 增加到你的文本视图:

.actionSheet(isPresented: $showA / H y e _ ` WingActionSheet) {
ActionSheet(titl9 G S 7e: Text("Change background"), message: Text("Select a new color"), buttons: [
.default(Text("Red")) { self8 R K ? N I.backgroundColor = .red },
.default_ ^ p d 3 U { I(Text("Greh _ L `en")) { self.backgroundColor = .green },
.default(Text("Blue")) { self.backgroundColor = .blue },
.cancev E - Cl()
])
}

运行使用,你应该会发现,点击文本会触发 action sheet 滑入,点击它的按钮选项则导致文本背景色改变。


我的大众号 这里有Swift及计算机r t Y ! p n编程的相关文章,以及优异国外文章翻译,欢迎重视~

[SwiftUI 100 天] 用 ActionSheet 显示多个选项

发表评论

提供最优质的资源集合

立即查看 了解详情