Created
January 22, 2020 13:42
-
-
Save Abhilash-Chandran/f43563168d9a67fe4faa1a796d7d605f to your computer and use it in GitHub Desktop.
Expansion Tile demo
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import 'package:flutter/material.dart'; | |
final Color darkBlue = Color.fromARGB(255, 18, 32, 47); | |
void main() { | |
runApp(MyApp()); | |
} | |
class MyApp extends StatelessWidget { | |
@override | |
Widget build(BuildContext context) { | |
return MaterialApp( | |
theme: ThemeData.dark().copyWith(scaffoldBackgroundColor: darkBlue), | |
debugShowCheckedModeBanner: false, | |
home: Scaffold( | |
body: Center( | |
child: MyExpansionTile(), | |
), | |
), | |
); | |
} | |
} | |
class MyExpansionTile extends StatelessWidget { | |
// defining the title and descriptions. | |
final List<String> titles = ['title-1', 'title-2', 'title-3']; | |
final List<String> descriptions = [ | |
'Description for title-1', | |
'Description for title-2', | |
'Detailed Description for title-3' | |
]; | |
@override | |
Widget build(BuildContext context) { | |
return ListView.builder( | |
shrinkWrap: true, | |
itemBuilder: (context, index) { | |
// handle index out of range. | |
if(index >= titles.length) | |
return null; | |
// build and expansion tile for each title and description. | |
return ExpansionTile( | |
// comment following to show an arrow in the end of each expansion tile as per material design. | |
trailing: Container(width: 0, height:0), | |
leading: Icon(Icons.open_in_browser), | |
title: Text(titles[index]), | |
children: <Widget>[ | |
Text(descriptions[index]), | |
], | |
); | |
}, | |
); | |
} | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment