How to change ListStyle in List

user_8192960 0
Viewed 25303

In SwiftUI List Appears to have a property called ListStyle.

How can i change the style of the list 

struct ListView : View {
var body: some View {
    NavigationView {
    List(Item.create().identified(by: \.id)){ row in
        NavigationButton(destination: DetailsView(item: row)) {
            RowView(item: row)
        }
    }
    .listStyle(StaticMember<PlainListStyle.Member>.self) // error here
    .foregroundColor(.red)
    .navigationBarTitle(Text("List View"))
    .statusBar(hidden: false)
    }
  }
}

The conforming parties of ListStyle protocol are

  1. CarouselListStyle
  2. DefaultListStyle
  3. GroupedListStyle
  4. PlainListStyle
  5. SidebarListStyle

However i am struggling trying to set a new style for the list using it like this 

.listStyle(StaticMember<PlainListStyle.Member>.self)

I have tried so many ways, but each style confirming to the ListStyle is struct, like they're not enumerated values

Anyone have an idea how to change the style of List ?

Error in Xcode

Cannot convert value of type 'StaticMember.Type' (aka 'StaticMember>.Type') to expected argument type 'StaticMember<_>'

Using : .listStyle(StaticMember<PlainListStyle.Member>)

Error in Xcode

Cannot convert value of type '(StaticMember).Type' (aka 'StaticMember>.Type') to expected argument type 'StaticMember<_>'

Using : .listStyle(StaticMember<PlainListStyle()>) or .listStyle(StaticMember<PlainListStyle.self>)

Error in Xcode

'>' is not a postfix unary operator

swiftui swift ios
3 Answers

As of Xcode 11 beta 5, Apple requires the following, as briefly outlined here:

.listStyle(GroupedListStyle())

The following is a breakdown on the various styles and where they can be used between iOS and watchOS, along with when they were introduced.

iOS and watchOS

Introduced with iOS 13 and watchOS 6:

  • PlainListStyle

  • ListStyle

  • DefaultListStyle

iOS Only

Introduced with iOS 13:

  • GroupedListStyle

Introduced with iOS 14:

  • InsetGroupedListStyle
  • InsetListStyle
  • SidebarListStyle

Some answers to this question also include styles that are watchOS specific, but are not clearly marked as such, despite the question being tagged iOS. For completeness...

watchOS Only

Introduced with watchOS 6:

  • CarouselListStyle

Introduced with watchOS 7:

  • EllipticalListStyle
user_42534370

Update for Xcode 13

So Apple added an extension to have a syntax similar to Xcode 11 Beta 5 and lower:

extension ListStyle where Self == GroupedListStyle {

    /// The list style that describes the behavior and appearance of a grouped
    /// list.
    ///
    /// On iOS, the grouped list style displays a larger header and footer than
    /// the ``ListStyle/plain`` style, which visually distances the members of
    /// different sections.
    public static var grouped: GroupedListStyle { get }
}

So again we can use this now:

.listStyle(.grouped)

Update for Xcode 11 Beta 5 till Xcode 12

After Xcode Beta 5 the listStyle(.grouped) approach is deprecated (until Xcode 12); now Apple created a struct implementation for every style. So you should do like: .listStyle(GroupedListStyle()). Same approach is applied to other styles available.

Old implementation for pre beta 5

Just do .listStyle(.grouped). For other list style use

  • .carousel
  • .default
  • .plain
  • .sidebar

Basically you are just passing ListStyle.grouped to the method, but thanks to swift type inference you don't need to specify the struct. Every static member work in this way.

StaticMember means that there is a static member in the ListStyle protocol. The declaration is this.

extension StaticMember where Base : ListStyle {

    /// A `ListStyle` that implements the system default grouped `List`
    /// interaction and appearance.
    public static var grouped: GroupedListStyle.Member { get }
}
user_56747210
user_51962860
Related