mahop_data_table 0.0.0-alpha.2

Collection of Flutter Widgets to display a DataTable, TreeView, TreeListView, ListView and GridView with many options, editing, advanced drag and drop support and much more.

(Last Update of this info: 28th of April 2024)

DataTable and more - What is included?

• Collection of widgets to display a DataTable, TreeView, TreeListView (hierachical DataTable), ListView and GridView
• Virtual Scrolling

WARNING! Status of this project is ALPHA!

This package is in ALPHA state right now! APIs, Interfaces and names will still change in future versions! Existing features are NOT testet completely. New features will be added until version 1.0!

DON'T USE FOR PRODUCTION until Version 1.0!

Demos and Sample Code

• See https://flutterdemo.mahop.net
• Or https://flutter.mahop.net

Screenshot of the fist sample

Contribute

• Test the code and provide sugesstions
• Like the project on pub.dev
• You can support development buying one or more glasses of orange juice. (or cups of coffee)
  • https://www.buymeacoffee.com/mahop

Next Steps

• We will create a GitHub project and start the community
• We will work on DataTable to build in some more features
• Next will be TreeView
• And GridView
• and the others are following...

License

• Until we reach Version 1.0 you can use this code unter the 3-Clause BSD License.
  • see: https://opensource.org/license/bsd-3-clause/
• With version 1.0+
  • For open source and private projects this library is for free.
  • For commercial use you have to buy one of our commercial licenses.
  • See: https://flutter.mahop.net

Package discription

A Flutter widget to display a DataTable, TreeView, TreeListView, ListView and GridView with many options and advanced drag and drop and selection support.

Since 30+ years we develop business apps at MaHop.Net. After many years and a couple of apps, used by 10.000+ Users on a dayly basis, for 2, 4 or even more hours a day we learned the following:

What are the three most important things in complex business apps?

Preformance, performance and performance! :-)

Of course you need a good looking and intuitiv UI and well shaped functionality and so on, but if you provide all this the users will (in the end) complain about performance.

=> Dart and Flutter is very good in performance and the MaHopDataView Widgets can help you to keep this good performance, even if your datasets are large and/or growing...

Features

• Perfect virtual scrolling using flutters TwoDimensionalScrollView

  • Display a million and more rows with high performance
  • Display rows with different RowHeights

• Advanced Drag and Drop

  • Reordering (built in)
  • Multi Drag and Drop (also for reordering)
  • Drag and Drop to and from other Widgets
    • from DataTable to and from another DataTable
    • from DataTable to and from a TreeView
    • from DataTable to a Flutter DropTarget
    • from GridView to and from a ListView
    • ... and so on ...
  • Auto scrolling during drag and drop

• Column resize and reorder on DataTable and TreeListView

  • Saving the current state as JSON string
  • Applying as saved state from JSON string

• JumpTo(item) with height performance

• Selection

  • Single selection
  • CheckBox selection (mutliple items)
  • Extended selection - for Desktop with Mouse click + shift and/or ctrl keys (multiple items)
    • Extended selection can be combined with CheckBox selection

• And more to come in the next versions...

Getting started

Or Widget is NOT designed to be used in a few minutes. You should definitely read the docu first! You need to be prepared for good performance to get good performance...

Usage

  // ----------------------------------------------
  // - Sample build function - very simple usecase
  // ----------------------------------------------
  Widget buildMhItemsView(BuildContext context) {

    // --------------------------------------------
    // - Build some sample data
    // --------------------------------------------
    final List<ExampleItem> items = [];
    for (var i = 1; i <= 100; i++) {
      items.add(ExampleItem(text: "Example Item $i", index: i));
    }

    // --------------------------------------------
    // - Build the Column definitions you need
    // --------------------------------------------
    List<MhItemsViewColumnDef<ExampleItem>> columnDefs = [];
    columnDefs.add(MhItemsViewColumnDef<ExampleItem>(id: "index", header: "Index", columnWidth: 50, getDisplayValue: (item) => item.index));
    columnDefs.add(MhItemsViewColumnDef<ExampleItem>(id: "text", header: "Text", columnWidth: 250, getDisplayValue: (item) => item.text));
    columnDefs.add(MhItemsViewColumnDef<ExampleItem>(id: "calculated", header: "Calculated", columnWidth: 250, getDisplayValue: (item) => item.index * item.index));

    // --------------------------------------------
    // - apply needed settings
    // --------------------------------------------
    final settings = MhItemsViewSettings(rowHeight: 25, headerHeight: 30, displayHeader: true);

    return MhItemsView(itemsSource: items, columnDefs: columnDefs, settings: settings),
  };

Additional information

See https://flutter.mahop.net to learn more about the widget and see Demos. (Documentation will be done as soon as possible...)