如何居中对齐堆叠元素，以及如何水平拉伸？

debugcn 发表于 Dev

赫马爹利

早上好。我正在尝试创建此屏幕。有两个问题：

1）我无法将绿色水平线拉伸到整个宽度。这是我的代码，或多或少：

Scaffold(
  Stack(
    Center(
      Column(
      ...
      ),
    ),
    Align(
      alignment: Alignment.center,
      child: Image(
        image: AssetImage('assets/load_line.png'),
        fit: BoxFit.fitWidth,
      ),
    ),

而这正是我的代码是给我。似乎某处有填充或边距，但我找不到它。

2）正如您在我的第一个屏幕截图中看到的那样，我需要徽标和水平线使一个在另一个顶部居中，但它们显然没有对齐。我想使用单个图像，但我担心拉伸会破坏它。我该怎么做才能达到这个结果？

谢谢大家。

警察在路上

你可以试试这个方法。

Widget build(BuildContext context) {
  return Scaffold(
    backgroundColor: Colors.green,
    appBar: AppBar(title: Text("Title")),
    body: Stack(
      children: <Widget>[
        Align(child: Image.asset("assets/images/profile.jpg")),
        Align(child: Container(height: 1, color: Colors.black12)),
        Align(
          alignment: Alignment(0.0, 0.2),
          child: Column(
            mainAxisSize: MainAxisSize.min,
            children: <Widget>[
              Text("Your first text here!"),
              Text("Your second text here"),
              Text("Your third text here!"),
            ],
          ),
        )
      ],
    ),
  );
}

输出