pluto_grid 1.1.1
pluto_grid: ^1.1.1 copied to clipboard

Flutter Android iOS Linux macOS web Windows

PlutoGrid is a dataGrid that can be controlled by the keyboard on desktop and web. Of course, it works well on Android and IOS. (DataGrid, DataTable, Data Grid, Data Table, Sticky)

PlutoGrid for flutter - v1.1.1 #

codecov


PlutoGrid is a dataGrid that can be controlled by the keyboard on desktop and web.
Of course, it works well on Android and IOS.


Demo Web #

You can try out various functions and usage methods right away.
All features provide example code.


Pub.Dev #

Check out how to install from the official distribution site.


Documentation #

The documentation has more details.


ChangeLog #

Please note the changes when changing the version of PlutoGrid you are using.


Issue #

Report any questions or errors.


Screenshots #

Frozen columns on the left and right.

PlutoGrid Nomal


PlutoGrid Select Popup


PlutoGrid Select Date


Cell renderer.

PlutoGrid Cell renderer


Multi select. (Cells or Rows)

PlutoGrid Multi select


Dual grid. (Moving between grids.)

PlutoGrid Dual grid


A Dark mode.

PlutoGrid Dual grid


Example #

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);
          }
        ),
      ),
    );
  }

Pluto series #

develop packages that make it easy to develop admin pages or CMS with Flutter.


Support #

Buy me a coffee


License #

MIT

69
likes
110
pub points
83%
popularity

Publisher

weblaze.dev

PlutoGrid is a dataGrid that can be controlled by the keyboard on desktop and web. Of course, it works well on Android and IOS. (DataGrid, DataTable, Data Grid, Data Table, Sticky)

Homepage
Repository (GitHub)
View/report issues

Documentation

API reference

License

MIT (LICENSE)

Dependencies

flutter, intl, linked_scroll_controller, pluto_filtered_list, pluto_inside, rxdart

More

Packages that depend on pluto_grid