apptomate_custom_data_table 0.0.1

An enhanced DataTable widget with customizable styling and layout options for Flutter applications.

CustomDataTable Widget

An enhanced DataTable widget with customizable styling and layout options for Flutter applications.

Features

• Customizable Appearance:
  • Configurable heading row color
  • Adjustable column spacing
  • Customizable row height
• Flexible Data Display:
  • Dynamic columns and rows
  • Optional checkbox column
• Improved Layout Control:
  • Consistent column spacing
  • Fixed row heights for predictable rendering

Installation

Add the dependency to your pubspec.yaml:

dependencies:
  apptomate_custom_data_table: ^0.0.1

Basic Usage

CustomDataTable(
  columns: [
    DataColumn(label: Text('Name')),
    DataColumn(label: Text('Age')),
    DataColumn(label: Text('Role')),
  ],
  rows: [
    DataRow(cells: [
      DataCell(Text('John Doe')),
      DataCell(Text('32')),
      DataCell(Text('Developer')),
    ]),
    DataRow(cells: [
      DataCell(Text('Jane Smith')),
      DataCell(Text('28')),
      DataCell(Text('Designer')),
    ]),
  ],
)

Advanced Usage

CustomDataTable(
  showCheckboxColumn: true,
  headingRowColor: Colors.blueGrey[100],
  columnSpacing: 24.0,
  dataRowHeight: 56.0,
  columns: [
    DataColumn(label: Text('Product', style: TextStyle(fontWeight: FontWeight.bold))),
    DataColumn(label: Text('Price', style: TextStyle(fontWeight: FontWeight.bold))),
    DataColumn(label: Text('Stock', style: TextStyle(fontWeight: FontWeight.bold))),
  ],
  rows: products.map((product) => DataRow(
    cells: [
      DataCell(Text(product.name)),
      DataCell(Text('\$${product.price}')),
      DataCell(Text(product.stock.toString())),
    ],
  )).toList(),
)

Parameters

Parameter	Type	Default	Description
columns	List<DataColumn>	Required	List of column definitions
rows	List<DataRow>	Required	List of data rows
showCheckboxColumn	bool	false	Whether to show selection checkboxes
headingRowColor	Color	Colors.grey	Background color for header row
columnSpacing	double	12.0	Space between columns
dataRowHeight	double	48.0	Height of each data row

Customization Options

1. Header Styling:

   headingRowColor: Colors.blue[50],
   

2. Row Selection:

   showCheckboxColumn: true,
   

3. Layout Control:

   columnSpacing: 20.0,  // Increase space between columns
   dataRowHeight: 60.0,  // Taller rows
   

Best Practices

1. For large datasets, consider implementing pagination
2. Use consistent column widths for better alignment
3. Combine with SingleChildScrollView for horizontal scrolling

Dependencies

• Flutter SDK (requires material.dart)