Flutter DataTable单元格文本在行内不换行

k5ifujac  于 2023-02-09  发布在  Flutter
关注(0)|答案(3)|浏览(356)

我尝试将dataTable放入行小部件中,但在执行此操作时丢失了单个单元格中的文本换行。

class Testing extends StatefulWidget {
  Testing({Key key}) : super(key: key);

  @override
  _MyDataTableState createState() => _MyDataTableState();
}

class _MyDataTableState extends State<Testing> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("DataTable"),
      ),
      body: SingleChildScrollView(        <-- Text wrapping goes away when wrapped in a Row()
        padding: const EdgeInsets.all(8.0),
        child: DataTable(
          // columnSpacing: 100,
          columns: [
            DataColumn(
              label: Container(
                width: 100,
                child: Text('Item Code'),
              ),
            ),
            DataColumn(
              label: Text('Stock Item'),
            ),
          ],
          rows: [
            DataRow(
              cells: [
                DataCell(
                  Text('Yup.  text.'),
                ),
                DataCell(
                  Text(
                      'This is a really long text. It\'s supposed to be long so that I can figure out what in the hell is happening to the ability to have the text wrap in this datacell.  So far, I haven\'t been able to figure it out.'),
                )
              ],
            ),
          ],
        ),
      ),
    );
  }
}

当 Package 在行中时,是否有一种方法可以保留DataTable固有的文本 Package ?

hi3rlvi2

hi3rlvi21#

也用Expanded包裹SingleChildScrollView

class Testing extends StatefulWidget {
  Testing({Key key}) : super(key: key);

  @override
  _MyDataTableState createState() => _MyDataTableState();
}

class _MyDataTableState extends State<Testing> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("DataTable"),
      ),
      body: Row(
        children: <Widget>[
          //TODO: use Expanded here
          Expanded(
            child: SingleChildScrollView(
              padding: const EdgeInsets.all(8.0),
              child: DataTable(
                // columnSpacing: 100,
                columns: [
                  DataColumn(
                    label: Container(
                      width: 100,
                      child: Text('Item Code'),
                    ),
                  ),
                  DataColumn(
                    label: Text('Stock Item'),
                  ),
                ],
                rows: [
                  DataRow(
                    cells: [
                      DataCell(
                        Text('Yup.  text.'),
                      ),
                      DataCell(
                        Text(
                            'This is a really long text. It\'s supposed to be long so that I can figure out what in the hell is happening to the ability to have the text wrap in this datacell.  So far, I haven\'t been able to figure it out.'),
                      )
                    ],
                  ),
                ],
              ),
            ),
          ),
        ],
      ),
    );
  }
}
r8uurelv

r8uurelv2#

我猜这是因为Row的自然工作方式。它需要尽可能多的可用水平轴。虽然mainAxisSize可以根据孩子配置(最小或最大),DataTable没有初始宽度,因此导致Text没有被 Package 。
为了快速修复,您可以将Data Table Package 在Container中,并给予它一个常量宽度。

在DartPad上进行快速测试:https://dartpad.dev/a664a29160b6e0443e9ca3bf28d5ec69
代码段:

class Testing extends StatefulWidget {
  Testing({Key key}) : super(key: key);

  @override
  _MyDataTableState createState() => _MyDataTableState();
}

class _MyDataTableState extends State<Testing> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("DataTable"),
      ),
      body: Row(
        children: [
          Container(
            width: 300, // Give the DataTable a const width.
            child: DataTable(
              columns: [
                DataColumn(
                  label: Container(
                    width: 100,
                    child: Text('Item Code'),
                  ),
                ),
                DataColumn(
                  label: Text('Stock Item'),
                ),
              ],
              rows: [
                DataRow(
                  cells: [
                    DataCell(
                      Text('Yup.  text.'),
                    ),
                    DataCell(
                      Wrap(
                        children: [
                          Text(
                              'This is a really long text. It\'s supposed to be long so that I can figure out what in the hell is happening to the ability to have the text wrap in this datacell.  So far, I haven\'t been able to figure it out.')
                        ],
                      ),
                    )
                  ],
                ),
              ],
            ),
          )
        ],
      ),
    );
  }
}
unftdfkk

unftdfkk3#

从今天早上起我就被一个类似的问题缠住了。
对我来说,DataColumn“label”Text没有换行,尽管DataRow单元格中的文本换行很好
在尝试了多种变体之后,这对我很有效。将标签文本放入Expanded中,并将softWraptext属性设置为true

DataTable(
      columns: [
        DataColumn(
            label: Expanded(
          child: Text(
            "Very long text goes here",
            softWrap: true,
          ),
        )),
      ],
      rows: [],
    );

相关问题