VivlaDataGrid

VivlaDataGrid is a lightweight Flutter package that wraps the DataTable widget into a more flexible and user-friendly component. It's perfect for applications requiring a clean and organized way to display tabular data.

Features

• Easy to configure and integrate.
• Customizable columns, rows, and overall table styling.
• Cross-platform compatibility with all Flutter-supported platforms.
• Lightweight implementation with no additional dependencies.

Usage Example

With just a few lines of code, you can display a data table in your Flutter application:

import 'package:flutter/material.dart';
import 'package:vivla_data_grid/vivla_data_grid.dart';
import 'dart:convert';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    List<Map<String, dynamic>> books = [];
    Map<String, dynamic> data = <String, dynamic>{};
    data['id'] = '11111';
    data['homeName'] = 'Saona';
    data['userName'] = 'Raul';
    data['bookFrom'] = '20/06/2023';
    data['bookTo'] = '20/06/2024';
    data['status'] = 'active';
    data['locker'] = true;
    books.add(data);

    Map<String, dynamic> data2 = <String, dynamic>{};
    data2['id'] = '2222';
    data2['homeName'] = 'Fir';
    data2['userName'] = 'Lau';
    data2['bookFrom'] = '26/06/2023';
    data2['bookTo'] = '26/06/2024';
    data2['status'] = 'active';
    data2['locker'] = true;
    books.add(data2);

    Map<String, dynamic> data3 = <String, dynamic>{};
    data3['id'] = '33333';
    data3['homeName'] = 'Nin';
    data3['userName'] = 'Oscar';
    data3['bookFrom'] = '16/06/2023';
    data3['bookTo'] = '16/06/2024';
    data3['status'] = 'canceled';
    data3['locker'] = false;
    books.add(data3);

    String jsonInput = jsonEncode(books);

    return MaterialApp(
      title: 'VivlaDataGrid Demo',
      home: Scaffold(
        appBar: AppBar(
          title: const Text('VivlaDataGrid Example'),
        ),
        body: Padding(
          padding: const EdgeInsets.all(16.0),
          child: VivlaDataGrid(inputData: jsonInput),
        ),
      ),
    );
  }
}