我试图通过根据屏幕分辨率调整宽度来使Flutter中的数据表更具响应性(例如:在浏览器中,它是默认宽度,在手机屏幕中,它的大小更小以适应屏幕)。我无法在网上找到任何结论性的东西,并且大多数Flex和响应表小部件选项仅在Flutter中的Table小部件中可用,而不是DataTable。
下面是我的代码是如何构造的一个片段:
SizedBox(
width: double.infinity,
child: SingleChildScrollView(
child: DataTable(
columnSpacing: 0.0,
columns: const [
DataColumn(
label: Text(
"First Name",
style: TextStyle(color: Colors.white),
),
),
DataColumn(
label: Text(
"Last Name",
style: TextStyle(color: Colors.white),
),
),
DataColumn(
label: Text(
"Username",
style: TextStyle(color: Colors.white),
),
),
DataColumn(
label: Text(
"Email ID",
style: TextStyle(color: Colors.white),
),
),
DataColumn(
label: Text(
"DOB",
style: TextStyle(color: Colors.white),
),
),
DataColumn(
label: Text(
"Account Type",
style: TextStyle(color: Colors.white),
),
),
DataColumn(
label: Text(
"Actions",
style: TextStyle(color: Colors.white),
),
),
DataColumn(
label: Text(
"Posts",
style: TextStyle(color: Colors.white),
),
),
],
rows: users
.map(
(user) => DataRow(
cells: <DataCell>[
DataCell(Text(user.first_name,
style: TextStyle(color: Colors.white))),
DataCell(Text(user.last_name,
style: TextStyle(color: Colors.white))),
DataCell(Text(user.username,
style: TextStyle(color: Colors.white))),
DataCell(Text(user.email,
style: TextStyle(color: Colors.white))),
DataCell(Text(user.date_of_birth,
style: TextStyle(color: Colors.white))),
DataCell(Text(user.account_type,
style: TextStyle(color: Colors.white))),
DataCell(
.
.
.
.
字符串
如果可能的话,我想继续使用DataTables作为这个应用程序,因为它比Table小部件更适合系统。
3条答案
按热度按时间rqenqsqc1#
你试过吗?
字符串
根据设备的不同,
jhkqcmku2#
几个星期前我也遇到过类似的问题。data_table_2插件可以让我解决这个问题。你的专栏根据屏幕分辨率的React更灵敏。
n8ghc7c13#
我已经用FittedBox,Expanded和Row Package 了DataTable,它可以工作。
字符串