【问题描述】:
我正在构建一个包含 TexField 列的可滚动表格的应用程序。
当我尝试编辑字段或滚动表时,我注意到性能受到了巨大影响。我该如何解决这个问题?
这是一个测试我的问题的示例应用
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
const MyApp({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
body: App(),
),
);
}
}
class App extends StatelessWidget {
List items = List.generate(3 * 48, (index) => Item(index));
@override
Widget build(BuildContext context) {
return SingleChildScrollView(
scrollDirection: Axis.horizontal,
child: Table(
border: TableBorder.all(),
defaultColumnWidth: FixedColumnWidth(100),
children: [
TableRow(
children: items
.map((item) =>
SizedBox(height: 48, child: Text(item.value.toString())))
.toList()),
...List.generate(
6,
(index) => TableRow(
children: items
.map((item) => SizedBox(
height: 48,
child: CellTextField(item: item, onChange: (_) {})))
.toList()))
],
),
);
}
}
class Item {
int value;
Item(this.value);
}
class CellTextField extends StatelessWidget {
final Item item;
final Function(num newValue) onChange;
CellTextField({Key? key, required this.item, required this.onChange})
: super(key: key);
@override
Widget build(BuildContext context) {
return TextField(
controller: TextEditingController(text: item.value.toString())
..selection =
TextSelection.collapsed(offset: item.value.toString().length),
onChanged: (newValue) {
try {
final _newValue = int.parse(newValue);
if (item.value != _newValue) {
onChange(_newValue);
}
} catch (e) {}
},
decoration: InputDecoration(
suffixText: '€',
),
);
}
}
© 版权声明
本站下载的源码均来自公开网络收集转发二次开发而来,
若侵犯了您的合法权益,请来信通知我们1413333033@qq.com,
我们会及时删除,给您带来的不便,我们深表歉意。
下载用户仅供学习交流,若使用商业用途,请购买正版授权,否则产生的一切后果将由下载用户自行承担,访问及下载者下载默认同意本站声明的免责申明,请合理使用切勿商用。
THE END
暂无评论内容