【发布时间】：2020-09-10 02:18:34
【问题描述】：
我正在尝试为我从 api 获取的 list 实现延迟加载。我已经为我的ListView 实现了一个监听器，以检查它何时到达底部。我这里的问题是：
1) 如何为我的列表设置加载项的初始数量？
2) 如何在调用 loadMore() 方法时自动将项目添加到列表中？
class _HomeServiceState extends State<HomePage>
with AutomaticKeepAliveClientMixin {
List<Mentor> filteredData;
List<Mentor> users = [];
@override
void initState() {
// TODO: implement initState
super.initState();
_scrollcontroller.addListener(() {
if (_scrollcontroller.position.atEdge) {
if (_scrollcontroller.position.pixels == 0){
// you are at top position
} else{
// you are at bottom position
loadMore();
}
}
});
}
@override
Widget build(BuildContext context) {
final mentors = new FutureBuilder(
future: _future,
builder: (BuildContext context, AsyncSnapshot snapshot) {
return ListView.builder(
shrinkWrap: true,
physics: ScrollPhysics(),
itemCount: filteredData.length + 1,
itemBuilder: (BuildContext context, int index) {
if (index == filteredData.length) {
return CupertinoActivityIndicator();
}
return ListTile(
leading: CircleAvatar(
maxRadius: 23,
backgroundImage: NetworkImage(NetworkUtils.host +
AuthUtils.profilePics +
filteredData[index].profile_image),
),
title: Text(
filteredData[index].first_name +
" " +
filteredData[index].last_name,
style: TextStyle(
color: Color(0xFF041F36),
fontFamily: 'Muli',
fontSize: 16.0,
)),
subtitle: Text(capitalize(filteredData[index].industry),
style: TextStyle(
color: Color(0xFF25282A),
fontFamily: 'MuliLight',
fontSize: 12.0,
)),
trailing: Text(capitalize(filteredData[index].country),
style: TextStyle(
color: Color(0xFF25282A),
fontFamily: 'MuliItalic',
fontSize: 12.0,
)),
onTap: () {
Navigator.push(
context,
SlideFromRightPageRoute(
widget: MenteeDetailPage(filteredData[index])));
},
);
},
);
}
},
);
Future<List<Mentor>> _getUsers() async {
sharedPreferences = await SharedPreferences.getInstance();
var data = await http.get(
NetworkUtils.host + AuthUtils.endPointMentors,
headers: {
'Authorization': "Bearer " + sharedPreferences.getString("token"),
'Accept': 'application/json'
},
);
var jsonData = json.decode(data.body);
for (var u in jsonData["data"]) {
Mentor user = Mentor(
u["id"]!=null ? u["id"]: "",
u["category"]!=null ? u["category"] : "",
u["email"]!=null ? u["email"]: "",
u["email_verified_at"] !=null ? u["email_verified_at"]: "",
u["first_name"] !=null ? u["first_name"]: "",
u["last_name"] != null ?u["last_name"]: "",
u["other_name"] !=null ? u["other_name"]: "",
u["country"] !=null ? u["country"]: "",
u["industry"] !=null ? u["industry"]: "",
u["gender"] !=null ? u["gender"]: "",
u["bio_interest"] !=null ? u["bio_interest"]: "",
u["phone"] !=null ?u["phone"]: "",
u["state_of_origin"] !=null ? u["state_of_origin"]: "",
u["fav_quote"] != null ? u["fav_quote"]: "",
u["profile_image"] != null ? u["profile_image"] : "",
u["terms"] !=null ? u["terms"]: "",
u["check_status"] !=null ? u["check_status"]: "",
u["current_job"] != null ? u["current_job"]: "",
u["created_at"] !=null ? u["created_at"]: "",
u["updated_at"]!=null ? u["updated_at"]: "",
u["social_id"] !=null ? u["social_id"]: "",
getFromList(u["employment"], 'company'),
getFromList(u['employment'], 'position'),
getFromList(u['education'], 'institution'),
getFromList(u['education'], 'degree'),);
users.add(user);
}
filteredData = users;
return filteredData;
}
String getFromList(Map<String, dynamic> json, String key) {
return json != null ? json[key] : "";
}
@override
void dispose() {
_scrollcontroller.dispose();
super.dispose();
}
@override
// TODO: implement wantKeepAlive
bool get wantKeepAlive => true;
loadMore() {
print("edkwj");
}
}
【问题讨论】：
-
查看加载更多功能的链接stackoverflow.com/a/61708445/3946958，如有疑问请告知
-
@RavindraKushwaha 如何为我的列表类型设置初始加载的项目数。这行代码： (List
items = new List.generate(100, (index) => 'Hello $index');) 对我没有帮助 -
您是否以任何格式（例如 20 ,10 或 30 个项目）从 API 获得响应，请告诉我..我会相应地发布答案
-
是的，我将所有项目提取到我的代码中看到的名为 users 的列表中
-
请查看以下解决方案，如有疑问请告知