SwiftUI中TabView选中TabItem图标始终显示蓝色的问题求助

我完全懂你现在的困扰——明明设置了选中状态的自定义黑色图标，结果系统硬是显示默认的蓝色圆圈，这确实挺闹心的。咱们一步步拆解问题，搞定它：

问题根源 #

SwiftUI的TabView默认会给选中状态的tabItem图标应用全局tint颜色（默认是蓝色），哪怕你给Image加了renderingMode(.original)，有时候系统样式的优先级还是更高，会把自定义颜色覆盖掉。另外我注意到你代码里第三个Tab的tag设成了1，和第二个Tab重复了，这会导致选中第三个Tab时selected变量还是1，可能引发额外的状态混乱，这个先顺手修复下。

解决方案1：修改TabView全局Tint颜色 #

如果你希望所有选中的Tab图标都显示黑色，最简单的办法就是给整个TabView设置tint为黑色，这样系统就不会用默认蓝色覆盖你的自定义图标了：

import SwiftUI
struct MainView: View {
    @State private var selected = 0
    var body: some View {
        TabView(selection: $selected){
            Text("First View")
                .tabItem {
                    Image(selected == 0 ? "eclipse-tab-icon-black" : "eclipse-tab-icon-grey")
                        .renderingMode(.original)
                }.tag(0)
            Text("Second View")
                .tabItem {
                    Image(systemName: "2.circle")
                }.tag(1)
            Text("Third View")
                .tabItem {
                    Image(systemName: "3.circle")
                }.tag(2) // 修复重复的tag问题
        }
        .tint(.black) // 设置全局选中态颜色为黑色
    }
}

修改后，第一个Tab选中时会正常显示你自定义的黑色图标，系统自带的图标（第二、第三个）选中时也会变成黑色，整体风格更统一。

解决方案2：自定义TabItem内容绕过系统Tint #

如果你只想让第一个Tab的选中图标显示黑色，其他Tab保留默认蓝色，可以通过自定义tabItem的内容结构，绕过系统默认的图标染色逻辑：

import SwiftUI
struct MainView: View {
    @State private var selected = 0
    var body: some View {
        TabView(selection: $selected){
            Text("First View")
                .tabItem {
                    // 用HStack包裹图片，避免系统默认染色
                    HStack {
                        Image(selected == 0 ? "eclipse-tab-icon-black" : "eclipse-tab-icon-grey")
                            .renderingMode(.original)
                    }
                }.tag(0)
            Text("Second View")
                .tabItem {
                    Image(systemName: "2.circle")
                }.tag(1)
            Text("Third View")
                .tabItem {
                    Image(systemName: "3.circle")
                }.tag(2) // 修复tag重复问题
        }
    }
}

这种方式通过自定义tabItem的容器，让系统无法对图标应用默认染色，确保你的自定义图片颜色完全生效。

额外检查项 #

别忘了确认你的资源文件设置：打开Assets.xcassets，选中eclipse-tab-icon-black，在右侧属性面板检查"Render As"选项，确保设置为Original Image，这样图片的原始黑色才会被完整保留，不会被当成模板图片处理。

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