如何使小部件出现在行和列中下一个兄弟姐妹的顶部

Question

对于以前的兄弟姐妹来说，它有效。但是如何使小部件出现在

Row

和

Column

中的下一个兄弟姐妹的顶部？

我知道我可以通过将顶部的小部件移动到下一个兄弟姐妹并使其出现在前一个兄弟姐妹的顶部来强制使其工作，以达到相同的效果，但对我来说，

Row

和

Column

实际上是

Stack

，但只是孩子们流离失所，而不是具有相同

elevation

的扁平小部件。我希望我的理解是错误的。

  Widget _test() {
    return StackTappableOutside( // change to Stack for testing
      clipBehavior: Clip.none,
      children: [
        Container(
          child: FlutterLogo(size: 80),
          decoration: BoxDecoration(
            color: Colors.deepOrange,
            border: Border.all(color: Colors.yellow),
          ),
        ),
        Positioned(
          bottom: -22,
          // right: -22,
          child: TextButton(
            child: Text("Close me"),
            onPressed: () => print("You tapped me"),
          ),
        ),
      ],
    );
  }

  Widget _body() {
    // return Container(child: _test());
    return Column(
      mainAxisAlignment: MainAxisAlignment.start,
      children: [
        Container(child: _test(),key: Key('first'),),
        Container(child: _test(),key: Key('second'),),
        Container(child: _test(),key: Key('thrid'),),
        Container(child: _test(),key: Key('forth'),),
      ],
    );
}

Answer 1

您可以将

Transfrom.translate

、

Align

与

heightFactor

和

widthFactor

一起使用。

Align(
  alignment: Alignment.center,
  heightFactor: .7, // column
  widthFactor: .7, // for row
  child: Container(