Search code examples
listviewswiftuiswiftui-listswiftui-form

List style SwiftUI


How to do such a list like in the picture? (edit: list header)

enter image description here

Here's what I've tried - List and Form:

NavigationView {
    VStack {
        List { // or Form here
            // Text("New") <- this also isn't it
            Section(header: Text("New")) {
                ForEach(... ... .indices, id: \.self) { index in
                    ...
                    ...
                }
            }
            
            Section(header: Text("Done")) {
                ForEach(...) { ...
                    ...
                }
            }
     }
}
            // On the pictures below - `List` on the left; `Form` on the right

enter image description here enter image description here


Solution

  • It looks like a Form with sections, the section headers can be configured (like shown below), rows content compose as you need

    demo

    NavigationView {
        Form {
            Section(header: Text("New").bold().font(.title).foregroundColor(.black)) {
    

    EDIT: .textCase(.none) allows the source text capitalization "Xxxx"

    Section(header: Text("New").bold().font(.title).textCase(.none).foregroundColor(.black))