Question

我正在尝试添加一个具有2列和3行的gridview。我的问题是，当我尝试将其添加到“行”时，它会使整个页面消失。这是我的代码

class HomePage extends StatelessWidget{
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: new AppBar(
        elevation: 0.5,
        title: Text("Home", style: TextStyle(fontSize: 15, color: Colors.black45)),
        centerTitle: true,
        backgroundColor: Colors.white,
      ),
      body: SingleChildScrollView(
        child: Column(
          children: <Widget>[
            new Container(
              margin: const EdgeInsets.all(25),
              child: Text("Shop Category", style: new TextStyle(fontSize: 18, color: Colors.black, fontFamily: 'Raleway'),textAlign: TextAlign.left,),
            ),
            new GridView.count(
              primary: true,
              crossAxisCount: 2,
              children: <Widget>[
                new Image.asset('assets/images/meat.jpg')
              ],
            )
          ],
        )
      ),
    );
  }

Answer 1

只需将\n属性添加到您的shrinkWrap

GridView

Answer 2

Column 和 GridView 都采用全屏，因为这是两个小部件的默认行为，因此我们必须将 GridView 缩小到最小尺寸，这应该在屏幕。

GridView.count(
              primary: true,
              shrinkWrap: true,
              physics: NeverScrollableScrollPhysics(),
              crossAxisCount: 2,
              children: <Widget>[
                new Image.asset('assets/images/meat.jpg')
              ],
            )

shrinkWrap:true - 使用这个 GridView 只占用它需要的空间。

physics: NeverScrollableScrollPhysics() - 它禁用了 GridView 的滚动功能，这意味着现在我们只有 SingleChildScrollView 提供滚动功能。

将Gridview添加到列中会使页面为空。扑

2 个答案: