title: SwiftUI ScrollView and alignment
body: <p>Okay, I know SwiftUI is a shift in thinking, especially coming from a world of HTML and css.  But I've spent like 4 days trying to get something to work that I feel should be pretty easy and just can't so please help!</p>
  
  <p>I have an app where one screen is a table of results, dynamic data that could be one or two rows/columns but could also be hundreds.  So I want to be able to scroll around in cases where the table is huge.</p>
  
  <p>I've replicated my setup and reproduced my problems in a Swift playground like so</p>
  
  <pre><code>import Foundation
  import UIKit
  import PlaygroundSupport
  import SwiftUI
  
  struct ContentView : View {
      var cellSize: CGFloat = 50
      var numRows: Int = 3
      var numCols: Int = 3
      var body : some View {
  
          ZStack {
              ScrollView([.horizontal,.vertical]) {
  
                      HStack( spacing: 0) {
                          VStack ( spacing: 0) {
                              ForEach(0 ..&lt; numRows, id: \.self) { row in
                                  Text("row " + row.description)
                                      .frame( height: self.cellSize )
                              }
                          }
                          ForEach(0 ..&lt; self.numCols, id: \.self) { col in
                              VStack( spacing: 0) {
                                  ForEach(0 ..&lt; self.numRows, id: \.self) { row in
                                      Rectangle()
                                      .stroke(Color.blue)
                                          .frame( width: self.cellSize, height: self.cellSize )
                                  }
                              }
                          }
                      }
                    .frame( alignment: .topLeading)
              }
          }
      }
  }
  
  let viewController = UIHostingController(rootView: ContentView())
  PlaygroundPage.current.liveView = viewController
  </code></pre>
  
  <p>Here's what I get when the grid is 3x3</p>
  
  <p><a href="https://i.stack.imgur.com/Pd8gE.png" rel="noreferrer"><img src="https://i.stack.imgur.com/Pd8gE.png" alt="3x3"></a></p>
  
  <p>I know things like to center by default in SwiftUI, but why isn't that <code>.frame( alignment: .topLeading)</code> on the HStack causing the table to be aligned to the upper left corner of the screen?</p>
  
  <p>Then even worse, once that table gets large, here's what I get:</p>
  
  <p><a href="https://i.stack.imgur.com/gRvEG.gif" rel="noreferrer"><img src="https://i.stack.imgur.com/gRvEG.gif" alt="15x15"></a></p>
  
  <ol>
  <li>Still not aligned to the top left, which would make sense as a starting point.</li>
  <li>When I scroll left, I can't even get to the point where I can see my header column</li>
  <li>The view bounces me away from the edges when I get close.  Like I can get to the point where I can see the top edge of the table, but it bounces me back right away.</li>
  <li>A ton of whitespace to the right, which probably correlates to me not seeing my header columns on the left.</li>
  </ol>
  
  <p>What am I doing wrong here? I'm exhausted trying all different <code>frame</code> and <code>alignment</code> options on various Views in here.</p>