I wanted to reverse list and I have achieved this by using reverse: true,
. It is working, but the list has aligned to the bottom and showing blank space at the top when the list has least items.
Expanded(child: ListView.builder(
shrinkWrap: true,
reverse: true,
controller: _scrollController,
itemCount:order_response.orderDetails.length,
itemBuilder: (context, position) {return orderListItemTile(width,height,order_response,position);},
),)
But when I deleted expanded()
widget, when items increase then it overflows by pixel.
ListView.builder(
shrinkWrap: true,
reverse: true,
controller: _scrollController,
itemCount:order_response.orderDetails.length,
itemBuilder: (context, position) {return orderListItemTile(width,height,order_response,position);},
),
Reverse Dart List in-place by Swapping in For Loop. We can use a for loop to iterate till the middle of the list and for each iteration we swap the element at the index with the element at the N-1-index . As we doing this in the original list, the original list will finally have the reversed list.
builder() renders the only items that are visible in the screen which means that this renders the item as per the requirement. Here, Listview is efficient when we have less number of items where as Listview. builder is efficient for large number of items.
ListView. separated creates a fixed-length, scrollable , linear array of list “items” separated by list item “separators”. The itemBuilder callback is called whenever there are indices ≥ 0 and< itemCount .
Apart from reversing the list, another solution could be putting the ListView
inside an Align
widget with alignment: Alignment.topCenter
. Also shrinkWrap: true
needed inside ListView
.
Align(
alignment: Alignment.topCenter,
child: ListView.builder(
reverse: true,
shrinkWrap: true,
...
...
)
)
Reverse your list using:
var reversedList = _response.orderDetails.reversed.toList();
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With