为什么CrossAxisAligment在Flex,Row和Column中不起作用?

Shu*_*oni 0 dart flutter flutter-layout

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(
          'Flutter Demo'
        ),
      ),
      body: Row(
        mainAxisAlignment: MainAxisAlignment.center,
        crossAxisAlignment: CrossAxisAlignment.center,
        children: <Widget>[
          Text(
            'Hell World!'
          )
        ],
      )
    );
  }
}
Run Code Online (Sandbox Code Playgroud)

为什么文字Hell World只能水平居中,而不是我所指定的垂直CrossAxisAligment

是否因为这样:问题

Rém*_*let 7

Row默认情况下,不要占用所有可用的垂直空间。它仅占用所需的空间(但占用所有水平空间)。

强制行垂直扩展应该可以解决问题:

body: SizedBox.expand(
  child: Row(...),
),
Run Code Online (Sandbox Code Playgroud)

  • 那么 CrossAxisAligment 不能控制跨轴的东西有什么用呢? (2认同)
  • crossAxisAlignment`控制元素的位置,而不是行的大小。我们需要一个`crossAxisSize`,类似于`mainAxisSize`。但这并不存在,因为诸如“ CrossAxisAlignment.stretch”之类的对齐方式使行填充了垂直空间。 (2认同)
  • 这是有道理的..我们需要像“crossAxisSize”这样的东西 (2认同)