如果已经具有列表视图构建器,如何添加可重新排序的列表视图

时间:2020-06-16 06:50:56

标签: listview flutter flutter-listview reorderable-list

我想在Flutter中使列表成为可重新排序,但是我已经拥有Future Builder和List View。 ReorderableListView 应该是其他ListView的父项还是子项? 如何为此初始化密钥

 return Scaffold(
    body: Container(
    child: ListView(
      children: <Widget>[
        SizedBox(
          height: MediaQuery.of(context).size.height * 0.882,
          child: FutureBuilder(
            future: databaseHelper.getNoteList(),
            builder: (BuildContext context, AsyncSnapshot snapshot) {
              if (snapshot.data == null) {
                return Text('Loading');
              } else {
                if (snapshot.data.length < 1) {
                  return Center(
                    child: Text('No Messages, Create New one'),
                  );
                }
                return ListView.builder(
                  itemCount: snapshot.data.length,
                  itemBuilder: (BuildContext context, int i) {
                    return Column(
                      children: <Widget>[
                        ListTile(
                          title: Text(snapshot.data[i].title),
                          ),
                          subtitle:
                              Text(snapshot.data[i].note, maxLines: 4),
                          onTap: () {},
                        ),
                        Divider(color: Theme.of(context).accentColor)
                      ],
                    );
                  },
                );
              }
            },
          ),
        )
      ],
    ),
  ),
);

我尝试添加ReorderableListView,但是由于子级:[]不可能,我不知道在哪里为“ i”放置for循环

                      future: databaseHelper.getNoteList(),
                      builder: (BuildContext context, AsyncSnapshot snapshot) {
                        if (snapshot.data == null) {
                          return Text('Loading');
                        } else {
                          if (snapshot.data.length < 1) {
                            return Center(
                              child: Text('No Messages, Create New one'),
                            );
                          }
                          return ReorderableListView(
                              children: List.generate(
                            snapshot.data.length,
                            (index) {
                              return ListTile(
                                key: Key('$index'),
                                title: Text(
                                  snapshot.data[i].title,
                                  style: TextStyle(
                                    fontWeight: FontWeight.bold,
                                    fontSize: 20,
                                  ),
                                ),
                                subtitle:
                                    Text(snapshot.data[i].note, maxLines: 4),
                                trailing: InkWell(
                                  child: Icon(Icons.check, color: Colors.green),
                                  onTap: () {
                                    TextEditingController txt =
                                        TextEditingController();

                                    txt.text = snapshot.data[i].note;
                                    print(txt);
                                    Route route = MaterialPageRoute(
                                        builder: (context) =>
                                            MyHomePage(custMessage: txt));
                                    Navigator.push(context, route);
                                    // addNewMessageDialog(txt);
                                  },
                                ),
                                isThreeLine: true,
                                onTap: () {
                                  Route route = MaterialPageRoute(
                                      builder: (context) => AddNote(
                                            note: snapshot.data[i],
                                          ));
                                  Navigator.push(context, route);
                                },
                              );
                            },
                          ).toList()

                              //Divider(color: Theme.of(context).accentColor),

                              );
                        }
                      })```

Right now the error is undefined variable i.

1 个答案:

答案 0 :(得分:0)

我有办法解决它。

January 1
January 2
January 3
January 5
January 7
January 8
January 9
January 10
January 12
January 16
January 18
January 28
January 29
January 30
January 31
February 5
February 11
February 13
February 27
February 28
February 29
March 5
March 8
March 9
March 11
March 12
March 13
March 14
March 16
March 17
March 18
March 20
March 23
March 24
March 26
March 27
March 30
April 1
April 2
April 4
April 5
April 6
April 7
April 8
April 9
April 10
April 12
April 14
April 15
April 17
April 18
April 19
April 20
April 21
April 22
April 23
April 25
April 26
April 27
April 28
April 29
April 30
May 1
May 3
May 4
May 5
May 6
May 7
May 9
May 10
May 11
May 12
May 14
May 15
May 16
May 18
May 19
May 21
May 22
May 23
May 24
May 26
May 27
May 28
May 30
May 31
June 1
June 2
June 3
June 4
June 6
June 7
June 8
June 9
June 16

基本上,使用List.generate和索引来遍历数据库元素。这样,我可以使用将来的构建器来显示数据库中的元素,而不是普通列表并对该列表重新排序。

```Widget build(BuildContext context) {
    databaseHelper.initlizeDatabase();
    return Scaffold(
      appBar: AppBar(
        backgroundColor: Colors.green,
        title: Text('Notes'),
      ),
      body: Container(
          padding: EdgeInsets.all(8.0),
          child: ListView(
            children: <Widget>[
              SizedBox(
                  height: MediaQuery.of(context).size.height * 0.882,
                  child: FutureBuilder(
                      future: databaseHelper.getNoteList(),
                      builder: (BuildContext context, AsyncSnapshot snapshot) {
                        if (snapshot.data == null) {
                          return Text('Loading');
                        } else {
                          if (snapshot.data.length < 1) {
                            return Center(
                              child: Text('No Messages, Create New one'),
                            );
                          }
                          return ReorderableListView(
                              children: List.generate(
                                snapshot.data.length,
                                (index) {
                                  return ListTile(
                                    key: Key('$index'),
                                    title: Text(
                                      snapshot.data[index].title,
                                      style: TextStyle(
                                        fontWeight: FontWeight.bold,
                                        fontSize: 20,
                                      ),
                                    ),
                                    subtitle: Text(snapshot.data[index].note,
                                        maxLines: 4),
                                    trailing: InkWell(
                                      child: Icon(Icons.check,
                                          color: Colors.green),
                                      onTap: () {
                                        TextEditingController txt =
                                            TextEditingController();

                                        txt.text = snapshot.data[index].note;
                                        print(txt);
                                        Route route = MaterialPageRoute(
                                            builder: (context) =>
                                                MyHomePage(custMessage: txt));
                                        Navigator.push(context, route);
                                        // addNewMessageDialog(txt);
                                      },
                                    ),
                                    isThreeLine: true,
                                    onTap: () {
                                      Route route = MaterialPageRoute(
                                          builder: (context) => AddNote(
                                                note: snapshot.data[index],
                                              ));
                                      Navigator.push(context, route);
                                    },
                                  );
                                },
                              ).toList(),
                              onReorder: (int oldIndex, int newIndex) {
                                setState(() {
                                  if (newIndex > oldIndex) {
                                    newIndex -= 1;
                                  }
                                  final item = snapshot.data.removeAt(oldIndex);
                                  snapshot.data.insert(newIndex, item);
                                });
                              }

                              //Divider(color: Theme.of(context).accentColor),
                              );
                        }
                      }))
            ],
          )),
      floatingActionButton: _buildFAB(context, key: _fabKey),
    );
  }```