RenderShrinkWrappingViewport 不支持返回固有维度

Question

我想要一个文本按钮，当点击显示一个带有 listView.builder 的 simpleDialog 但我不知道如何编码。我总是有错误。 你能帮帮我吗？

这是我的代码：

TextButton(
    child: const Text('Selet instruments needed'),
    onPressed: () {
      showDialog(
          context: context,
          builder: (BuildContext context) => SimpleDialog(
                  contentPadding: const EdgeInsets.all(15),
                  title: const Text('Select instruments needed'),
                  children: [
                    ListView.builder(
                        shrinkWrap: true,
                        itemCount: 2,
                        itemBuilder: ((context, index) {
                          return ListTile(
                              title: instrumentType[index]['name'],
                              onTap: () {});
                        }))
                  ]));
    })

Answer 1

您可以使用

ListView

小部件包装您的

SizedBox

并使用

LayoutBuilder

帮助获得约束

  TextButton(
        child: const Text('Selet instruments needed'),
        onPressed: () {
          showDialog(
            context: context,
            builder: (BuildContext context) => LayoutBuilder(
              builder: (context, constraints) => SimpleDialog(
                contentPadding: const EdgeInsets.all(15),
                title: const Text('Select instruments needed'),
                children: [
                  SizedBox(
                    height: constraints.maxHeight * .7, // 70% height
                    width: constraints.maxWidth * .9,
                    child: ListView.builder(
                      physics: NeverScrollableScrollPhysics(),
                      itemCount: 44,
                      itemBuilder: ((context, index) {
                        return ListTile(onTap: () {});
                      }),
                    ),
                  )
                ],
              ),
            ),
          );
        })

Answer 2

试试下面的代码：

void _show(BuildContext ctx) {
    showDialog(
      context: ctx,
      builder: (_) {
        return SimpleDialog(
          title: const Text('The Title'),
          children: [
            SimpleDialogOption(
              child: const Text('Option 1'),
              onPressed: () {
                // Do something
                print('You have selected the option 1');
                Navigator.of(ctx).pop();
              },
            ),
            SimpleDialogOption(
              child: const Text('Option 2'),
              onPressed: () {
                // Do something
                print('You have selected the option 2');
                Navigator.of(ctx).pop();
              },
            )
          ],
        );
      },
    );
  }

调用对话功能：

TextButton(
          child: const Text('Show The Simple Dialog'),
          onPressed: () => _show(context),
        ),

Answer 3

• 尝试在对话框中添加 Stepper() 时遇到此问题。

• 由于步进器的行为类似于 ListView，所以问题是相同的。

• 简单的解决方案是将 Stepper（或 ListView）包装在 SizedBox 中。

• 为所有可能的设备计算出正确的宽度和高度是不可行的，所以我们可以使用

  width: double.maxFinite

  和高度

  height: double.maxFinite

  让 Flutter 计算出来。

  showDialog(
    context: context,
    builder: (context) {
      return AlertDialog(
        title: Text("Test"),
        context: SizedBox(
          width: double.maxFinite,
          height: double.maxFinite,
          child: Stepper(
            currentStep: x, // your stepper index
            steps: [
              Step(...),
              Step(...),
            ],
            .... // Other Stepper properties
          ),
        ),
      );
    }
  );