Текст ячейки Flutter DataTable не переносится внутри строки - PullRequest
Новая
       12

Текст ячейки Flutter DataTable не переносится внутри строки

0 голосов
/ 22 января 2020

Я пытаюсь поместить 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.'),
                )
              ],
            ),
          ],
        ),
      ),
    );
  }
}

Есть ли способ сохранить перенос текста, свойственный DataTable, при переносе в строку?

Ответы [ 2 ]

1 голос
/ 22 января 2020

Wrap SingleChildScrollView с Expanded тоже. 

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.'),
                      )
                    ],
                  ),
                ],
              ),
            ),
          ),
        ],
      ),
    );
  }
}
0 голосов
/ 22 января 2020

Я думаю, это происходит из-за того, как Row естественным образом работает. Требуется столько, сколько доступно горизонтальной оси. Хотя mainAxisSize можно настроить (мин. Или макс.) В соответствии с дочерними параметрами, DataTable не имеет начальной ширины, поэтому Text не переносится.

Для быстрого исправления вы можете обернуть Data Table in 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.')
                        ],
                      ),
                    )
                  ],
                ),
              ],
            ),
          )
        ],
      ),
    );
  }
}
...