Как добавить переупорядочиваемое представление списка, если у вас уже есть построитель представления списка
Я хочу сделать список переупорядочиваемым во Flutter, но у меня уже есть Future Builder и List View.ReorderableListView должен быть родительским или дочерним по отношению к другим ListViews? Как для него инициализировать ключ?
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, но, поскольку children: [] невозможно, я не знаю, где поместить цикл for для " i "
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 ответ
Решение
Я понял, как это решить.
```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),
);
}```
В основном, используя List.generate и используя индекс для перебора элементов базы данных. Таким образом, я могу использовать future builder для отображения элементов из базы данных, а не из обычного списка, и переупорядочить этот список.
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,
),
),
subtitle: Text(snapshot.data[index].note,
maxLines: 4),
onTap: () {
},
),
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);
});
}