SwiftUI - как создать список с метками заголовка и детализации?

Question

Я пытаюсь воссоздать представление списка с меткой заголовка и меткой детализации, как во многих стандартных приложениях iOS:

https://developer.apple.com/documentation/uikit/uitableviewcell/1623273-detailtextlabel

Хотелось бы, чтобы заголовок был слева, а деталь - справа? Существует ли стандартная реализация для этого без создания пользовательского интерфейса в SwiftUI?

Спасибо!

Answer 1

Этого можно добиться, используя HStack:

struct ContentView : View {
  var body: some View {
    List {
      HStack {
        Text("Test")
        Spacer()
        Text("Detail")
      }
   }
}

Answer 2

Ради чистого кода я разделил разные части этой маленькой задачи.

Модель для каждой ячейки данных:

struct CellModel {
    let title: String
    let detail: String
}

Представление для представления каждой отдельной ячейки:

struct DetailCellView: View {

    let model: CellModel

    var body: some View {
        HStack() {
            Text(model.title)
            Spacer()
            Text(model.detail)
        }
    }
}

И Список (таблица) Вид:

struct ContentView : View {

    // Data Source
    let cells = [
        CellModel(title: "Text 1", detail: "Detail 1"),
        CellModel(title: "Text 2", detail: "Detail 2"),
        CellModel(title: "Text 3", detail: "Detail 3")
    ]

    var body: some View {

        List(cells.identified(by: \.title)) { model in
            DetailCellView(model: model)
        }

    }
}

- стиль детализации по умолчанию

Если вам нужен простой конструктор деталей по умолчанию, вам поможет следующее:

struct DetailCellView: View {

    @State var image: UIImage = UIImage()
    @State var title: String = ""
    @State var detail: String = ""

    var body: some View {
        HStack() {
            Image(uiImage: image)
            Text(title)
            Spacer()
            Text(detail)
        }
    }
}