GridView dan ListView
AhmadAbdillah
dart
8 months ago
2.5 kB
5
Indexable
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(
debugShowCheckedModeBanner: false,
title: 'ListView and GirdView',
theme: ThemeData(
colorScheme: ColorScheme.fromSeed(seedColor: Colors.deepPurple),
),
home: const MyHomePage(title: 'ListView and GirdView'),
);
}
}
class MyHomePage extends StatefulWidget {
const MyHomePage({super.key, required this.title});
final String title;
@override
State<MyHomePage> createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
// looping
List<Widget> buildList(String text, int jumlah) {
List<Widget> widgets = [];
for (int i = 0; i < jumlah; i++) {
widgets.add(template(text));
}
return widgets;
}
// widget template
Widget template(String text) {
return Container(
margin: EdgeInsets.all(10),
decoration: BoxDecoration(
color: Colors.deepPurpleAccent,
borderRadius: BorderRadius.circular(20),
),
height: 150,
width: 150,
child: Center(
child: Text(
text.toUpperCase(),
style: TextStyle(
color: Colors.white,
fontSize: 24,
fontWeight: FontWeight.bold,
),
),
),
);
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
backgroundColor: Theme.of(context).colorScheme.inversePrimary,
title: Text(widget.title),
),
body: ListView(
children:
buildList('vertikal', 2) +
[
SizedBox(
height: 170,
child: ListView(
scrollDirection: Axis.horizontal,
children: buildList('horizontal', 6),
),
),
] +
buildList('vertikal', 3) +
[
SizedBox(
width: double.infinity,
height: 340,
child: GridView.count(
scrollDirection: Axis.horizontal,
crossAxisCount: 2,
children: buildList('Gridview', 12),
),
),
],
),
);
}
}
Editor is loading...
Leave a Comment