在颤动中自动缩放网格内的文本答案

【问题标题】：Auto scale text inside a grid in flutter在颤动中自动缩放网格内的文本
【发布时间】：2020-01-29 22:31:53
【问题描述】：

我正在尝试创建一个表格，其中文本自动缩放以适合单元格，但所有单元格将具有相同的文本大小，同时最大化字体大小。我试过 FittedBox 但它不会那样工作。任何想法如何进行？

class MyTable extends StatelessWidget {

  @override
  Widget build(BuildContext context) {
    return Container(
      child: Column(
        children: [
          Expanded(
            child: Row(
              children: [
                Expanded(child: Center(child: Text("R1C1: Some text1"))),
                Expanded(child: Center(child: Text("R1C2: Some text2"))),
                Expanded(child: Center(child: Text("R1C3: Some text3"))),
              ],
            ),
          ),
          Expanded(
            child: Row(
              children: [
                Expanded(child: Center(child: Text("R2C1: Some text4"))),
                Expanded(child: Center(child: Text("R2C2: Some text5"))),
                Expanded(child: Center(child: Text("R2C3: Some text6"))),
              ],
            ),
          ),
          Expanded(
            child: Row(
              children: [
                Expanded(child: Center(child: Text("R3C1: Some text7"))),
                Expanded(child: Center(child: Text("R3C2: Some text8"))),
                Expanded(child: Center(child: Text("R3C3: Some text9"))),
              ],
            ),
          ),
        ],
      ),
    );
  }
}

【问题讨论】：

标签： flutter flutter-layout

【解决方案1】：

我可以使用auto_size_text 包解决这个问题。我使用 group 来同步所有单元格的大小。

class MyTable extends StatelessWidget {
  final AutoSizeGroup myGroup = AutoSizeGroup();

  @override
  Widget build(BuildContext context) {
    return Container(
      child: Column(
        children: [
          Expanded(
            child: Row(
              children: [
                Expanded(
                  child: Center(
                    child: AutoSizeText(
                      "R1C1: Some text1",
                      style: TextStyle(fontSize: 50),
                      group: myGroup,
                    ),
                  ),
                ),
                Expanded(
                  child: Center(
                    child: AutoSizeText(
                      "R1C2: Some text2",
                      style: TextStyle(fontSize: 50),
                      group: myGroup,
                    ),
                  ),
                ),
...

【讨论】：