Select Items in a ListView in Flutter - with a Trailing Icon

<p>In this example, I'm going to share an example of how to select items in a ListView with a Trailing Icon.</p> <p>Here is how the output of the program is going to look like. You can see the items are turned into blue and a checkbox with a check Icon appears on long press. This Check Icons, actually makes the selected item more recognizable when it's long pressed.</p> <p>![](https://fluttercentral.com/Uploads/bb91d186-1d6e-4722-86fd-0bfa10afa157.gifwidth="50%height="auto](</p> <p>In order to achieve this, I've taken advantage of onLongPress method available in ListTile.</p> <p>Here is the full code from main.dart file. Copy-paste and run the program to see the above output. runApp(MyApp());</p> <p>class MyApp extends StatefulWidget { @override _MyAppState createState() => _MyAppState(); }</p> <p>class _MyAppState extends State { double padValue = 0;</p> <p>List paints = [ Paint(1, 'Red', Colors.red), Paint(2, 'Blue', Colors.blue), Paint(3, 'Green', Colors.green), Paint(4, 'Lime', Colors.lime), Paint(5, 'Indigo', Colors.indigo), Paint(6, 'Yellow', Colors.yellow) ];</p> <p>@override Widget build(BuildContext context) { return MaterialApp( home: Scaffold( appBar: AppBar( title: Text("Selectable ListView Example"), ), body: ListView( children: List.generate(paints.length, (index) { return ListTile( onLongPress: () { setState(() { paints[index].selected = !paints[index].selected;</p> <pre> log(paints[index].selected.toString()); }); }, selected: paints[index].selected, leading: GestureDetector( behavior: HitTestBehavior.opaque, onTap: () , child: Container( width: 48, height: 48, padding: EdgeInsets.symmetric(vertical: 4.0), alignment: Alignment.center, child: CircleAvatar( backgroundColor: paints[index].colorpicture, ), ), ), title: Text('ID: ' + paints[index].id.toString()), subtitle: Text(paints[index].title), trailing: (paints[index].selected) ? Icon(Icons.check_box) : Icon(Icons.check_box_outline_blank), ); }), ), ), ); </pre> <p>} }</p> <p>class Paint { final int id; final String title; final Color colorpicture; bool selected = false;</p> <p>Paint(this.id, this.title, this.colorpicture); }</p> <p>Hope this will be useful to you. Thanks,<br /> Srikanth</p>