Flutter ListView becomes sloppy and slow when using RadioListTile or Radio buttons in each item

1.5k Views Asked by At

I am trying to implement a listview where I will show the questions of a quiz and each questions will have 4 radio buttons. But when the list gets bigger like 30-50 items the listview scroll becomes very sloppy and laggy. without radio but only text scroll works smooth. Please help me if you have faced similar issue.

I tried to use SingleChildScrollview on top of Listview but I didn't get any solutions. I think the problem is with Radio. I dont why this widget is so heavy.

2

There are 2 best solutions below

0
On BEST ANSWER

I have removed the ListTile/RadioListTile/Radio components from my ListView children and created a radio using IconButton which made my ListView smoother. I think the default Radio made my ListItems more complex as they have their own states which may be cost expensive. I wish I could use itemExtent which makes the scroll lot faster than it is right now.

4
On
  • first : Its BAD PRACTICE to wrap a ListView with SingleChildScrollView. read this article, i just summarize about it : article

  • for better performance use ListView.buildder. I also explain on that article

but for more refrerence you can read this official documentation: https://docs.flutter.dev/cookbook/lists/long-lists

antoher tips: set the itemExtent value for ListView. It will improve the performance of flutter apps.

ListView(
 children: widgets,
 itemExtent: 200,
  • left : without itemExtend ( arround 10second to get index 999) ,

  • right : with itemExtend (very fast move to index 999)

Without itemExtend with itemExtend

read this article for another implementation: link