Advertisement
psp3004

ListView.builder

Feb 5th, 2020
248
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
Java 3.34 KB | None | 0 0
  1. import 'package:flutter/material.dart';
  2.  
  3. final Color backgroundColor = Color(0xFF242E42);
  4.  
  5. class Sidebar extends StatelessWidget {
  6.   String    itemText;
  7.   IconData  itemIcon;
  8.  
  9.   @override
  10.   Widget build(BuildContext context) {
  11.     return Scaffold(
  12.       body: Stack(
  13.         children: <Widget>[
  14.           menu(context),
  15.         ],
  16.       ),
  17.     );
  18.   }
  19.  
  20.   Widget menu(context) {
  21.     Size size = MediaQuery.of(context).size;
  22.  
  23.     double screenWidth  = size.width;
  24.     double screenHeight = size.height;
  25.  
  26.     return Container(
  27.       color : backgroundColor,
  28.       child: Column(
  29.         mainAxisSize        : MainAxisSize.max,
  30.         crossAxisAlignment  : CrossAxisAlignment.start,
  31.         mainAxisAlignment   : MainAxisAlignment.start,
  32.         children: <Widget>[
  33.           Padding(
  34.             padding: const EdgeInsets.only(left: 8, right: 0, top: 55, bottom: 35),
  35.             child: Image.asset(
  36.               'images/logo.png',
  37.               width : 20.0,
  38.               height: 20.0,
  39.               fit   : BoxFit.contain
  40.             ),
  41.           ),
  42.           DisplayListView(),
  43.         ],
  44.       )
  45.     );
  46.   }
  47. }
  48.  
  49. class ListViewModel {
  50.   final String    itemText;
  51.   final IconData  itemIcon;
  52.  
  53.   ListViewModel({
  54.     this.itemText,
  55.     this.itemIcon
  56.   });
  57. }
  58.  
  59. List listViewData = [
  60.   ListViewModel(
  61.     itemText: "Dashboard",
  62.     itemIcon: Icons.dashboard,
  63.   ),
  64.   ListViewModel(
  65.     itemText: "Profile",
  66.     itemIcon: Icons.account_circle,
  67.   ),
  68.   ListViewModel(
  69.     itemText: "Messages",
  70.     itemIcon: Icons.message,
  71.   ),
  72.   ListViewModel(
  73.     itemText: "Friends",
  74.     itemIcon: Icons.supervisor_account,
  75.   ),
  76.   ListViewModel(
  77.     itemText: "Branches",
  78.     itemIcon: Icons.account_circle,
  79.   ),
  80.   ListViewModel(
  81.     itemText: "Collapse",
  82.     itemIcon: Icons.arrow_forward_ios,
  83.   ),
  84. ];
  85.  
  86. class DisplayListView extends StatefulWidget {
  87.   @override
  88.   _DisplayListViewState createState() => _DisplayListViewState();
  89. }
  90.  
  91. class _DisplayListViewState extends State {
  92.   bool isCollapsed = true;
  93.  
  94.   @override
  95.   Widget build(BuildContext context) {
  96.     return ListView.builder(
  97.       itemCount: listViewData.length,
  98.       itemBuilder: (context, int i) {
  99.         bool last = listViewData.length == (i + 1);
  100.         return Padding(
  101.           padding: const EdgeInsets.only(left: 8, bottom: 15),
  102.           child: Row(
  103.             mainAxisSize        : MainAxisSize.max,
  104.             crossAxisAlignment  : CrossAxisAlignment.start,
  105.             mainAxisAlignment   : MainAxisAlignment.start,
  106.             children: <Widget>[
  107.               Padding(
  108.                 padding: const EdgeInsets.only(
  109.                   top   : 0,
  110.                   bottom: 0,
  111.                   left  : 0,
  112.                   right : 12,
  113.                 ),
  114.                 child: Column(
  115.                   children: <Widget>[
  116.                     Icon(
  117.                       listViewData[i].itemIcon,
  118.                       color: Colors.white,
  119.                       size: 20.0,
  120.                     ),
  121.                     if (!isCollapsed)
  122.                       Text(
  123.                         listViewData[i].itemText,
  124.                         style: TextStyle(color: Colors.white, fontSize: 16)
  125.                       ),
  126.                   ],
  127.                 )
  128.               ),
  129.             ]
  130.           ),
  131.         );
  132.       }
  133.     );
  134.   }
  135. }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement