PlutoGrid is a dataGrid that can be controlled by the keyboard on desktop and web.
Of course, it works well on Android and IOS.
You can try out various functions and usage methods right away.
All features provide example code.
Check out how to install from the official distribution site.
The documentation has more details.
Please note the changes when changing the version of PlutoGrid you are using.
Report any questions or errors.
Generate the data to be used in the grid.
List<PlutoColumn> columns = [ /// Text Column definition PlutoColumn( title: 'text column', field: 'text_field', type: PlutoColumnType.text(), ), /// Number Column definition PlutoColumn( title: 'number column', field: 'number_field', type: PlutoColumnType.number(), ), /// Select Column definition PlutoColumn( title: 'select column', field: 'select_field', type: PlutoColumnType.select(['item1', 'item2', 'item3']), ), /// Datetime Column definition PlutoColumn( title: 'date column', field: 'date_field', type: PlutoColumnType.date(), ), /// Time Column definition PlutoColumn( title: 'time column', field: 'time_field', type: PlutoColumnType.time(), ), ]; List<PlutoRow> rows = [ PlutoRow( cells: { 'text_field': PlutoCell(value: 'Text cell value1'), 'number_field': PlutoCell(value: 2020), 'select_field': PlutoCell(value: 'item1'), 'date_field': PlutoCell(value: '2020-08-06'), 'time_field': PlutoCell(value: '12:30'), }, ), PlutoRow( cells: { 'text_field': PlutoCell(value: 'Text cell value2'), 'number_field': PlutoCell(value: 2021), 'select_field': PlutoCell(value: 'item2'), 'date_field': PlutoCell(value: '2020-08-07'), 'time_field': PlutoCell(value: '18:45'), }, ), PlutoRow( cells: { 'text_field': PlutoCell(value: 'Text cell value3'), 'number_field': PlutoCell(value: 2022), 'select_field': PlutoCell(value: 'item3'), 'date_field': PlutoCell(value: '2020-08-08'), 'time_field': PlutoCell(value: '23:59'), }, ), ];
Create a grid with the data created above.
@override Widget build(BuildContext context) { return Scaffold( appBar: AppBar( title: const Text('PlutoGrid Demo'), ), body: Container( padding: const EdgeInsets.all(30), child: PlutoGrid( columns: columns, rows: rows, onChanged: (PlutoGridOnChangedEvent event) { print(event); }, onLoaded: (PlutoGridOnLoadedEvent event) { print(event); } ), ), ); }
develop packages that make it easy to develop admin pages or CMS with Flutter.
MIT