我正在尝试将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中固有的文本换行?
我想这是因为Row
的自然工作方式。它占用尽可能多的水平轴。尽管mainAxisSize
可以根据子级进行配置(最小或最大),但是DataTable
没有初始宽度,因此导致Text
没有被包装。
为了快速修复,您可以将Data Table
包裹在Container
中,并为其指定const宽度。
在DartPad上的快速测试: https://dartpad.dev/a664a29160b6e0443e9ca3bf28d5ec69
Snippet:
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.')
],
),
)
],
),
],
),
)
],
),
);
}
}