my datatable in flutter from json repeat the column headers

Solutions on MaxInterview for my datatable in flutter from json repeat the column headers by the best coders in the world

showing results for - "my datatable in flutter from json repeat the column headers"
Aoibhe
22 May 2017
1import 'package:flutter/material.dart';
2import 'dart:convert';
3import 'package:json_table/json_table.dart';
4
5class SimpleTable extends StatefulWidget {
6  @override
7  _SimpleTableState createState() => _SimpleTableState();
8}
9
10class _SimpleTableState extends State<SimpleTable> {
11  final String jsonSample =
12      '[{"equipe1":"PSG","equipe2":"DIJON","type_prono":"1N2"},{"equipe1":"MONACO","equipe2":"REIMS","type_prono":"1N2"},{"equipe1":"TOULOUSE","equipe2":"RENNES","type_prono":"1N2"},{"equipe1":"MONTPELLIER","equipe2":"STRASBOURG","type_prono":"1N2"},{"equipe1":"AMIENS","equipe2":"METZ","type_prono":"1N2"},{"equipe1":"BREST","equipe2":"ANGERS","type_prono":"1N2"},{"equipe1":"LORIENT","equipe2":"CHAMBLY","type_prono":"1N2"}]';
13  bool toggle = true;
14
15  @override
16  Widget build(BuildContext context) {
17    var json = jsonDecode(jsonSample);
18    return Scaffold(
19      body: Container(
20        padding: EdgeInsets.all(16.0),
21        child: toggle
22            ? Column(
23          children: [
24            JsonTable(
25              json,
26              showColumnToggle: true,
27              tableHeaderBuilder: (String header) {
28                return Container(
29                  padding: EdgeInsets.symmetric(
30                      horizontal: 8.0, vertical: 4.0),
31                  decoration: BoxDecoration(
32                      border: Border.all(width: 0.5),
33                      color: Colors.grey[300]),
34                  child: Text(
35                    header,
36                    textAlign: TextAlign.center,
37                    style: Theme.of(context).textTheme.display1.copyWith(
38                        fontWeight: FontWeight.w700,
39                        fontSize: 14.0,
40                        color: Colors.black87),
41                  ),
42                );
43              },
44              tableCellBuilder: (value) {
45                return Container(
46                  padding: EdgeInsets.symmetric(
47                      horizontal: 4.0, vertical: 2.0),
48                  decoration: BoxDecoration(
49                      border: Border.all(
50                          width: 0.5,
51                          color: Colors.grey.withOpacity(0.5))),
52                  child: Text(
53                    value,
54                    textAlign: TextAlign.center,
55                    style: Theme.of(context).textTheme.display1.copyWith(
56                        fontSize: 14.0, color: Colors.grey[900]),
57                  ),
58                );
59              },
60              allowRowHighlight: true,
61              rowHighlightColor: Colors.yellow[500].withOpacity(0.7),
62              paginationRowCount: 20,
63            ),
64            SizedBox(
65              height: 20.0,
66            ),
67            Text("Simple table which creates table direclty from json")
68          ],
69        )
70            : Center(
71          child: Text(getPrettyJSONString(jsonSample)),
72        ),
73      ),
74      floatingActionButton: FloatingActionButton(
75          child: Icon(Icons.grid_on),
76          onPressed: () {
77            setState(
78                  () {
79                toggle = !toggle;
80              },
81            );
82          }),
83    );
84  }
85
86  String getPrettyJSONString(jsonObject) {
87    JsonEncoder encoder = new JsonEncoder.withIndent('  ');
88    String jsonString = encoder.convert(json.decode(jsonObject));
89    return jsonString;
90  }
91}
92
93void main() => runApp(MyApp());
94
95class MyApp extends StatelessWidget { 
96  @override
97  Widget build(BuildContext context) {
98    return MaterialApp(
99      title: 'Flutter Demo',
100      theme: ThemeData(      
101        primarySwatch: Colors.blue,
102      ),
103      home: SimpleTable(),
104    );
105  }
106}
107