flutterx_table 1.0.6

flutterx_table: ^1.0.6 copied to clipboard

example/lib/main.dart

import 'dart:math';

import 'package:collection/collection.dart';
import 'package:flutter/material.dart';
import 'package:flutterx_live_data/flutterx_live_data.dart';
import 'package:flutterx_table/flutterx_table.dart';

void main() => runApp(const MyApp());

class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) => MaterialApp(
      debugShowCheckedModeBanner: false,
      title: 'Flutterx Table Demo',
      theme: ThemeData(primarySwatch: Colors.blueGrey),
      home: const TableExample());
}

class TableExample extends StatefulWidget {
  const TableExample({Key? key}) : super(key: key);

  @override
  State<TableExample> createState() => _TableExampleState();
}

class _TableExampleState extends State<TableExample> with StateObserver {
  static const letters = 'ABCDEFGHIKLMNOP'; // QRSTUVWXYZ
  static final columns = letters.split('').map((id) => TableColumn(id: id, label: Text(id))).toList(growable: false);
  final MutableLiveData<SortOptions?> _sortOptions = MutableLiveData();
  final List<int> _allItems = List.generate(200, (index) => index + 1);
  final LiveList<int> _items = LiveList();
  final LiveSet<int> _selection = LiveSet();
  final ScrollController _controllerX = ScrollController();
  final ScrollController _controllerY = ScrollController();
  final MutableLiveData<PageInfo> _pageInfo =
      MutableLiveData(initialValue: const PageInfo(page: 0, pageSize: 20, pageCount: 10));

  @override
  void registerObservers() => observe2<PageInfo, SortOptions?>(_pageInfo, _sortOptions, _computeItems);

  void _computeItems(PageInfo page, SortOptions? sort) => _items.setTo(_allItems
      .sorted((a, b) => sort?.order != SortOrder.desc ? a - b : b - a)
      .sublist(page.startIndex, min(page.endIndex, _allItems.length)));

  @override
  Widget build(BuildContext context) => Scaffold(
      appBar: AppBar(title: const Text('Table example')),
      body: SingleChildScrollView(
          child: Padding(
              padding: const EdgeInsets.all(32),
              child: Column(mainAxisSize: MainAxisSize.min, crossAxisAlignment: CrossAxisAlignment.start, children: [
                SizedBox(height: 500, child: _buildTable()),
                Card(child: Padding(padding: const EdgeInsets.all(8), child: PagingIndicator(pageInfo: _pageInfo))),
              ]))));

  @override
  void dispose() {
    _controllerX.dispose();
    _controllerY.dispose();
    super.dispose();
  }

  Widget _buildTable() => Card(
      child: ScrollableViewScrollbar.both(
          controllerX: _controllerX,
          controllerY: _controllerY,
          child: ScrollableView(
              controllerX: _controllerX,
              controllerY: _controllerY,
              matchContainerX: true,
              child: XRawTable<int>(
                  border: const TableBorder(horizontalInside: BorderSide(color: Colors.black38, width: .1)),
                  columns: columns,
                  defaultColumnWidth: const FixedColumnWidth(kMinInteractiveDimension * 2),
                  actions: TableActions<int, String>(
                      actions: const [
                        TableAction(actionId: 'DELETE', icon: Icon(Icons.delete)),
                        TableAction(actionId: 'DUPLICATE', icon: Icon(Icons.copy)),
                      ],
                      onAction: (id, item) {
                        switch (id) {
                          case 'DELETE':
                            _items.remove(item);
                            break;
                          case 'DUPLICATE':
                            _items.insert(item, item);
                            break;
                        }
                      }),
                  sortOptions: _sortOptions,
                  selection: TableSelection<int, int>(primaryKey: (item) => item, selection: _selection),
                  items: _items,
                  rowBuilder: (context, index, item) {
                    final color = Colors.primaries[index % Colors.primaries.length];
                    return List.generate(columns.length,
                        (col) => Text('${columns[col].id.toUpperCase()} $item', style: TextStyle(color: color)));
                  }))));

// LiveDataBuilder<Set>(
//     data: _selection,
//     builder: (context, selection) => DataTable(
//         sortColumnIndex: 2,
//         columns: columns
//             .map((e) => DataColumn(onSort: (index, ascending) {}, label: e.child!))
//             .toList(growable: false),
//         onSelectAll: (value) => value ?? false
//             ? _selection.setTo(_items.map((item) => item))
//             : _selection.clear(),
//         rows: items.mapIndexed((index, item) {
//           final color = Colors.primaries[index % Colors.primaries.length];
//           return DataRow(
//               selected: _selection.contains(item),
//               onSelectChanged: (value) =>
//                   value ?? false ? _selection.add(item) : _selection.remove(item),
//               cells: List.generate(
//                   columns.length,
//                   (col) => DataCell(Padding(
//                       padding: const EdgeInsets.all(8),
//                       child: Text('${columns[col].id.toUpperCase()} $item',
//                           style: TextStyle(color: color))))));
//         }).toList(growable: false))) ??

}