CODEWITHSUNDEEP
swiftswiftui
Duck
Duck

Reputation: 35993

SwiftUI List - selected element flashes white before drawn as planned

I have this code for a List populated by Core Data:

      List {
          ForEach(items.filter {
            self.searchText.isEmpty ? true : $0.term!.contains(self.searchText)
          }, id: \.self) { item in
            
            Button(action: {
              globalVariables.selectedItem = item                  
            }) {
              Text(item.term!)
                .font(fontItems)
                .disabled(true)
                .foregroundColor(globalVariables.selectedItem == item ? .black : .white)
            }
            .listRowBackground(
              Group {
                if ((globalVariables.selectedItem == nil) || (item != globalVariables.selectedItem)) {
                  Color(UIColor.clear)
                } else if item == globalVariables.selectedItem {
                  Color("corListaSelecao").mask(RoundedRectangle(cornerRadius: 20))
                }
              }
              .padding(EdgeInsets(top: 0, leading: 5, bottom: 0, trailing: 5))
            )
          }
          .onDelete(perform: deleteItems)
          .onAppear{
            globalVariables.selectedItem = items.first
          }
          .cornerRadius(20)
        }
        .background(Color("fundoControles"))
        .cornerRadius(10)
        .padding(EdgeInsets(top: 5, leading: 10, bottom: 5, trailing: 10))

This produces a list like the following picture:

enter image description here

Every time I select a new item on the list, the new selected element background is drawn as a white hard edge rectangle momentarily then it is drawn as is is supposed to be, orange with round corners.

I am not setting this white color anywhere.

I have this init on my ContentView:

init() {
  UITextView.appearance().backgroundColor = .clear
  UITableView.appearance().backgroundColor = .clear
  UITableViewCell.appearance().backgroundColor = .clear
}

Where is this white color coming from?

How do I get rid of this undesired flash?

Upvotes: 2

Views: 636

Answers (1)

Asperi
Asperi

Reputation: 258107

This might be default List highlight for Button, try to remove Button and use instead .onTapGesture directly to Text, like

  Text(item.term!)
    .font(fontItems)
    .disabled(true)
    .foregroundColor(globalVariables.selectedItem == item ? .black : .white)
 // replacements for button to make whole row tappable
    .frame(maxWidth: .infinity, maxHeight: .infinity, alignment: .leading)
    .contentShape(Rectangle())
    .onTapGesture {
        globalVariables.selectedItem = item
    }

Upvotes: 1

Related Questions