title: Is there a better way to create a multi-column (Data table) List view in SwiftUI
body: <p><em>EDIT Below</em></p>
  <p>I'm trying to present a JSON file as a data table, similar to what one would see in a database application. So far my best results have come from an HStack of Lists, however in doing so, each list is scrollable on its own (nor can I imagine any easy way to sort the list(s). Is there a way to create this database view effect using a single List view as opposed to multiple ones?</p>
  <p>As an aside, the pod &quot;SwiftDataTables&quot; is exactly what I'm trying to achieve, although that pod seems out of date and not enough documentation for me to get working with my data.</p>
  <p>This is a screenshot of what I am currently working with:</p>
  <p><a href="https://i.stack.imgur.com/UrhxG.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/UrhxG.png" alt="Current Siutation" /></a></p>
  <p>And here is the code I'm using:</p>
  <pre><code>//
  //  ContentView.swift
  //  Shared
  //
  //  Created by Kyle Carroll on 7/19/21.
  //
  
  import SwiftUI
  import SwiftDataTables
  
  struct ContentView: View {
  
      @StateObject var bookStore : BookStore = BookStore(books:bookData)
  
      var body: some View {
              HStack(spacing: 0) {
                  List {
                      ForEach (bookStore.books) { book in
                          ListCell3(book: book)
                      }
                  }
                  .listStyle(PlainListStyle())
                  .frame(width: 75, height: nil, alignment: .center)
                  List {
                      ForEach (bookStore.books) { book in
                          ListCell(book: book)
                      }
                  }
                  .listStyle(PlainListStyle())
                  List {
                      ForEach (bookStore.books) { book in
                          ListCell2(book: book)
                      }
                  }
                  .listStyle(PlainListStyle())
          }
      }
  }
  
  struct ListCell: View {
  
      var book : Book
  
      var body: some View {
              HStack {
                  Text(book.title)
          }
      }
  }
  
  struct ListCell2: View {
  
      var book : Book
  
      var body: some View {
              HStack {
                  Text(book.author)
          }
      }
  }
  
  struct ListCell3: View {
  
      var book : Book
  
      var body: some View {
              HStack {
                  Text(book.id)
          }
      }
  }
  
  struct ContentView_Previews: PreviewProvider {
      static var previews: some View {
          if #available(iOS 15.0, *) {
              ContentView()
                  .previewInterfaceOrientation(.landscapeLeft)
          } else {
              // Fallback on earlier versions
          }
      }
  }
  </code></pre>
  <p>Edit:</p>
  <p>I've chanced my ListCell struct to list all elements in a single row with dividers between them, however, I can't figure out how to get defined spacing between the elements. A global &quot;spacing&quot; in the HStack causes the elements to be misaligned as the text in each cell is a different length. I'd like certain &quot;columns&quot; to have different fixed widths.</p>
  <pre><code>
      var book : Book
  
      var body: some View {
          HStack(alignment: .center, spacing: nil) {
                  Text(book.id)
                  Divider()
                  Text(book.title)
                  Divider()
                  Text(book.author)
          }
      }
  }
  </code></pre>