If you want to create Expandable ListView in Flutter? Use the below flutter code to create Expandable ListView in your application:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 | import 'package:flutter/material.dart'; void main() => runApp(new MaterialApp(home: new MyApp(), debugShowCheckedModeBanner: false,),); class MyApp extends StatefulWidget { @override _MyAppState createState() => new _MyAppState(); } class _MyAppState extends State<MyApp> { @override Widget build(BuildContext context) { return new Scaffold( body: new ListView.builder( itemCount: vehicles.length, itemBuilder: (context, i) { return new ExpansionTile( title: new Text(vehicles[i].title, style: new TextStyle(fontSize: 20.0, fontWeight: FontWeight.bold, fontStyle: FontStyle.italic),), children: <Widget>[ new Column( children: _buildExpandableContent(vehicles[i]), ), ], ); }, ), ); } _buildExpandableContent(Vehicle vehicle) { List<Widget> columnContent = []; for (String content in vehicle.contents) columnContent.add( new ListTile( title: new Text(content, style: new TextStyle(fontSize: 18.0),), leading: new Icon(vehicle.icon), ), ); return columnContent; } } class Vehicle { final String title; List<String> contents = []; final IconData icon; Vehicle(this.title, this.contents, this.icon); } List<Vehicle> vehicles = [ new Vehicle( 'Bike', ['Vehicle no. 1', 'Vehicle no. 2', 'Vehicle no. 7', 'Vehicle no. 10'], Icons.motorcycle, ), new Vehicle( 'Cars', ['Vehicle no. 3', 'Vehicle no. 4', 'Vehicle no. 6'], Icons.directions_car, ), ]; |
If you like this question & answer and want to contribute, then write your question & answer and email to freewebmentor[@]gmail.com. Your question and answer will appear on FreeWebMentor.com and help other developers.
