如何在数据表的第一行插入数据行？

Question

i have a DataTable, where i want to add Rows. The Code works, but the Data Row gets add below the last Data Row. I want to add a Row at the top. I used list.insert(0, element) but it didnt work.

This is my Code so far:

class _TabelleState extends State<Tabelle> {

  List<DataRow> _rowList = [
    DataRow(
        cells: <DataCell>[
      DataCell(Datum()),
      DataCell(UebungWidget()),
      DataCell(UebungWidget()),
      DataCell(UebungWidget()),
    ]),
  ];
  
  void _addRow() {
    setState(() {
      _rowList.insert(0, (DataRow(
          cells: <DataCell>[
        DataCell(Datum()),
        DataCell(UebungWidget()),
        DataCell(UebungWidget()),
        DataCell(UebungWidget()),
      ])));
    });
  }

Answer 1

In general, the approach you are using should work as expected. Nevertheless, if you are populating your DataCell s with TextField s, in that case you will have to add a GlobalKey to each TextField , so that Flutter knows where each DataCell belongs.

For more info on Keys watch this Flutter mini-tutorial .

Please try the following complete running sample

import 'package:flutter/material.dart';

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: MyHomePage(),
    );
  }
}

class MyHomePage extends StatefulWidget {
  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  
  @override
  Widget build(BuildContext context) {
    return Tabelle(); 
  }
}

class Tabelle extends StatefulWidget {
  @override
  _TabelleState createState() => _TabelleState();
}

class _TabelleState extends State<Tabelle> {

  List<DataRow> _rowList = [
    DataRow(
        cells: <DataCell>[
          DataCell(TextField(key: GlobalKey(),)),
          DataCell(TextField(key: GlobalKey(),)),
          DataCell(TextField(key: GlobalKey(),)),
          DataCell(TextField(key: GlobalKey(),)),
        ]),
  ];

  void _addRow() {
    setState(() {
      _rowList.insert(0, (DataRow(
          cells: <DataCell>[
            DataCell(TextField(key: GlobalKey(),)),
            DataCell(TextField(key: GlobalKey(),)),
            DataCell(TextField(key: GlobalKey(),)),
            DataCell(TextField(key: GlobalKey(),)),
          ])));
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text('Plan'), actions: [
        TextButton(
          onPressed: _addRow,
          child: Text(
            'Neues Training',
            style: TextStyle(color: Colors.white),
          ),
        ),
      ]),
      body: SingleChildScrollView(
          scrollDirection: Axis.vertical,
          child: SingleChildScrollView(
            scrollDirection: Axis.horizontal,
            child: DataTable(
                dataRowHeight: 200,
                headingRowColor:
                MaterialStateColor.resolveWith((states) => Colors.black26),
                dataRowColor:
                MaterialStateColor.resolveWith((states) => Colors.black26),
                columnSpacing: 20,
                columns: [
                  DataColumn(label: Text('seconds', style: TextStyle(fontSize: 16),)),
                  DataColumn(label: Text('Datum', style: TextStyle(fontSize: 16),)),
                  DataColumn(label: Text('Datum', style: TextStyle(fontSize: 16),)),
                  DataColumn(label: Text('Datum', style: TextStyle(fontSize: 16),)),
                ], rows: _rowList),
          )),
    );
  }
}