如何设置网格视图列高? [英] How to set grid view column height?

问题描述

我是 Flutter 新手，没有太多经验.
我正在尝试使用 Flutter 开发一个 Android 应用，这是我之前的应用设计.

I am new to flutter and don't have much experience.
I am trying to develop an android app using flutter and this is my previous app design.

而且我也能够成功地制作网格视图，但列高是问题所在.他们有没有人可以帮助我处理我的颤振代码.

And I'm also able to successfully make grid view in flutter but the column height is the problem. Is their anyone who can help me with my flutter code.

 class MyHomePage extends StatelessWidget {

  @override
   Widget build(BuildContext context) {
     hi(){

    }
     return new Scaffold(

         appBar: new AppBar(
           actions: <Widget>[],
                title: new Text("milla"),
              ),
       body: new Container(


         child: new Center(

            child: new GridView.count(
              shrinkWrap: true,
              scrollDirection: Axis.vertical,
              childAspectRatio:1.0,
              crossAxisCount: MediaQuery.of(context).size.width <= 400.0 ? 3 : MediaQuery.of(context).size.width >= 1000.0 ? 5 : 4,

           // Create a grid with 2 columns. If you change the scrollDirection to
           // horizontal, this would produce 2 rows.

           crossAxisSpacing: 2.0,
           // Generate 100 Widgets that display their index in the List
           children: new List.generate(100, (index) {

             return  new Column(
                 crossAxisAlignment: CrossAxisAlignment.stretch,
                 mainAxisSize: MainAxisSize.min,

                 verticalDirection: VerticalDirection.down,
                 children: <Widget>[


                   new Center(

                     child:  new Image(


                         image: new NetworkImage('https://github.com/flutter/website/blob/master/_includes/code/layout/lakes/images/lake.jpg?raw=true')
                     )
                   ),
                   new Expanded(child: new Text("apple2")), new Expanded(child: new Text(
                   'Item $index',
                   style: Theme.of(context).textTheme.headline,
                 )),new Expanded(child: new Center(child: new Row(
                     crossAxisAlignment: CrossAxisAlignment.center,

                     children: <Widget>[new Text("+",style: new TextStyle(fontSize: 24.0),),new Text("1"),new Text("-")])))]
             );
           }),
         ),
        ),
      )
     );
   }
 }

这是我的输出.

如何设置列高?
当我尝试添加新视图时，它显示此错误
引发了另一个异常:A RenderFlex 在底部溢出了 21 个像素."

How to set column height?
When i'm trying to add new view, it's showing this error
"Another exception was thrown: A RenderFlex overflowed by 21 pixels on the bottom."

推荐答案

把这个代替

childAspectRatio:1.0 to  childAspectRatio: (itemWidth / itemHeight)

var size = MediaQuery.of(context).size;
 final double itemHeight = (size.height) / 2;
 final double itemWidth = size.width / 2;

在我的代码中可以很好地设置 Gridview 的高度和宽度

It works fine in my code to set height and width of Gridview

这篇关于如何设置网格视图列高?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！