there is a problem. I have SOMETIMES no download icon disappears. Or to put it another way, instead of "No more entries", I see a loading circle.
This happens depending on how much data I received. For example, for 5 records there will be an endless download, and for 6 records it will display "There are no more records"
Tell me, what's the problem?
class _MyHomePageState extends State<MyHomePage> {
var ressultat = json.decode(MyApp.resultat)['Transactions'];
final controller = ScrollController();
bool hasMore = true;
int page = 2;
bool isLoading = false;
@override
void initState() {
super.initState();
// fetch();
controller.addListener(() {
if(controller.position.maxScrollExtent == controller.offset) {
fetch();
}
});
}
@override
void dispose() {
controller.dispose();
super.dispose();
}
Future fetch() async {
if(isLoading) return;
isLoading = true;
var token = LoginClass.resJson;
const limit = 9;
try {
final response = await http.post(
Uri.parse(Config.urlReport),
headers: <String, String>{
'Content-Type': 'application/json; charset=UTF-8',
"Authorization": "Bearer $token"
},
body: json.encode({
"Filters": {
"DateFrom" : MyApp.dateFrom,
"DateTo" : MyApp.dateEnd,
"AmountFrom": MyApp.sumFrom,
"AmountTo": MyApp.sumTo,
"SenderPaymentSystemId": MyApp.dropdownvalue,
"SenderRequisite": MyApp.phoneNum},
"Sorting": {
"Field": MyApp.isCheckedFieldPicker,
"Order": MyApp.isCheckedOrderPicker},
"Pagination": {
"PageNumber": page,
"PageSize": limit
}
})
);
if (response.statusCode == 200) {
var reportResult = (response.body);
print(reportResult);
final List ress = json.decode(reportResult)['Transactions'];
setState(() {
page ;
isLoading = false;
if(MyApp.rowNumber!.length < limit) {
hasMore = false;
}
MyApp.rowNumber?.addAll(ress.map<String>((item) {
final rowNumber = item['RowNumber'].toString();
return rowNumber;
}));
MyApp.walletName?.addAll(ress.map<String>((item) {
final walletName = item['WalletName'].toString();
return walletName;
}));
MyApp.payerPhoneNumber?.addAll(ress.map<String>((item) {
final phoneNumber = item['SenderRequisite'].toString();
return phoneNumber;
}));
MyApp.createdDate?.addAll(ress.map<String>((item) {
final createdDate = item['CreatedDate'].toString();
return createdDate;
}));
MyApp.amount?.addAll(ress.map<String>((item) {
final amount = item['Amount'].toString();
return amount;
}));
});
print(MyApp.createdDate.runtimeType);
} else {
var res = response.statusCode;
print(res);
}
} catch (error) {
print(error);
}
}
Here is all the necessary code, if you need something else, please let me know
child: ListView.builder(
controller: controller,
padding: EdgeInsets.all(5),
itemCount: MyApp.rowNumber!.length 1,
itemBuilder: (context, index) {
if (index < MyApp.rowNumber!.length) {
return Container(
padding: EdgeInsets.all(5),
margin: EdgeInsets.all(2),
decoration: BoxDecoration(
border: Border.all(color: Colors.black)
),
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Container(
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceAround,
children: [
Column(
children: [
Container(
margin: EdgeInsets.all(5),
child: Text(' ${MyApp.rowNumber?[index]}', style: TextStyle(fontSize: 15),),
)
],
),
Column(
children: [
Container(
margin: EdgeInsets.all(5),
width: 80,
child: Text('${MyApp.createdDate?[index].replaceFirst(RegExp('T'), '')}', style: TextStyle(fontSize: 15),),
)
],
),
Column(
children: [
Container(
margin: EdgeInsets.all(5),
child: Column(
children: [
Text('${MyApp.walletName?[index]}', style: TextStyle(fontSize: 15),),
Text('${MyApp.payerPhoneNumber?[index]}', style: TextStyle(fontSize: 15),),
],
),
)
],
),
Column(
children: [
Container(
margin: EdgeInsets.all(5),
child: Text('${MyApp.amount?[index]}', style: TextStyle(fontSize: 15),),
)
],
)
],
),
),
],
)
);
} else {
return Padding(
padding: EdgeInsets.symmetric(vertical: 10),
child: Center(
child: hasMore
? const CircularProgressIndicator()
: const Text('Список полностью загружен')
,),
);
}
}
)
UPD: I clarify the question: My first request was sent with a limit of 9 entries, however, if there are less than 9 entries, then there will be an endless download. How to fix it?
CodePudding user response：
you are not setting isLoading as false for HTTP request's response other than 200 and for error.
Future fetch() async {
if(isLoading) return;
isLoading = true;
var token = LoginClass.resJson;
const limit = 9;
try {
final response = await http.post(
Uri.parse(Config.urlReport),
headers: <String, String>{
'Content-Type': 'application/json; charset=UTF-8',
"Authorization": "Bearer $token"
},
body: json.encode({
"Filters": {
"DateFrom" : MyApp.dateFrom,
"DateTo" : MyApp.dateEnd,
"AmountFrom": MyApp.sumFrom,
"AmountTo": MyApp.sumTo,
"SenderPaymentSystemId": MyApp.dropdownvalue,
"SenderRequisite": MyApp.phoneNum},
"Sorting": {
"Field": MyApp.isCheckedFieldPicker,
"Order": MyApp.isCheckedOrderPicker},
"Pagination": {
"PageNumber": page,
"PageSize": limit
}
})
);
if (response.statusCode == 200) {
var reportResult = (response.body);
print(reportResult);
final List ress = json.decode(reportResult)['Transactions'];
setState(() {
page ;
isLoading = false;
if(MyApp.rowNumber!.length < limit) {
hasMore = false;
}
MyApp.rowNumber?.addAll(ress.map<String>((item) {
final rowNumber = item['RowNumber'].toString();
return rowNumber;
}));
MyApp.walletName?.addAll(ress.map<String>((item) {
final walletName = item['WalletName'].toString();
return walletName;
}));
MyApp.payerPhoneNumber?.addAll(ress.map<String>((item) {
final phoneNumber = item['SenderRequisite'].toString();
return phoneNumber;
}));
MyApp.createdDate?.addAll(ress.map<String>((item) {
final createdDate = item['CreatedDate'].toString();
return createdDate;
}));
MyApp.amount?.addAll(ress.map<String>((item) {
final amount = item['Amount'].toString();
return amount;
}));
});
print(MyApp.createdDate.runtimeType);
} else {
var res = response.statusCode;
isLoading = false;
setState(() {});
print(res);
}
} catch (error) {
isLoading = false;
setState(() {});
print(error);
}
}