GridView.Count在不固定父容器高度的情况下不可见

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了GridView.Count在不固定父容器高度的情况下不可见相关的知识,希望对你有一定的参考价值。

我不熟悉,所以无法在此代码中找到问题。一切正常,但我尝试将网格列表与两行结合使用,当我将高度赋予列表的父容器但我想根据项目包装高度时,这两行工作正常。

 void main() {
  runApp(new MaterialApp(
    home: new MyHome(),
 ));
}

class MyHome extends StatefulWidget {
  @override
  _AppState createState() => _AppState();
}

TextEditingController controller = new TextEditingController();

class _AppState extends State<MyHome> {
  final GlobalKey<ScaffoldState> _scaffoldKey = new GlobalKey<ScaffoldState>();

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      key: _scaffoldKey,
      appBar: PreferredSize(
        preferredSize: Size(null, 180),
        child: CustomAppBar(_scaffoldKey, controller),
      ),
      drawer: createDrawer(),
      body: SingleChildScrollView(
        child: Container(
          color: Colors.black12,
      //=========Main Container For Scrollview==============//
          child: Padding(
            padding: const EdgeInsets.fromLTRB(0, 15, 0, 0),
            child: Column(
              children: <Widget>[
                Container(
              //================Container for Categories==================//
                  color: Colors.white,
                  child: Padding(
                    padding: const EdgeInsets.fromLTRB(15, 10, 15, 10),
                    child: Row(
                      mainAxisAlignment: MainAxisAlignment.spaceBetween,
                      children: <Widget>[
                        Column(
                          children: <Widget>[
                        CircleAvatar(
                          backgroundImage:
                              ExactAssetImage('images/user_icon.png'),
                          minRadius: 20,
                          maxRadius: 30,
                        ),
                        Text(
                          'Women',
                          style: TextStyle(
                              fontSize: 13,
                              color: Colors.black,
                              fontFamily: 'SFProRegular'),
                        )
                      ],
                    ),
                    Column(
                      children: <Widget>[
                        CircleAvatar(
                          backgroundImage:
                              ExactAssetImage('images/user_icon.png'),
                          minRadius: 20,
                          maxRadius: 30,
                        ),
                        Text(
                          'Women',
                          style: TextStyle(
                              fontSize: 13,
                              color: Colors.black,
                              fontFamily: 'SFProRegular'),
                        )
                      ],
                    ),
                    Column(
                      children: <Widget>[
                        CircleAvatar(
                          backgroundImage:
                              ExactAssetImage('images/user_icon.png'),
                          minRadius: 20,
                          maxRadius: 30,
                        ),
                        Text(
                          'Women',
                          style: TextStyle(
                              fontSize: 13,
                              color: Colors.black,
                              fontFamily: 'SFProRegular'),
                        )
                      ],
                    ),
                    Column(
                      children: <Widget>[
                        CircleAvatar(
                          backgroundImage:
                              ExactAssetImage('images/user_icon.png'),
                          minRadius: 20,
                          maxRadius: 30,
                        ),
                        Text(
                          'Women',
                          style: TextStyle(
                              fontSize: 13,
                              color: Colors.black,
                              fontFamily: 'SFProRegular'),
                        )
                      ],
                    ),
                  ],
                ),
              ),
            ),
            Card(
              child: SizedBox(
                  height: 200.0,
                  child: Carousel(
                    images: [
                      NetworkImage(
                          'https://cdn-images-1.medium.com/max/2000/1*GqdzzfB_BHorv7V2NV7Jgg.jpeg'),
                      NetworkImage(
                          'https://cdn-images-1.medium.com/max/2000/1*wnIEgP1gNMrK5gZU7QS0-A.jpeg'),
                    ],
                    dotSize: 4.0,
                    dotSpacing: 15.0,
                    indicatorBgPadding: 5.0,
                    borderRadius: false,
                  )),
            ),

// ======================这里是问题=========== //

            GridView.count(     
              childAspectRatio: 4.0,
              // Create a grid with 2 columns. If you change the scrollDirection to
              // horizontal, this produces 2 rows.
              crossAxisCount: 2,
              // Generate 100 widgets that display their index in the List.
              children: List.generate(100, (index) {
                return Center(
                  child: Text(
                    'Item $index',
                    style: Theme.of(context).textTheme.headline,
                  ),
                );
              }),
            )
          ],
        ),
      ),
    ),
    ),
    );
  }
}
答案

