|
import 'package:flutter/material.dart';import 'package:provider/provider.dart';import 'package:syncfusion_flutter_datagrid/datagrid.dart';void main() { runApp(MyApp());}class MyApp extends StatelessWidget { @override Widget build(BuildContext context) { return MultiProvider( providers: [ ChangeNotifierProvider( create: (_) => EmployeeDataSource()) ], child: MaterialApp( title: 'Syncfusion DataGrid Demo', theme: ThemeData(primarySwatch: Colors.blue), home: SkyRocketingIssue(), ), ); }}class SkyRocketingIssue extends StatelessWidget { @override Widget build(BuildContext context) { return Consumer<EmployeeDataSource>( builder: (context, employeeDataSource, _) { return Scaffold( appBar: AppBar( title: Text('DataGrid Demo'), ), body: SfDataGrid( source: employeeDataSource, columnWidthMode: ColumnWidthMode.fill, selectionMode: SelectionMode.multiple, navigationMode: GridNavigationMode.cell, allowEditing: true, // controller: dataGridController, onQueryRowHeight: (details) { return details.rowHeight; }, columns: <GridColumn>[ GridTextColumn( columnName: 'id', label: Container( padding: EdgeInsets.all(16.0), alignment: Alignment.centerRight, child: Text( 'ID', ))), GridTextColumn( columnName: 'name', label: Container( padding: EdgeInsets.all(16.0), alignment: Alignment.centerLeft, child: Text('Name'))), GridTextColumn( columnName: 'designation', width: 120, label: Container( padding: EdgeInsets.all(16.0), alignment: Alignment.centerLeft, child: Text('Designation'))), GridTextColumn( columnName: 'salary', label: Container( padding: EdgeInsets.all(16.0), alignment: Alignment.centerRight, child: Text('Salary'))), ], ), ); }, ); }}/// Custom business object class which contains properties to hold the detailed/// information about the employee which will be rendered in datagrid.class Employee { /// Creates the employee class with required details. Employee(this.id, this.name, this.designation, this.salary); /// Id of an employee. int id; /// Name of an employee. String name; /// Designation of an employee. String designation; /// Salary of an employee. int salary;}/// An object to set the employee collection data source to the datagrid. This/// is used to map the employee data to the datagrid widget.class EmployeeDataSource extends DataGridSource { /// Creates the employee data source class with required details. EmployeeDataSource(){ employees = getEmployeeData(); buildDataGridRow(); } void buildDataGridRow() { dataGridRows = employees .map<DataGridRow>((e) => DataGridRow(cells: [ DataGridCell<int>(columnName: 'id', value: e.id), DataGridCell<String>(columnName: 'name', value: e.name), DataGridCell<String>( columnName: 'designation', value: e.designation), DataGridCell<int>(columnName: 'salary', value: e.salary), ])) .toList(); } List<Employee> employees = <Employee>[]; List<DataGridRow> dataGridRows = []; @override List<DataGridRow> get rows => dataGridRows; @override DataGridRowAdapter buildRow(DataGridRow row) { return DataGridRowAdapter( cells: row.getCells().map<Widget>((e) { return Container( alignment: (e.columnName == 'id' || e.columnName == 'salary') ? Alignment.centerRight : Alignment.centerLeft, padding: EdgeInsets.all(8.0), child: Text(e.value.toString()), ); }).toList()); } List<Employee> getEmployeeData() { return [ Employee(10001, 'James', 'Project Lead', 20000), Employee(10002, 'Kathryn', 'Manager', 30000), Employee(10003, 'Lara', 'Developer', 15000), Employee(10004, 'Michael', 'Designer', 15000), Employee(10005, 'Martin', 'Developer', 15000), Employee(10006, 'Newberry', 'Developer', 15000), Employee(10007, 'Balnc', 'Developer', 15000), Employee(10008, 'Perry', 'Developer', 15000), Employee(10009, 'Gable', 'Developer', 15000), Employee(10010, 'Grimes', 'Developer', 15000), Employee(10010, 'Lane', 'Project Lead', 20000), Employee(10010, 'Doran', 'Developer', 15000), Employee(10010, 'Betts', 'Developer', 15000), Employee(10010, 'Tamer', 'Manager', 30000), Employee(10001, 'James', 'Project Lead', 20000), Employee(10002, 'Kathryn', 'Manager', 30000), Employee(10003, 'Lara', 'Developer', 15000), Employee(10004, 'Michael', 'Designer', 15000), Employee(10005, 'Martin', 'Developer', 15000), Employee(10006, 'Newberry', 'Developer', 15000), Employee(10007, 'Balnc', 'Developer', 15000), Employee(10008, 'Perry', 'Developer', 15000), Employee(10009, 'Gable', 'Developer', 15000), Employee(10010, 'Grimes', 'Developer', 15000), Employee(10010, 'Lane', 'Project Lead', 20000), Employee(10010, 'Doran', 'Developer', 15000), Employee(10010, 'Betts', 'Developer', 15000), Employee(10010, 'Tamer', 'Manager', 30000), ]; }}
|
