flutter - Expanded() 小部件在 ListView 中不起作用

标签 flutter flutter-layout

我是 flutter 新手。我正在尝试渲染一个页面,其主体包含带有多个小部件的 Listview。

listview 中的

_buildOrderDetails 小部件是使用 listview.builder() 构建的小部件,其余的是普通小部件。

问题是页面没有滚动。 当主体 Listview 更改为列并且 _buildOrderDetails 作为 Expanded 的子级给出时, ListView 将限制在页面高度的一定范围内并滚动。但是当输入聚焦时,页面会溢出

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
          )
        ),
      )
    ]
  ),);});}}

最佳答案

也许它可以帮助将来的某人,但诀窍似乎是:使用 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
                  // ....

关于flutter - Expanded() 小部件在 ListView 中不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/53496449/

相关文章:

Flutter - 如何制作自定义 TabBar

android - 功能 SignInWithFacebook 在 Firebase Auth SDK for Flutter in macOS 中不存在,但在 Windows 中存在

flutter - 为什么扩展的小部件在将其发布到 Play 商店后会破坏我的 UI

flutter - 如何根据内容自动调整卡片 View 的大小

android - 提取到自定义小部件时,Flutter Drawer 延迟加载

Flutter RenderIndexedStack 对象在布局期间被赋予无限大小

dart - 如何在flutter中动态设置State变量?

flutter - 如何在 Flutter 的 Canvas 上绘制小部件?

widget - 如何在 Flutter 中禁用默认的 Widget 飞溅效果?

flutter - Flutter 是否支持 Android TV 和 Apple TV?