Flutter开发：如何在Row组件中对齐Text组件并实现文本居中展示

问题1：Row组件中多个子组件对齐方法 #

• 直接修改Row组件的crossAxisAlignment属性即可控制子元素在纵轴的对齐规则，常用配置如下：
  • CrossAxisAlignment.center：纵向居中对齐
  • CrossAxisAlignment.start：顶部对齐
  • CrossAxisAlignment.end：底部对齐
• 如果你需要调整Row内部单个Text的对齐规则，可以给Text外层套Align组件指定对齐参数。

问题2：hello world文本居中展示方法 #

• 方案1：给Text的父容器Container设置alignment: Alignment.center，让子元素在容器内居中
• 方案2：直接给Text外层套Center组件
• 如果需要文本内部多行居中，可给Text组件设置textAlign: TextAlign.center属性

实现效果 #

完整可运行示例代码 #

import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:get/get_navigation/src/root/get_material_app.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return GetMaterialApp(
      debugShowCheckedModeBanner: false,
      home: HomeView(),
      themeMode: ThemeMode.system,
    );
  }
}

class HomeView extends StatelessWidget {
  @override 
  Widget build(BuildContext context) {
    return Scaffold( 
      appBar: AppBar(title: const Text("Demo App"),),
      body: SafeArea(
        child: Container(
          // 配置Row纵轴对齐规则，实现两个子组件居中对齐
          child: Row(
            crossAxisAlignment: CrossAxisAlignment.center,
            children: const [
              WidgetTwo(),
              WidgetOne(),
            ],
          ),
        )
      ),
    );
  }
}

class WidgetOne extends StatelessWidget {
  const WidgetOne({super.key});

  @override
  Widget build(BuildContext context) {
    return Container(
      child: Column(
        mainAxisSize: MainAxisSize.min,
        children: const [
          Text("aaa"),
          Text("bbb"),
          Text("ccc"),
          Text("ddd"),
          Text("eee"),
        ],
      )
    );
  }
}

class WidgetTwo extends StatelessWidget {
  const WidgetTwo({super.key});

  @override
  Widget build(BuildContext context) {
    // 配置容器对齐属性，实现Hello World文本居中
    return Container(
      padding: const EdgeInsets.symmetric(horizontal: 20),
      alignment: Alignment.center,
      child: const Text("Hello World!"),
    );
  }
}

内容的提问来源于stack exchange，提问作者Dmitry Bubnenkov