List with spaced items

 import "package:flutter/material.dart";


void main()
{
runApp(const MyApp());
}
class MyApp extends StatelessWidget
{
const MyApp({super.key});
@override
Widget build(BuildContext context) {
return MaterialApp(
title: "List with spaced items",
debugShowCheckedModeBanner: false,
theme: ThemeData(
primarySwatch: Colors.grey,
colorScheme: ColorScheme.fromSeed(seedColor: Colors.grey),
cardTheme: const CardTheme(color: Colors.grey),
useMaterial3: true,
),
home: ListWithSpacedItems(),
);
}
}
class ListWithSpacedItems extends StatelessWidget
{
ListWithSpacedItems({super.key});
var items = 20;

@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: const Text("List with spaced items", style: TextStyle(fontWeight: FontWeight.bold),),
centerTitle: true,
backgroundColor: Colors.grey,
),
body: LayoutBuilder(
builder: (context, constraints) {
return SingleChildScrollView(
child: ConstrainedBox(
constraints: BoxConstraints(minHeight: constraints.maxHeight),
child: Column(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
crossAxisAlignment: CrossAxisAlignment.stretch,
children: List.generate(items, (index) {
return ItemWidget(text: "Item $index");
},),
),
),
);
},
),
);
}
}
class ItemWidget extends StatelessWidget
{
const ItemWidget({super.key, required this.text});
final String text;

@override
Widget build(BuildContext context) {
return Card(
child: SizedBox(
height: 100.0,
child: Center(child: Text(text,
style: const TextStyle(color: Colors.white, fontSize: 30.0),),),
),
);
}
}

Comments

Popular posts from this blog

Pagination with Bloc Pattern in Flutter

Pagination First Practical in Flutter

ExpansionPanel with ExpansionPanelList with Complete Collapse Operation in Flutter