【问题标题】:Flutter insert ListView inside showGeneralDialogFlutter 在 showGeneralDialog 中插入 ListView
【发布时间】:2020-04-01 18:08:05
【问题描述】:

Flutter 中,我想在showGeneralDialog 对话框中显示简单的ListView。但我得到这个错误:

RenderBox was not laid out: RenderFittedBox#d8a97 relayoutBoundary=up1
'package:flutter/src/rendering/box.dart':
Failed assertion: line 1694 pos 12: 'hasSize'

showGeneralDialog(
    barrierLabel: "Label",
    barrierDismissible: true,
    barrierColor: Colors.black.withOpacity(0.5),
    transitionDuration: const Duration(milliseconds: 700),
    context: context,
    pageBuilder: (context, anim1, anim2) {
      return Align(
        alignment: Alignment.center,
        child: BuildPagesPopupMenu(),
      );
    },
),

class BuildPagesPopupMenu extends StatelessWidget {
  final List<MenuItems> _menuItems = [
    MenuItems(menuTitle: 'test1 ', icon: Icons.settings),
    MenuItems(menuTitle: 'test2 ', icon: Icons.list),
  ];

  @override
  Widget build(BuildContext context) {
    return Column(
      children: <Widget>[
        Expanded(
          child: ListView.separated(
            itemBuilder: (context, index) {
              return ListTile(
                title: Text(_menuItems[index].menuTitle),
                leading: Icon(_menuItems[index].icon),
              );
            },
            separatorBuilder: (context, builder) {
              return const Divider();
            },
            itemCount: _menuItems.length,
          ),
        ),
      ],
    );
  }
}

class MenuItems {
  final String menuTitle;
  final IconData icon;

  MenuItems({@required this.menuTitle, @required this.icon});
}

【问题讨论】:

  • final List&lt;MenuItems&gt; items = [MenuItems(menuTitle: 'test1 ', icon: Icons.settings), MenuItems(menuTitle: 'test2 ', icon: Icons.list),]; showGeneralDialog( barrierLabel: "Label", barrierDismissible: true, barrierColor: Colors.black.withOpacity(0.5), transitionDuration: const Duration(milliseconds: 700), context: context, pageBuilder: (context, anim1, anim2) =&gt; SimpleDialog( title: Text('menu'), shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(12)), children: items.map((e) =&gt; ListTile( title: Text(e.menuTitle), leading: Icon(e.icon), )).toList(), ), );
  • @pskink 是的,但我使用了另一种解决方案

标签: flutter flutter-layout flutter-dialog


【解决方案1】:

要解决该错误,您需要为 Expanded 小部件内的 ListView 提供大小。

我建议你将你的 ListView 包裹在一个 SizedBox 中并给它一个高度。

例子:

 Expanded(
      child: SizedBox(
       height: 200.0,
       child: ListView.separated(
        itemBuilder: (context, index) {
          return ListTile(
            title: Text(_menuItems[index].menuTitle),
            leading: Icon(_menuItems[index].icon),
          );
        },
        separatorBuilder: (context, builder) {
          return const Divider();
        },
        itemCount: _menuItems.length,
      ),
     ), 
    ),

【讨论】:

  • 你可以尝试用脚手架将你的列包装在 BuildPagesPopupMenu 中吗?并将柱子放在脚手架的主体内
猜你喜欢
  • 1970-01-01
  • 2021-02-13
  • 2023-04-09
  • 2017-12-20
  • 2021-11-08
  • 2019-08-09
  • 1970-01-01
  • 2016-06-24
  • 1970-01-01
相关资源
最近更新 更多