Flutter Alertdialog 溢出截止

Question

我有一个正在运行的 Alertdialog，但我收到了一个溢出错误，而且我无法摆脱它。我试过灵活和扩展，但可能在错误的水平上。

builder: (BuildContext context) => AlertDialog(
                          title: const Center(child: Text('Completing task')),
                          content: Row(
                            mainAxisAlignment: MainAxisAlignment.center,
                            children: [
                              UnconstrainedBox(
                                child: Flexible(
                                  child: Column(
                                    children: [
                                      Text('Tag: ' + task.tag),
                                      Text("rrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrr"),
                                      const SizedBox(height: 10),
                                      const Text('Waiting for NFC'),
                                      const SizedBox(height: 20),
                                      const Center(
                                        child: CircularProgressIndicator(
                                          color: Colors.grey,
                                        ),
                                      ),
                                    ],
                                  ),),
                              ),
                            ],
                          ),

Answer 1

     Container(
              child: Text('text',              
                overflow: TextOverflow.fade,
                maxLines: 1,
                softWrap: false,
              ),             
              width: 50,
      ),

Answer 2

SizedBox(
          width: YourOwnWidth,
          child: Text("rrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrr",style: TextStyle(
            overflow: TextOverflow.clip
          ),),
        );

您可以使用的简单解决方案

Answer 3

这里的问题是文本太长。如果您希望显示所有文本而不溢出布局，那么 Flexible 是一个选项。当显示的文本可能比视图的宽度长时，用 Flexible 包裹 Text 元素。

请注意，我必须从视图中删除一些不必要的元素。这些元素 misplaced/misused 适用于这种情况，并且增加了问题。

还有其他方法可以解决这个问题，但我喜欢 （双关语） 这个选项非常灵活，无需计算或猜测 width/height.

这是一个解决方案，其中的代码经过了一些清理，并在长文本元素上使用了 Flexible。

showDialog(
    context: context, 
    builder: (BuildContext context) {
        return AlertDialog(
                title: const Center(child: Text('Completing task')),
                content: Column(
                    mainAxisAlignment: MainAxisAlignment.center,
                    children: [
                        Text('Tag: P1348'),
                        Flexible(child: Text("rrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrr"),),
                        const SizedBox(height: 10),
                        const Text('Waiting for NFC'),
                        const SizedBox(height: 20),
                        const Center(
                            child: CircularProgressIndicator(
                                color: Colors.grey,
                            ),
                        ),
                    ],
                )
        );
    }
);

Flutter Alertdialog 溢出截止

Flutter Alertdialog overflow cutoff

android-alertdialog

flutter