Expanded() widget not working in listview

4,931

Maybe it can help someone in the future, but the trick seems to be: use ListView + LimitedBox(maxHeight) + Column ...

 ListView( 
      padding: EdgeInsets.zero,
      shrinkWrap: true,
      children: [
        FocusTraversalGroup(
          child: Form(
            key: _formKey,
            child: LimitedBox(
              maxHeight: MediaQuery.of(context).size.height,
              child: Column(
                // mainAxisSize: MainAxisSize.min,
                mainAxisAlignment: MainAxisAlignment.center,
                children: <Widget>[
                  Spacer(flex: 30), // Or Expanded
                  // More Widgets...
                  Spacer(flex: 70), // Or Expanded
                  // ....
Share:
4,931
KURRU HEM
Author by

KURRU HEM

Updated on December 07, 2022

Comments

  • KURRU HEM
    KURRU HEM about 2 months

    I'm new to flutter. I'm trying to render a page whose body contains Listview with multiple widgets.

    _buildOrderDetails widget in the listview is widget that is build with listview.builder() , remaining are normal widgets.

    The problem is page is not being scrolled . When the body Listview is changed to column and _buildOrderDetails is given as child to the Expanded, the listview is limited to some extent of the page height and being scrolled. But when input is focused the page is overflowed

    Widget build(BuildContext context){
    return ScopedModelDescendant<MainModel>(
     builder: (BuildContext context, Widget child, MainModel model) {
      return Scaffold(
      appBar: AppBar(
        title: Text('Order Details'),
        actions: <Widget>[
          IconButton(
            onPressed: () {
              model.addNewOrder();
            },
            icon: Icon(Icons.add),
          ),
          BadgeIconButton(
            itemCount: model.ordersCount,
            badgeColor: Color.fromRGBO(37, 134, 16, 1.0),
            badgeTextColor: Colors.white,
            icon: Icon(Icons.shopping_cart, size: 30.0,),
            onPressed: () {}
          ),
        ]
      ),
      body: ListView(
        children: [
          Column(
            children: [
              _buildItemsTitle(),
              Expanded(child: _buildOrderDetails(context, model)),
            ]
          ),
          Card(
                child: Column(
                  children:[
                    TextField(
                      decoration: InputDecoration(
                        labelText: 'Offer Code'
                      ),
                    ),
                    RaisedButton(
                      onPressed: (){},
                      child: Text('Apply'),
                    )
                  ]
                ),
              ),
          Card(child: _orderAmount(context, model),),
          RaisedButton(
            color: Theme.of(context).accentColor,
            onPressed: (){},
            child: Text('Checkout', 
              style: TextStyle(
                fontSize: 20.0,
                color: Colors.white
              )
            ),
          )
        ]
      ),);});}}
    
    • rmtmckenzie
      rmtmckenzie about 4 years
      Please format your code before posting, and try to create a minimal example that shows your problem instead of just pasting a mess of code that anyone who would help you has to sort through.
  • dcg
    dcg 10 months
    I had never heard of this widget! neat! Thanks for sharing!