Is their a better way to create a SwiftUI list looping through an array than looping for each VStack

Colton

I am trying to create a table that scrolls horizontally after the first column inside, I have a for loop for each column to get data from an array. I know this isn't the correct way because of how many times i am looping the same array but i cant figure out a better solution of doing this.

    struct SampleData: Identifiable {
      let id = UUID()
      let Entity: String
      let address1: String
      let address2: String
      let city: String
      let state: String
      let zip: Int
      let website: String
      let billToName: String
      let billable: Bool
      let hours: String
      let accountNo: Int
      let BillToEntity: String
      let email: String

    }

    let datas = [
      SampleData(
        Entity: "Entity 1", address1: "1234 N. Main", address2: "Suite 200", city: "austin",
        state: "TX", zip: 12345, website: "www.website.com", billToName: "Test Name 1", billable: false,
        hours: "8-5 M-F", accountNo: 123_456_789, BillToEntity: "Bill To Entity 1",
        email: "[email protected]"),
      SampleData(
        Entity: "Entity 2", address1: "5678 N. Main", address2: "Suite 300", city: "livingston",
        state: "TX", zip: 12345, website: "www.website.com", billToName: "Test Name 2", billable: false,
        hours: "8-5 M-F", accountNo: 123_456_789, BillToEntity: "Bill To Entity 2",
        email: "[email protected]"),
      SampleData(
        Entity: "Entity 3", address1: "90025 N. Main", address2: "Suite 400", city: "houston",
        state: "TX", zip: 12345, website: "www.website.com", billToName: "Test Name 3", billable: true,
        hours: "8-5 M-F", accountNo: 123_456_789, BillToEntity: "Bill To Entity 3",
        email: "[email protected]"),
      SampleData(
        Entity: "Entity 4", address1: "4456 N. Main", address2: "Suite 500", city: "spring",
        state: "TX", zip: 12345, website: "www.website.com", billToName: "Test Name 4", billable: true,
        hours: "8-5 M-F", accountNo: 123_456_789, BillToEntity: "Bill To Entity 4",
        email: "[email protected]"),
      SampleData(
        Entity: "Entity 5", address1: "4456 N. Main", address2: "Suite 500", city: "spring",
        state: "TX", zip: 12345, website: "www.website.com", billToName: "Test Name 4", billable: true,
        hours: "8-5 M-F", accountNo: 123_456_789, BillToEntity: "Bill To Entity 4",
        email: "[email protected]"),
      SampleData(
        Entity: "Entity 6", address1: "56 N. Main", address2: "Suite 500", city: "spring", state: "TX",
        zip: 12345, website: "www.website.com", billToName: "Test Name 4", billable: false,
        hours: "8-5 M-F", accountNo: 123_456_789, BillToEntity: "Bill To Entity 4",
        email: "[email protected]"),
      SampleData(
        Entity: "Entity 7", address1: "4456 N", address2: "Suite 500", city: "spring", state: "TX",
        zip: 12345, website: "www.website.com", billToName: "Test Name 4", billable: true,
        hours: "8-5 M-F", accountNo: 123_456_789, BillToEntity: "Bill To Entity 4",
        email: "[email protected]"),
      SampleData(
        Entity: "Entity 8", address1: "44 Main", address2: "Suite 500", city: "spring", state: "TX",
        zip: 12345, website: "www.website.com", billToName: "Test Name 4", billable: true,
        hours: "8-5 M-F", accountNo: 123_456_789, BillToEntity: "Bill To Entity 4",
        email: "[email protected]"),
    ]

    struct TablesView: View {
      @State var billable = false

      var body: some View {

        HStack (alignment: .top){
          VStack {
            Text("Entity")
             
            HStack(spacing: 16) {

              VStack {
                ForEach(datas) { val in
                  Text(val.Entity)
                }
              }

            }
          }

          ScrollView(.horizontal) {
            HStack(alignment: .top) {

              VStack {

                VStack {
                  Text("Address1")
                  ForEach(datas) { val in
                    Text(val.address1)
                  }
                }
              }
              VStack {

                VStack {
                  Text("Address2")
                  ForEach(datas) { val in
                    Text(val.address2)
                  }
                }
              }
              VStack {

                VStack {
                  Text("City")
                  ForEach(datas) { val in
                    Text(val.city)
                  }
                }
              }
              VStack {

                VStack {
                  Text("State")
                  ForEach(datas) { val in
                    Text(val.state)
                  }
                }
              }
              VStack {

                VStack {
                  Text("Zip")
                  ForEach(datas) { val in
                    Text(String(val.zip))
                  }
                }
              }
              VStack {

                VStack {
                  Text("Website")
                  ForEach(datas) { val in
                    Text(val.website)
                  }
                }
              }
              VStack {

                VStack {
                  Text("Bill To")
                  ForEach(datas) { val in
                    Text(val.billToName)
                  }
                }
              }
              VStack {

                VStack {
                  Text("Billable")
                  ForEach(datas) { val in

                    Image(systemName: val.billable ? "checkmark.square.fill" : "square")
                      .foregroundColor(val.billable ? Color(UIColor.systemBlue) : Color.secondary)
                      .onTapGesture {
                        self.billable.toggle()
                      }
                  }
                }
              }
            }
          }
        }
      }
    }

List with horizontal scrolling

Andrew Carter

Using a Grid could make this much nicer. Didn't type out the whole thing here but you get the idea

        ScrollView(.horizontal) {
            Grid(alignment: .leading) {
                GridRow {
                    Text("Address 1")
                    Text("Address 2")
                    Text("city")
                }
                
                ForEach(datas) { data in
                    GridRow {
                        Text(data.address1)
                        Text(data.address2)
                        Text(data.city)
                    }
                }
            }
        }

enter image description here

Collected from the Internet

Please contact [email protected] to delete if infringement.

edited at
0

Comments

0 comments
Login to comment

Related

TOP Ranking

  1. 1

    Failed to listen on localhost:8000 (reason: Cannot assign requested address)

  2. 2

    pump.io port in URL

  3. 3

    How to import an asset in swift using Bundle.main.path() in a react-native native module

  4. 4

    Loopback Error: connect ECONNREFUSED 127.0.0.1:3306 (MAMP)

  5. 5

    Compiler error CS0246 (type or namespace not found) on using Ninject in ASP.NET vNext

  6. 6

    BigQuery - concatenate ignoring NULL

  7. 7

    Spring Boot JPA PostgreSQL Web App - Internal Authentication Error

  8. 8

    ggplotly no applicable method for 'plotly_build' applied to an object of class "NULL" if statements

  9. 9

    ngClass error (Can't bind ngClass since it isn't a known property of div) in Angular 11.0.3

  10. 10

    How to remove the extra space from right in a webview?

  11. 11

    Change dd-mm-yyyy date format of dataframe date column to yyyy-mm-dd

  12. 12

    Jquery different data trapped from direct mousedown event and simulation via $(this).trigger('mousedown');

  13. 13

    maven-jaxb2-plugin cannot generate classes due to two declarations cause a collision in ObjectFactory class

  14. 14

    java.lang.NullPointerException: Cannot read the array length because "<local3>" is null

  15. 15

    How to use merge windows unallocated space into Ubuntu using GParted?

  16. 16

    flutter: dropdown item programmatically unselect problem

  17. 17

    Pandas - check if dataframe has negative value in any column

  18. 18

    Nuget add packages gives access denied errors

  19. 19

    Can't pre-populate phone number and message body in SMS link on iPhones when SMS app is not running in the background

  20. 20

    Generate random UUIDv4 with Elm

  21. 21

    Client secret not provided in request error with Keycloak

HotTag

Archive