Search code examples
swiftuiswiftui-navigationlink

Set Color of Chevron in a SwiftUI List in a NavigationView

I have this list I a NavigationView.
In dark mode the Chevron (red circle) is almost invisible.

enter image description here How can I set the Color of Chevron in a List.

struct ContentView: View {
    var body: some View {
      NavigationView{
        List {
          Line(text: "Line 1")
          Line(text: "Line 2")
          Line(text: "Line 3",selected: true)
          Line(text: "Line 4")
          Line(text: "Line 5")
        }
      }
    }
}

struct Line: View {
  var text :String
  var selected = false
  @Environment(\.colorScheme) var colorScheme

  var body: some View {
    NavigationLink(destination: Text("D")) { Text(text)}
      .listRowBackground(selected ? Color.blue : Color(.systemBackground))
      .foregroundColor(selected ? Color.white : Color(.label))
    .onTapGesture(perform: {print ("tap")
    } )
  }
}
Solution

  • The standard chevron is not a symbol by raster image, here it is

    demo1

    that is why it does not react on any color changing modifiers.

    Solution, disable standard chevron and use own, custom, (behaviour of the List is the same), like below

    HStack {
    Text(text)
    NavigationLink(destination: Text("D")) { EmptyView() } // disabled  !
    Image(systemName: "chevron.right")                     // << custom !!
        .foregroundColor(Color.red)                        // any color !!!
}

    demo2