Dynamic and responsive ListView in flutter

How to create responsive and dynamic Listview?

Step 1:

Create Listview builder

ListView.builder(
physics: ScrollPhysics(parent: AlwaysScrollableScrollPhysics()),
itemCount: allBillList[0].data!.length,
scrollDirection: Axis.vertical,
itemBuilder: (c, index1) {
String data = mainList![index1];
return ListItem(data);
})

Step 2:

Create separate ListItem.dart file

import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';

class ListItem extends StatefulWidget {
ListItem({this.data});

final String? data;

@override
_ListItemState createState() => _ListItemState();
}

class _ListItemState extends State<ListItem> {


@override
Widget build(BuildContext context) {
// TODO: implement build

return Column(
children: [
Container(margin: const EdgeInsets.all(16.0), child:Text(data)),
BasicWidget.getDivider(),
],
);
}


}

So if you want to delete or add items in mainList just add setState outside delete and insert functionality
just like,

 setState(() {
mainList =mainList.add("test");
});
}
this will automatically refresh your listview.

Comments

  1. Does it have pagination feature also. Thanks for the post .
    Keep it up.

    ReplyDelete
    Replies
    1. Try this post. https://flutterlearneasyway.blogspot.com/2022/01/load-more-pagination-in-listview-flutter.html

      Delete

Post a Comment

Popular posts from this blog

Flutter Bloc Pattern 8.0.0 Call API

Manage Firebase storage using flutter