i'm quite new to flutter, i was trying to add command to my ListView.builder
Widget orderListView() {
return ListView.builder(
itemBuilder: (context, getOrders) => Card(
child: ListTile(
title: Text(getOrders.toString()),
onTap: () => print('$getOrders'),
),
));
}
}
basically i need to my list view show me orders list
Future<String> getOrders() async {
return await
http
.post(
Uri.parse('https://somerandomurl.com/admin/get_orders'),
body: "{\"token\": \"admin_token\"}",
headers: headers)
.then((response) {
print('Response status: ${response.statusCode}');
print('Response body: ${response.body}');
// return response.body;
}).catchError((error) {
print("Error: $error");
// return error;
});
}
here is my getOrders command. Is it possible to get my order list and show it when i open my list view screen?
CodePudding user response:
I'm not exactly sure what you're stuck on but there are a few prominent issues with your code and how you want it to be, however this is possible but you're not going about it the right way. To start, the getOrders()
method needs to be of type List<String>
because it's a list of orders.
So update it to something like this:
Future<List<String>> getOrders() async {
var orders = await http
.post(
Uri.parse('https://somerandomurl.com/admin/get_orders'),
body: "{\"token\": \"admin_token\"}",
headers: headers)
.then((response) {
print('Response status: ${response.statusCode}');
print('Response body: ${response.body}');
// return response.body;
}).catchError((error) {
print("Error: $error");
// return error;
});
return orders;
}
So now that your method returns a list instead of one single value, you can update your list view method as follows:
Widget orderListView(List<String> orders) {
return ListView.builder(
itemCount: orders.length, // You need this or it'll error
itemBuilder: (context, index) {
// Instead of saying orders[index] you can also do this:
var item = orders[index]
// You shouldn't use both a `Card` and a `ListTile`, Choose
// one
return ListTile(
title: Text(orders[index].toString()),
onTap: () => print(orders[index]),
),
}
);
}
However this is not enough. Because this is a Future
you must call it somewhere to return the data. There are many great packages to help make this process easier but here's how you do it without:
So whatever this screen of yours is called, make sure it's a stateful widget. Update the rest of the methods and incorporate a FutureBuilder:
import 'package:flutter/material.dart';
class MyOrdersWidget extends StatefulWidget {
const MyOrdersWidget({ Key? key }) : super(key: key);
@override
_MyOrdersWidgetState createState() => _MyOrdersWidgetState();
}
class _MyOrdersWidgetState extends State<MyOrdersWidget> {
@override
Widget build(BuildContext context) {
return Scaffold(
body: _body(),
);
}
Widget _body() {
return FutureBuilder<List<String>>(
future: getOrders(),
initialData: const [],
builder: (context, snapshot) {
if(snapshot.data == null) return Text('Loading');
if(snapshot.error == null) return Text('Error');
if(snapshot.data!.length == 0) return Text('No Orders');
return orderListView(snapshot.data);
},
);
}
}
Like I said before, because you're new to flutter I highly recommend using a package to assist you with this kind of development. For http request use the Dio package, and for managing futures, FutureBuilder
will work but I personally like to use flutter_riverpod and here's a video on it.