Flutter问题：Wrap组件无法使RichText换行后居中

问题原因 #

Wrap的居中属性是作用于子组件整体的，你这里Wrap只包裹了一个RichText，所以Wrap的居中仅让整个RichText容器居中，但RichText内部文本的换行对齐由自身textAlign属性控制，默认并非居中，导致换行后的第二行无法居中。

解决方案 #

移除多余的Wrap组件，给RichText添加textAlign: TextAlign.center属性，让文本内部自动换行并保持每行居中。

修改后的代码 #

Scaffold(
  backgroundColor: Colors.white,
  body: SafeArea(
    child: SingleChildScrollView(
      child: Center(
        child: SizedBox(
          width: screenWidth * 0.8,
          child: Column(
            mainAxisAlignment: MainAxisAlignment.center,
            crossAxisAlignment: CrossAxisAlignment.center,
            children: [
              Container(
                color: Colors.yellow,
                padding: const EdgeInsetsDirectional.only(start: 16.0),
                child: SizedBox(
                  width: double.infinity,
                  child: RichText(
                    textAlign: TextAlign.center, // 添加文本居中配置
                    text: TextSpan(
                      text: 'afda fd afd asf das fds',
                      children: [
                        TextSpan(
                          text: 'fda fda fd asfd sa',
                          style: TextStyle(
                            color: Theme.of(context).primaryColor,
                            decoration: TextDecoration.underline,
                          ),
                          recognizer: TapGestureRecognizer()
                            ..onTap = () {
                              print("tap");
                            },
                        ),
                        const TextSpan(
                          text: ' fdsa ',
                        ),
                        TextSpan(
                          text: 'fdsafdafda sf dsa',
                          style: TextStyle(
                            color: Theme.of(context).primaryColor,
                            decoration: TextDecoration.underline,
                          ),
                          recognizer: TapGestureRecognizer()
                            ..onTap = () async {
                              await launchUrl(Uri.parse('https://flutter.dev'));
                            },
                        ),
                      ],
                    ),
                  ),
                ),
              ),
            ],
          ),
        ),
      ),
    ),
  ),
)

补充说明 #

如果场景确实需要Wrap（比如包含多个子组件），则需让RichText宽度自适应内容（移除父级width: double.infinity的SizedBox），这样Wrap的居中属性才能作用于RichText的每一行内容；但针对单个RichText的换行需求，直接设置textAlign是最简洁的方案。

内容的提问来源于stack exchange，提问作者Rony Tesler