How to move .listRowBackground style from the list to list element in SwiftUI?

Question

This is my code:

var body: some View {
    List(months) { month in
        NavigationLink {
            MonthView(month: month)
        } label: {
            MonthElementView(month: month)
        }
        .listRowBackground(
            Color(uiColor: mode.underlayBackgroundColor)
                .clipped()
                .cornerRadius(10)
        )
    }
    .navigationTitle(months.first?.descriptiveYear ?? "")
}

This simply works as expected, but I need to use MonthElementView(month: month) also here:

var body: some View {
    ScrollView {
        VStack(alignment: .leading, spacing: 3, content: {
            if let month = month {
                MonthElementView(month: month)
            } else {
                Text("Nothing here yet")
            }
        })
    }
}

and here it doesn't work. Is there a way to setup .listRowBackground style directly inside my MonthElementView?

Here is the body for MonthElementView:

var body: some View {
    VStack(alignment: .center, spacing: 8, content: {
        // some staff here
    })
    .frame(maxWidth: .infinity)
    .padding(.top, 10)
    .padding(.bottom, 10)
    .padding(.leading, 2)
    .padding(.trailing, 2)
}

As far as I understand you use `MonthElementView` first in a `List` and second in a `ScollView` ... but scrollview does not support `.listRowBackground`. So it would not help moving it inside the view ... can't you just use a regular `.background` in the ScollView?? — ChrisR, Jan 26 '23 at 23:13
but regular background on MonthElementView doesnt work... and background on ScrollView colors a whole scroll, but I need to background only elements inside scroll. Thats all;) — Bartłomiej Semańczyk, Jan 28 '23 at 01:03
why does "regular background on MonthElementView doesnt work" ? — ChrisR, Jan 28 '23 at 10:00

score 2 · Answer 1 · answered Jan 28 '23 at 10:02

background for list cell (as you have already):

            List(1..<13) { month in
                MonthElementView(month: month)
                    // list background
                    .listRowBackground(
                        Color(.gray).opacity(0.5)
                            .clipped()
                            .cornerRadius(10)
                    )
            }

background for Scollview element:

            ScrollView {
                ForEach(1..<13) { month in
                    MonthElementView(month: month)
                        // scrollview background
                        .background(
                            Color(.orange).opacity(0.7)
                                .clipped()
                                .cornerRadius(10)
                        )
                }
            }

How to move .listRowBackground style from the list to list element in SwiftUI?

1 Answers1