Flutter开发：如何在Container下方添加文本？选Stack还是Children？

你不需要用Stack，Stack是用于组件层叠重叠的场景。要在目标Container下方垂直排列文本，用Column组件最合适，它能让子组件按垂直顺序排列。

修改后的完整代码如下：

class HomePage extends StatelessWidget{
  @override
  Widget build(BuildContext context) {
    return Scaffold( 
        appBar: AppBar(
          title: const Text("Welcome"),
          centerTitle: true,
          backgroundColor: Colors.black,
        ),      
        body: Container(      
          padding: const EdgeInsets.all(20),
          // 将原单个Container替换为Column，实现垂直布局
          child: Column(
            mainAxisAlignment: MainAxisAlignment.start,
            children: [
              // 保留原有的带按钮的Container
              Container( 
                height:200, 
                width:double.infinity,
                color: Colors.black,
                child: Center( 
                  child: ElevatedButton( 
                    child: const Text("Click Here"),
                    onPressed: () async {
                      const String url = "https://www.google.com/";
                      // 替换已废弃的API，使用新版url_launcher方法
                      if (await canLaunchUrl(Uri.parse(url))) {
                        await launchUrl(Uri.parse(url));
                      } else {
                        print("URL can't be launched.");
                      }
                    },
                  )
                ),
              ),
              // 添加间距避免文本紧贴Container
              const SizedBox(height: 20),
              // 这里是你要添加的文本内容
              const Text(
                "自定义的下方文本",
                style: TextStyle(fontSize: 16, color: Colors.black),
              )
            ],
          ),
        ) 
    );
  }
}

关键说明 #

• Column的children属性支持添加多个Widget，组件会按从上到下的垂直顺序排列，完全匹配你“在Container下方加文本”的需求。
• Stack是用于组件重叠显示的布局（比如文本覆盖在Container上），不符合你的场景。
• 额外提示：代码中原本的canLaunch和launch已被废弃，建议替换为canLaunchUrl和launchUrl，需要配合Uri.parse(url)使用以适配新版url_launcher库的API。

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