如何在Flutter中复制HTML网格

Question

我想像我的网站所示那样以网格的形式显示网格，我将网格包裹在listView中以使其滚动letf并向右滚动，但是我不知道如何实现具有列和行分隔符的普通网格。

我的颤动代码是：

child: ListView(
  controller: controller,
  scrollDirection: Axis.horizontal,
  children: <Widget>[
    Card(
        child: Container(
          width: MediaQuery.of(context).size.height*1.5,
          child: GridView.count(
            crossAxisCount: 4,
            childAspectRatio: 50.0 / 9.0,
            children: new List<Widget>.generate(16, (index) {
              return new GridTile(
                child: new Container(
                    color: Colors.blue.shade200,
                    child: new Center(
                      child: new Text('tile $index'),
                    )
                ),
              );
            }),
          ),
        )
    )
  ],
),

html网格：

<div class="roundedTable slider">
    <div class="grid-container slide">
        <div class="grid-item"></div>
        <div class="grid-item"><h3>#GOOD</h3></div>
        <div class="grid-item"><h3>#BETTER</h3></div>
        <div class="grid-item"><h3>#BEST</h3></div>
       <div class="grid-item"><h5>Prezzo</h5></div>
       <div class="grid-item">€ 290</div>
       <div class="grid-item">€ 370</div>
       <div class="grid-item">€ 500</div>
       <div class="grid-item"><h5>Durata</h5></div>
       <div class="grid-item">120"</div>
       <div class="grid-item">180"</div>
       <div class="grid-item">210"</div>
       <div class="grid-item"><h5>Consegna</h5></div>
       <div class="grid-item">15 Giorni</div>
       <div class="grid-item">10 Giorni</div>
       <div class="grid-item">7 Giorni</div>
       <div class="grid-item"><h5>Nomi e Data</h5></div>
       <div class="grid-item"><i class="fas fa-check"></i></div>
       <div class="grid-item"><i class="fas fa-check"></i></div>
       <div class="grid-item"><i class="fas fa-check"></i></div>
       <div class="grid-item"><h5>Scelta audio style (da campione)</h5></div>
       <div class="grid-item"><i class="fas fa-check"></i></div>
       <div class="grid-item"><i class="fas fa-check"></i></div>
       <div class="grid-item"><i class="fas fa-check"></i></div>
       <div class="grid-item"><h5>Superwide Format</h5></div>
       <div class="grid-item"><i class="fas fa-times"></i></div>
       <div class="grid-item"><i class="fas fa-check"></i></div>
       <div class="grid-item"><i class="fas fa-check"></i></div>
       <div class="grid-item"><h5>Color Correction</h5></div>
       <div class="grid-item"><i class="fas fa-times"></i></div>
       <div class="grid-item"><i class="fas fa-times"></i></div>
       <div class="grid-item"><i class="fas fa-check"></i></div>
       <div class="grid-item"><h5>Stabilizzazione Cinema</h5></div>
       <div class="grid-item"><i class="fas fa-times"></i></div>
       <div class="grid-item"><i class="fas fa-times"></i></div>
       <div class="grid-item"><i class="fas fa-check"></i></div>
       <div class="grid-item"><h5>Transizioni Clips</h5></div>
       <div class="grid-item"><i class="fas fa-times"></i></div>
       <div class="grid-item"><i class="fas fa-times"></i></div>
       <div class="grid-item"><i class="fas fa-check"></i></div>
       <div class="grid-item"></div>
       <div class="grid-item"><a class="custom-button" href="#">add to cart</a></div>
       <div class="grid-item"><a class="custom-button" href="#">add to cart</a></div>
       <div class="grid-item"><a class="custom-button" href="#">add to cart</a></div>
     </div>
</div>

我已经创建了一个Codepen here

我不是在寻找花哨的网格，我只是想要一个圆角的普通网格，您能帮我吗？