带有 CrossAxisAlignment.stretch 的 Flutter Row 会抛出错误 BoxConstraints 强制无限高度

Question

不知道为什么会引发错误

BoxConstraints forces an infinite height

 return Scaffold(
  body: Column(
    children: <Widget>[
      Row(
        mainAxisAlignment: MainAxisAlignment.center,
        crossAxisAlignment: CrossAxisAlignment.stretch,
        children: <Widget>[
           Text('OK'),
           Text('Then')
       ],
      )
    ],
  ),
);

没有

CrossAxisAlignment.stretch

没有问题，但我需要行中的元素从屏幕顶部一直延伸到底部。

尝试在各个文本小部件周围或包含文本小部件的列周围使用

Expanded

时，我遇到了相同的错误。

Answer 1

这不会引发错误

return Scaffold(
  body: Column(
    children: <Widget>[
      Expanded(
          child: Row(
        mainAxisAlignment: MainAxisAlignment.center,
        crossAxisAlignment: CrossAxisAlignment.stretch,
        children: <Widget>[Text('OK'), Text('Then')],
      ))
    ],
  ),
);

更新： 如果您想伸展您的

Text

- 我认为，您不需要

Column

return Scaffold(
  body: Row(
    mainAxisAlignment: MainAxisAlignment.center,
    crossAxisAlignment: CrossAxisAlignment.stretch,
    children: <Widget>[
      Container(
        alignment: Alignment.center,
        child: Text('OK'),
      ),
      Container(
        alignment: Alignment.center,
        child: Text('Then'),
      ),
    ],
  ),
);

Answer 2

将 CrossAxisAlignment.stretch 移至列。

Column(
    mainAxisAlignment: MainAxisAlignment.center,
    crossAxisAlignment: CrossAxisAlignment.stretch,
    children: <Widget>[
      Row(
        mainAxisAlignment: MainAxisAlignment.center,
        children: <Widget>[Text('OK'), Text('Then')],
      )
    ],
  ),

让元素从上到下延伸重新组织一切

Column(
    mainAxisAlignment: MainAxisAlignment.center,
    children: <Widget>[
      Expanded(
          child: Row(
        mainAxisAlignment: MainAxisAlignment.center,
        children: <Widget>[
          Container(
            color: Colors.amber,
            child: Align(child: Text('OK')),
          ),
          Container(
              color: Colors.amberAccent, 
              child: Align(child: Text('Then')))
        ],
      ))
    ],
  ),

刚刚看到安德烈的回答并意识到你甚至不需要 CrossAxisAlignment.stretch

  Column(
    mainAxisAlignment: MainAxisAlignment.center,
    children: <Widget>[
      Expanded(
          child: Row(
        mainAxisAlignment: MainAxisAlignment.center,
        children: <Widget>[
          Container(
            height: double.infinity,
            color: Colors.amber,
            child: Align(child: Text('OK')),
          ),
          Container(
              height: double.infinity,
              color: Colors.amberAccent,
              child: Align(child: Text('Then')))
        ],
      ))
    ],
  ),

Answer 3

首先将

Row

包裹在

IntrinsicHeight

中。

IntrinsicHeight(
  child: Row(
    mainAxisAlignment: MainAxisAlignment.center,
    crossAxisAlignment: CrossAxisAlignment.stretch,
    children: <Widget>[Text('OK'), Text('Then')],
  ),
),