iOS 16中如何用SwiftUI修改底部工具栏背景？

自iOS 16起，我们可以通过以下代码轻松自定义导航栏背景，且运行正常：

.toolbarBackground(barBackgroundGradient, for: .navigationBar)
.toolbarBackground(.visible, for: .navigationBar)

但尝试用类似代码修改底部工具栏背景时，代码可编译但应用中无变化：

.toolbarBackground(barBackgroundGradient, for: .bottomBar)
.toolbarBackground(.visible, for: .bottomBar)

也曾尝试同时指定导航栏和底部工具栏，仍无效果：

.toolbarBackground(barBackgroundGradient, for: .navigationBar, .bottomBar)

核心问题区分：导航栏底部工具栏 vs TabBar #

你需要先明确自己要修改的是NavigationStack/NavigationView内的底部工具栏，还是TabView的标签栏（TabBar），两者的自定义方式完全不同：

1. 自定义NavigationStack内的.bottomBar工具栏

如果你的底部工具栏是通过ToolbarItem(placement: .bottomBar)在导航栈内定义的，确保以下几点：

• 底部工具栏的ToolbarItem必须设置placement: .bottomBar
• 将toolbarBackground修饰符应用到导航栈内的根视图上（而非导航栈本身）
• 检查是否存在.toolbar(.hidden)之类的修饰符覆盖了背景设置

示例代码：

NavigationStack {
    Text("主内容")
        .toolbar {
            ToolbarItem(placement: .bottomBar) {
                HStack {
                    Button("操作1") {}
                    Spacer()
                    Button("操作2") {}
                }
            }
        }
        // 应用底部工具栏背景
        .toolbarBackground(barBackgroundGradient, for: .bottomBar)
        .toolbarBackground(.visible, for: .bottomBar)
}

2. 自定义TabView的TabBar

如果要修改的是TabView的标签栏，iOS 16+提供了专门的tabBarBackground修饰符，而非toolbarBackground：

TabView {
    Text("标签页1")
        .tabItem { Label("首页", systemImage: "house") }
    Text("标签页2")
        .tabItem { Label("我的", systemImage: "person") }
}
.tabBarBackground(barBackgroundGradient)
.tabBarBackground(.visible)

额外注意事项 #

• 确认barBackgroundGradient是有效的渐变实例（比如LinearGradient(colors: [.red, .blue], startPoint: .top, endPoint: .bottom)）
• 若在模拟器中测试无效果，可尝试重启模拟器或清理项目缓存，避免缓存导致的显示异常

内容的提问来源于stack exchange，提问作者alex.bour