Created
September 24, 2021 03:26
-
-
Save aadarshadhakalg/a6b4cc409d8abdfb6386c1a964dcd86a to your computer and use it in GitHub Desktop.
This is example of Mapping vs using ListView.builder() in flutter
This file contains 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'; | |
const Color darkBlue = Color.fromARGB(255, 18, 32, 47); | |
void main() { | |
runApp(MyApp()); | |
} | |
List items = [ | |
{'1': 'bottle', '2': 'empty'}, | |
{'1': 'mouse', '2': 'empty'}, | |
]; | |
class MyApp extends StatelessWidget { | |
@override | |
Widget build(BuildContext context) { | |
return MaterialApp( | |
theme: ThemeData.dark().copyWith( | |
scaffoldBackgroundColor: darkBlue, | |
), | |
debugShowCheckedModeBanner: false, | |
home: Scaffold( | |
appBar: AppBar(title: const Text('My App')), | |
body: Center( | |
child: BuilderWidget(), | |
// child: MapWidget(), | |
), | |
), | |
); | |
} | |
} | |
class MapWidget extends StatelessWidget { | |
@override | |
Widget build(BuildContext context) { | |
return ListView( | |
children: [ | |
...items | |
.map((e) => Row( | |
crossAxisAlignment: CrossAxisAlignment.center, | |
mainAxisAlignment: MainAxisAlignment.spaceBetween, | |
children: [ | |
Text(e['1']), | |
Text(e['2']), | |
])) | |
.toList(), | |
], | |
); | |
} | |
} | |
class BuilderWidget extends StatelessWidget { | |
@override | |
Widget build(BuildContext context) { | |
return ListView.builder( | |
itemCount: items.length, | |
itemBuilder: (context, index) { | |
return Row( | |
crossAxisAlignment: CrossAxisAlignment.center, | |
mainAxisAlignment: MainAxisAlignment.spaceBetween, | |
children: [ | |
Text(items[index]['1']), | |
Text(items[index]['2']), | |
]); | |
}); | |
} | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment