SwiftUI listRowBackground can't animate?

I'm trying to imitate the normal UITableView behavior of a cell hiliting when you tap it, and then fading out. I'm getting pretty close except:

  • .background() doesn't fill the entire list cell, it just fits around the content.
  • .listRowBackground() does fill the cell, but it doesn't animate.

Is there a way to animate a list row background?

Here's the source for full context:

struct Profile {
    let name: String
    var selected: Bool
    var hilited: Bool = false
}

extension Profile: Identifiable {
    var id: String { name }
}

struct ProfilesPicker: View {
    @State var profiles: [Profile]

    var body: some View {
        List {
            ForEach(0..<profiles.count) { index in
                let profile = profiles[index]

                CheckCell(name: profile.name, checked: profile.selected)
                    // using .background() gets a proper fade but doesn't fill the cell
                    .listRowBackground(Color(profile.hilited ? UIColor.systemFill : UIColor.systemBackground))
                    .onTapGesture {
                        profiles[index].hilited = true
                        withAnimation(.easeIn) {
                            profiles[index].hilited = false
                            profiles[index].selected.toggle()
                        }
                    }
            }
        }
    }
}

struct CheckCell: View {
    let name: String
    let checked: Bool

    var body: some View {
        HStack {
            Text(name)
            Spacer()
            if checked {
                Image(systemName: "checkmark")
            }
        }
        .contentShape(Rectangle())
    }
}

Secondary question: the checkmark in my cell animates out but not in. Any ideas there? Thanks.

This is a problem in Xcode preview canvas. Run it in the sim or device should work properly.

I'm seeing it on my device, too - iPhone 11, iOS 14.4.

Edit - I tried it again and now it is working. :man_shrugging:

Terms of Service

Privacy Policy

Cookie Policy