SwiftUI TabView模拟器与真机表现差异：如何移除选中项多余背景色？

iOS17.2.1真机上，系统默认给TabBar选中的TabItem添加了背景填充，而模拟器暂未同步这个行为。要移除该背景色，仅保留选中项的色调，可以通过自定义UITabBarAppearance来实现：

修改后的代码 #

struct TabViewTestApp: App {
    init() {
        let tabBarAppearance = UITabBarAppearance()
        // 移除选中项的背景色
        tabBarAppearance.stackedLayoutAppearance.selected.backgroundColor = .clear
        
        // 自定义选中项的色调（可选，替换为你需要的颜色）
        let selectedTint = UIColor.blue
        tabBarAppearance.stackedLayoutAppearance.selected.iconColor = selectedTint
        tabBarAppearance.stackedLayoutAppearance.selected.titleTextAttributes = [.foregroundColor: selectedTint]
        
        // 应用样式到全局TabBar
        UITabBar.appearance().standardAppearance = tabBarAppearance
        // 适配滚动到边缘时的TabBar样式（可选）
        UITabBar.appearance().scrollEdgeAppearance = tabBarAppearance
    }
    
    var body: some Scene {
        WindowGroup {
            TabView {
                ContentView()
                    .tabItem {
                        Label("First", systemImage: "gear")
                    }
                SecondView()
                    .tabItem {
                        Label("Second", systemImage: "chart.pie")
                    }
            }
        }
    }
}

说明 #

• 通过stackedLayoutAppearance.selected.backgroundColor = .clear直接清除选中项的背景填充，和模拟器表现一致。
• 如果只需要给单个TabView设置样式，可删除App的init代码，改为在TabView上添加修饰符：

  TabView {
      // ... 子视图内容
  }
  .tabBarAppearance(tabBarAppearance)
  

内容的提问来源于stack exchange，提问作者Karlis