dart - Column 中的 Flutter 定位小部件

Question

我正在尝试通过将图像和文本包装在 Column 小部件中并将其放置在 Center 小部件中，将图像设置在 Column 的中心，并将 Text 设置在图像的底部。

不幸的是，它使 Column 居中并使 Image 位于屏幕中心上方。

我该如何解决？

我当前的代码：

  @override
  Widget build(BuildContext context) {
    return Container(
      decoration: BoxDecoration(color: Theme.of(context).primaryColor),
      child: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            Image.asset(ImagePaths.newLogoLogin),
            Text(Strings.beALocal)
          ],
        ),
      ),
    );
  }

标签： dartflutterflutter-layout

Answer 1

这可以使用Expanded小部件来实现：

@override
Widget build(BuildContext context) {
  return Container(
    decoration: BoxDecoration(color: Theme.of(context).primaryColor),
    child: Column(
      children: [
        Spacer(),
        Image.asset(ImagePaths.newLogoLogin),
        Expanded(
          Column(
             children: [ Text(Strings.beALocal) ],
             mainAxisAlignment: MainAxisAlignment.start
          )
        )
      ],
    ),
  );
}