Выбранное изображение вкладки для TabItem объекта TabView всегда синее в SwiftUI

Question

Я играю с TabView в SwiftUI и могу установить изображение вкладки, которая в данный момент не выбрана, однако настройка изображения для выбранной вкладки, похоже, не работает.Все, что я вижу, - это синий круг вместо черного.

Вот мой код:

import SwiftUI

struct MainView: View {
    @State private var selected = 0

    var body: some View {

        TabView(selection: $selected){
            Text("First View")
                .tabItem {
                    Image(self.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(1)
        }
    }
}

struct MainView_Previews: PreviewProvider {
    static var previews: some View {
        MainView()
    }
}

Как вы можете видеть здесь, невыбранная вкладка имеет серый цвет.Это правильно:

Но выбранная вкладка синяя, а не черная:

Активы:

Настройки актива:

Answer 1

Вы не устанавливаете выбранный и не выбранный значок на вашем TabView, вы предоставляете только одно изображение, и оно отображается второстепенным цветом, когда он не выбран, и акцентным цветом, когда он выбран.Если вы хотите, чтобы выбранные значки вкладок были черными, вы можете установить акцент на цвете на TabView на черный, но это противоречит рекомендациям Apple по дизайну, и вы также измените цвет акцента для всех подпредставлений.

Answer 2

использовать .accentColor (.black)

import SwiftUI

struct ContentView: View {
    @State private var selection = 0

    var body: some View {
        TabView(selection: $selection){
            Text("First View")
                .font(.title)
                .tabItem {
                    VStack {
                        Image("first")
                        Text("First")
                    }
                }
                .tag(0)
            Text("Second View")
                .font(.title)
                .tabItem {
                    VStack {
                        Image("second")
                        Text("Second")
                    }
                }
                .tag(1)
        }.accentColor(.black)
    }
}

tabItem (черный) демо

Answer 3

Измените режим рендеринга вашего изображения на оригинальный.Либо в папке xcassets, либо с модификатором renderMode в коде.