无法从csv中查看表格布局 [英] Not viewing Table Layout from a csv in flutter

问题描述

我正在制作一个加载CSV文件并将其显示为列表视图的应用程序但是我看不到我的数据，我不知道为什么会这样.这是csv链接.
每当您更改State对象的内部状态时，都要在传递给

I am making an app which loads the CSV file and show it as a list view But I can't see my data I don't know why it is doing like this. Here is the csv link a link!

When I run my app I see only this

Instead, I want to fill the empty space like this

Here is the code

import 'package:flutter/material.dart';
import 'package:csv/csv.dart';
import 'dart:async' show Future;
import 'package:flutter/services.dart' show rootBundle;

class TableLayout extends StatefulWidget {
  @override
  _TableLayoutState createState() => _TableLayoutState();
}
class _TableLayoutState extends State<TableLayout> {
  @override
  Widget build(BuildContext context) {

  List<List<dynamic>> data = [];

  loadAsset() async {
    final myData = await rootBundle.loadString("asset/dreamss.csv");
    List<List<dynamic>> csvTable = CsvToListConverter().convert(myData);

    data = csvTable;
    print(data);
  }

    return MaterialApp(
    home:Scaffold(
      appBar: AppBar(title: Text("dsf"),),
      floatingActionButton: FloatingActionButton( onPressed: () async {
            await loadAsset();
            print(data);
          },),
      body: Table(
        children: data.map((item){
          return TableRow(
            children: item.map((row){
              return Text(row.toString());
            }).toList(),
          );
        }).toList(),
        ),
      ),

    );
  }

}

解决方案

You missed setState.
Whenever you change the internal state of a State object, make the change in a function that you pass to setState.
Please see the full code as below:

class TableLayout extends StatefulWidget {
  @override
  _TableLayoutState createState() => _TableLayoutState();
}
class _TableLayoutState extends State<TableLayout> {
  List<List<dynamic>> data = [];

  loadAsset() async {
    final myData = await rootBundle.loadString("asset/dreamss.csv");
    List<List<dynamic>> csvTable = CsvToListConverter().convert(myData);

    return csvTable;
  }

  void load() async{
    var newdata = await loadAsset();
    setState(() {
      data = newdata;
    });
    print(data);
  }

  @override
  Widget build(BuildContext context) {
    return MaterialApp(home: Scaffold(
        appBar: AppBar(title: Text("dsf"),),
        floatingActionButton: FloatingActionButton( onPressed: load),
        body: ListView(
          children: <Widget>[
        Table(
          children: data.map((item){
            return TableRow(
              children: item.map((row){
                return Text(row.toString());
              }).toList(),
            );
          }).toList(),
        ),
    ]),
    ));
  }
}

It printed data as below:

I/flutter ( 9677): [[S.no, Dream, Direct, House, Ending], [1, Quarrel between husband and wife, 03, 08, 13, 37, 40, 73, , 3], [2, Erotic dream, 17, 40, 53, 59, 60, 83, , ], [3, Bathing in the open, 08, 18, 28, 48, 78, 98, , 8], [4, Travelling, 08, 14, 18, 52, 64, 68, 74, 78, 98, , 8], [5, Travelling in an aeroplane, 23, 43, 53, 63, 68, 73, 83, 93, , 3], [6, Taking a walk, , , 0,1], [7, Studying, , , 5], [8, Corpse, , 9, 9], [9, Playing, 00, 27, 40, 50, 57, 60, , ], [10, Talking over the phone, 98, 96, 94, , ], [11, Eating, 01, 02, 05, 15, 16, 45, 75, 85, 95, , ], [12, Breast Feeding, 02, 03, 05, 12, 20, 52, 53, , ], [13, Male, 6, 6, ], [14, Female, 5, 5, ], [15, Child, 2,3, 2,3, ], [16, Police, 7, 87, 8, , ], [17, Wild Pig, 46, , ], [18, Snake or ilea fish, 09, 17, 37, 57, 77, 99, , 7], [19, Cow, goat or buffalo, 12, 18, 19, 22, 24, 34, 42, 54, 72, 74, 84, 94, 97, , ], [20, Cow, 4, 4, ], [21, Tiger, 9, 9, ], [22, Dog, 4,5,6, 4, ], [23, Horse, 8, 8, ], [24, Bird, 2, 2, ], [25, Elephant, 9, 9, ], [26, Snail, 0, 0, 0], [27, Turtl

Please refer the my screenshot as below:

这篇关于无法从csv中查看表格布局的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！