完整代码:

void main() { runApp(new MaterialApp( home: new MyHome(), )); } class MyHome extends StatefulWidget { @override _AppState createState() => _AppState(); } TextEditingController controller = new TextEditingController(); class _AppState extends State<MyHome> { final GlobalKey<ScaffoldState> _scaffoldKey = new GlobalKey<ScaffoldState>(); @override Widget build(BuildContext context) { return Scaffold( key: _scaffoldKey, appBar: PreferredSize( preferredSize: Size(null, 180), child: CustomAppBar(_scaffoldKey, controller), ), drawer: createDrawer(), body: SingleChildScrollView( child: Container( color: Colors.black12, //=========Main Container For Scrollview==============// child: Padding( padding: const EdgeInsets.fromLTRB(0, 15, 0, 0), child: Column( children: <Widget>[ Container( //================Container for Categories==================// color: Colors.white, child: Padding( padding: const EdgeInsets.fromLTRB(15, 10, 15, 10), child: Row( mainAxisAlignment: MainAxisAlignment.spaceBetween, children: <Widget>[ Column( children: <Widget>[ CircleAvatar( backgroundImage: ExactAssetImage('images/user_icon.png'), minRadius: 20, maxRadius: 30, ), Text( 'Women', style: TextStyle( fontSize: 13, color: Colors.black, fontFamily: 'SFProRegular'), ) ], ), Column( children: <Widget>[ CircleAvatar( backgroundImage: ExactAssetImage('images/user_icon.png'), minRadius: 20, maxRadius: 30, ), Text( 'Women', style: TextStyle( fontSize: 13, color: Colors.black, fontFamily: 'SFProRegular'), ) ], ), Column( children: <Widget>[ CircleAvatar( backgroundImage: ExactAssetImage('images/user_icon.png'), minRadius: 20, maxRadius: 30, ), Text( 'Women', style: TextStyle( fontSize: 13, color: Colors.black, fontFamily: 'SFProRegular'), ) ], ), Column( children: <Widget>[ CircleAvatar( backgroundImage: ExactAssetImage('images/user_icon.png'), minRadius: 20, maxRadius: 30, ), Text( 'Women', style: TextStyle( fontSize: 13, color: Colors.black, fontFamily: 'SFProRegular'), ) ], ), ], ), ), ), Card( child: SizedBox( height: 200.0, child: Carousel( images: [ NetworkImage( 'https://cdn-images-1.medium.com/max/2000/1*GqdzzfB_BHorv7V2NV7Jgg.jpeg'), NetworkImage( 'https://cdn-images-1.medium.com/max/2000/1*wnIEgP1gNMrK5gZU7QS0-A.jpeg'), ], dotSize: 4.0, dotSpacing: 15.0, indicatorBgPadding: 5.0, borderRadius: false, )), ), GridView.count( shrinkWrap: true, primary: false, childAspectRatio: 4.0, // Create a grid with 2 columns. If you change the scrollDirection to // horizontal, this produces 2 rows. crossAxisCount: 2, // Generate 100 widgets that display their index in the List. children: List.generate(100, (index) { return Center( child: Text( 'Item $index', style: Theme.of(context).textTheme.headline, ), ); }), ) ], ), ), ), ), ); } }

以上是关于GridView.Count在不固定父容器高度的情况下不可见的主要内容,如果未能解决你的问题,请参考以下文章

如何使父容器的高度设置为固定 px 高度和子内容高度之间的最大值?

头尾固定高度中间高度自适应布局

在不知道盒子高度的时候,让盒子中的子元素垂直居中

布局:上下两个div高度固定,中间自适应

我如何拥有一个固定的右对齐容器并使用父级滚动?

固定容器高度的多行文字垂直居中