SwiftUI:如何更改 NavigationView.toolbar 背景颜色
SwiftUI: how to change NavigationView.toolbar background color
知道如何将特定背景颜色应用到底部工具栏吗?
NavigationView {
List {
....
}
.toolbar {
ToolbarItem(placement: .bottomBar) {
Button(action: { model.selectTab(tab: "ITEM1") }, label: { Text("ITEM1") })
}
ToolbarItem(placement: .bottomBar) {
Button(action: { model.selectTab(tab: "ITEM2") }, label: { Text("ITEM2") })
}
ToolbarItem(placement: .bottomBar) {
Button(action: { model.selectTab(tab: "ITEM3") }, label: { Text("ITEM3") })
}
}
}
您可以使用 UIToolbar
外观来做到这一点。测试 Xcode 12 / iOS 14.
struct DemoView: View {
init() {
UIToolbar.appearance().barTintColor = UIColor.red
}
var body: some View {
NavigationView {
List {
Text("Item")
}
.toolbar {
ToolbarItem(placement: .bottomBar) {
Button(action: { }, label: {Text("ITEM1")})
}
ToolbarItem(placement: .bottomBar) {
Button(action: { }, label: {Text("ITEM2")})
}
ToolbarItem(placement: .bottomBar) {
Button(action: { }, label: {Text("ITEM3")})
}
}
}
}
}
下面的代码对我不起作用:
init() {
UIToolbar.appearance().barTintColor = UIColor.red
}
此代码有效:
init() {
let coloredAppearance = UINavigationBarAppearance()
coloredAppearance.configureWithOpaqueBackground()
coloredAppearance.backgroundColor = .systemRed
coloredAppearance.titleTextAttributes = [.foregroundColor: UIColor.white]
coloredAppearance.largeTitleTextAttributes = [.foregroundColor: UIColor.white]
UINavigationBar.appearance().standardAppearance = coloredAppearance
UINavigationBar.appearance().compactAppearance = coloredAppearance
UINavigationBar.appearance().scrollEdgeAppearance = coloredAppearance
UINavigationBar.appearance().tintColor = .white
}
知道如何将特定背景颜色应用到底部工具栏吗?
NavigationView {
List {
....
}
.toolbar {
ToolbarItem(placement: .bottomBar) {
Button(action: { model.selectTab(tab: "ITEM1") }, label: { Text("ITEM1") })
}
ToolbarItem(placement: .bottomBar) {
Button(action: { model.selectTab(tab: "ITEM2") }, label: { Text("ITEM2") })
}
ToolbarItem(placement: .bottomBar) {
Button(action: { model.selectTab(tab: "ITEM3") }, label: { Text("ITEM3") })
}
}
}
您可以使用 UIToolbar
外观来做到这一点。测试 Xcode 12 / iOS 14.
struct DemoView: View {
init() {
UIToolbar.appearance().barTintColor = UIColor.red
}
var body: some View {
NavigationView {
List {
Text("Item")
}
.toolbar {
ToolbarItem(placement: .bottomBar) {
Button(action: { }, label: {Text("ITEM1")})
}
ToolbarItem(placement: .bottomBar) {
Button(action: { }, label: {Text("ITEM2")})
}
ToolbarItem(placement: .bottomBar) {
Button(action: { }, label: {Text("ITEM3")})
}
}
}
}
}
下面的代码对我不起作用:
init() {
UIToolbar.appearance().barTintColor = UIColor.red
}
此代码有效:
init() {
let coloredAppearance = UINavigationBarAppearance()
coloredAppearance.configureWithOpaqueBackground()
coloredAppearance.backgroundColor = .systemRed
coloredAppearance.titleTextAttributes = [.foregroundColor: UIColor.white]
coloredAppearance.largeTitleTextAttributes = [.foregroundColor: UIColor.white]
UINavigationBar.appearance().standardAppearance = coloredAppearance
UINavigationBar.appearance().compactAppearance = coloredAppearance
UINavigationBar.appearance().scrollEdgeAppearance = coloredAppearance
UINavigationBar.appearance().tintColor = .white
}