无法滚动列表视图的页面内容

时间:2018-11-24 12:54:14

标签: flutter

我是新手。我用列表项渲染页面。如果增加了列表项,则页面内容将溢出并且无法滚动。收缩包裹也不适用于脚手架

_buildOrderDetails(context,model)是一个使用listviewbuilder()动态生成的小部件。

这是我的_buildOrderDetails列表构建器的代码

Widget _buildOrderDetails(BuildContext context, MainModel model) {
Widget ordersCard;
List orderItems = model.currentOrder.items;
if(orderItems.length > 0) {
  ordersCard = ListView.builder(
    shrinkWrap: true,
    scrollDirection: Axis.vertical,
    itemCount: orderItems.length,
    itemBuilder: (BuildContext context, int index){
      return Dismissible(
        key: Key(index.toString()),
        onDismissed: (direction) {
          model.removeOrderItem(orderItems[index]);
          Scaffold.of(context)
            .showSnackBar(
              SnackBar(content: Text(orderItems[index].item.name)
            )
          );
        },
        background: Container(color: Colors.red),
        child: Card(
          child: Container(
            decoration: BoxDecoration(
              border: Border(
                top: BorderSide(
                  color: Theme.of(context).canvasColor
                )
              )
            ),
            padding: const EdgeInsets.symmetric(horizontal:5.0),
            child: Flex(
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              direction: Axis.horizontal,
              children: <Widget>[
                Container(
                  alignment: FractionalOffset(0.0, 0.0),
                  width: 100.0,
                  child: Column(
                    mainAxisAlignment: MainAxisAlignment.start,
                    children: <Widget>[
                      Container(
                        margin: EdgeInsets.only(bottom: 3.0),
                        alignment: FractionalOffset(0.0, 0.0),
                        child: Text(orderItems[index].item.name,
                          style: TextStyle(
                            fontSize: 16.0,
                            fontWeight: FontWeight.w600
                          )
                        ),
                      ),
                      Container(
                        alignment: FractionalOffset(0.0, 0.0),
                        child: Text('Regular',
                          style: TextStyle(
                            fontSize: 12.0
                          ),
                        ),
                      )
                    ],
                  ),
                ),
                Container(
                  child: Row(
                    children: [
                      RupeeWidget(),
                      Container(
                        alignment: FractionalOffset(1.0, 1.0),
                        width: 40.0,
                        child: Text(orderItems[index].item.price.toString())
                      )
                    ],
                  ),
                ),
                Container(
                  margin: EdgeInsets.symmetric(vertical: 5.0),
                  height: 30.0,
                  decoration: BoxDecoration(
                    border: Border.all(
                      color: Color.fromRGBO(37, 134, 16, 1.0),
                    ),
                    borderRadius: BorderRadius.circular(6.0)
                  ),
                  child: Row(
                    mainAxisAlignment: MainAxisAlignment.start,
                    children: <Widget>[
                      GestureDetector(
                        onTap: () {
                          model.decreaseOrderItemQuantity(orderItems[index]);
                        },
                        child: Container(
                          width: 25.0,
                          child: Text('-',
                          textAlign: TextAlign.center,
                            style: TextStyle(fontSize: 20.0),
                          )
                        ),
                      ),
                      Container(
                        color: Color.fromRGBO(37, 134, 16, 1.0),
                        height: 30.0,
                        width: 30.0,
                        alignment: FractionalOffset(0.5, 0.5),
                        child: Text(orderItems[index].quantity.toString(), 
                          style: TextStyle(color: Colors.white),
                        )
                      ),
                      GestureDetector(
                        onTap:() {
                          model.increaseOrderItemQuantity(orderItems[index]);
                        },
                        child: Container(
                          width: 25.0,
                          child: Text('+',
                          textAlign: TextAlign.center,
                            style: TextStyle(fontSize: 20.0),
                          )
                        ),
                      ),
                    ],
                  ),
                ),
                Container(
                  child: Row(
                    children: [
                      RupeeWidget(),
                      Container(
                        alignment: FractionalOffset(1.0, 1.0),
                        width: 40.0,
                        child: Text((orderItems[index].quantity*orderItems[index].item.price).toString())
                      )
                    ],
                  ),
                )
              ]
            )
          ),
        ),
      );
    }
  );
}
return  ordersCard;
}

 Widget _orderAmount(BuildContext context, MainModel model){
final gstValue = 0.0;
return Container(
  padding: const EdgeInsets.symmetric(vertical: 10.0, horizontal: 10.0),
  child: Column(
    children: [
      Container(
        alignment: FractionalOffset(0.0, 0.0),
        child: Text('Total',
          style: TextStyle(
            fontSize: 18.0,
            height: 1.5,
            color: Color.fromRGBO(0, 0, 0, 1.0)
          ),
        ),
      ),
      Container(
        padding: const EdgeInsets.symmetric(vertical: 3.0),
        child: Flex(
          mainAxisAlignment: MainAxisAlignment.spaceBetween,
          direction: Axis.horizontal,
          children: [
            Flexible(
              child: Text('Subtotal'),
            ),
            Row(
              children: [
                RupeeWidget(),
                Container(
                  alignment: FractionalOffset(1.0, 1.0),
                  width: 60.0,
                  child: Text(model.currentOrder.price.toString())
                )
              ],
            )
          ],
        ),
      ),
      Container(
        padding: const EdgeInsets.symmetric(vertical: 5.0),
        child: Flex(
          mainAxisAlignment: MainAxisAlignment.spaceBetween,
          direction: Axis.horizontal,
          children: [
            Flexible(
              child: Text('GST'),
            ),
            Row(
              children: [
                RupeeWidget(),
                Container(
                  alignment: FractionalOffset(1.0, 1.0),
                  width: 60.0,
                  child: Text(gstValue.toString())
                )
              ],
            )
          ],
        ),
      ),
      Container(
        padding: const EdgeInsets.symmetric(vertical: 5.0),
        decoration: BoxDecoration(
          border: Border(
            top: BorderSide(
              color: Color.fromRGBO(37, 134, 16, 1.0),
            )
          )
        ),
        child: Flex(
          mainAxisAlignment: MainAxisAlignment.spaceBetween,
          direction: Axis.horizontal,
          children: [
            Flexible(
              child: Text('Grandtotal'),
            ),
            Row(
              children: [
                RupeeWidget(),
                Container(
                  alignment: FractionalOffset(1.0, 1.0),
                  width: 60.0,
                  child: Text((model.currentOrder.price + 
     gstValue).toString())
                )
              ],
            )
          ],
        ),
      )
    ]
  ),
 );
}

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: Column(
        children: [
          Column(
            children: [
              _buildItemsTitle(),
              Expanded(child: _buildOrderDetails(context, model)),
            ]
          ),
          Card(child: _orderAmount(context, model),),
          RaisedButton(
            color: Theme.of(context).accentColor,
            onPressed: (){},
            child: Text('Checkout', 
              style: TextStyle(
                fontSize: 20.0,
                color: Colors.white
              )
            ),
          )
        ]
      ),
      floatingActionButton: FloatingActionButton(
        child: Text('Add Item',
          textAlign: TextAlign.center,
        ),
        onPressed: (){
          Navigator.pushNamed(context, '/');
        },
      ),
    );
  }
); 
}     
}

0 个答案:

没有答案