flutter - 如何在 flutter 中制作可滚动框？

Question

我有一个 Card 小部件，它看起来像:

但是当其中的数字变大时，它会像这样溢出Card:

我试图将文本框包裹在 SizedBox 中并给它一个高度。然后，将其包装在 SingleChildScrollView 中，但没有帮助。我该如何解决？

代码如下:

Card(
 child: Container(
  padding: const EdgeInsets.all(8.0),
  width: 300,
  height: 250,
  child: Column(
    children: <Widget>[
      const Text('Output', style: TextStyle(fontSize: 25)),
      const SizedBox(height: 10),
      getOutputRow('Answer'),
    ],
  ),
),

辅助方法:

  Text styledText(String data) {
    return Text(data, style: TextStyle(fontSize: 20));
  }

  Widget getOutputBox() {
    final themeData = Theme.of(context);
    final output = result == null ? '' : result.toString();

    return Container(
      width: 150,
      padding: const EdgeInsets.all(8.0),
      decoration: BoxDecoration(border: Border.all(width: 1, color: themeData.primaryColor)),
      child: Text(output, style: TextStyle(fontSize: 16), textAlign: TextAlign.center),
    );
  }

  Row getOutputRow(String data) {
    return Row(
      mainAxisAlignment: MainAxisAlignment.spaceAround,
      crossAxisAlignment: CrossAxisAlignment.center,
      children: <Widget>[
        styledText(data),
        styledText('='),
        getOutputBox(),
      ],
    );
  }

Answer 1

SizedBox(
height : 400,
width : 400,
child : SingleChildScrollView(
   child : getOutputRow('Answer')
)
)