Berikut adalah source code untu membuat menu navigation drawer ada
flutter
import 'package:flutter/material.dart';
void main()
=> runApp(DrawerLayout());
class
DrawerLayout extends StatelessWidget {
final appTitle =
'Navigation
Drawer';
@override
Widget
build(BuildContext context) {
// TODO:
implement build
return
MaterialApp(
title:
appTitle,
home:
HomeAPP(title: appTitle),
);
}
}
class HomeAPP extends
StatelessWidget {
final String
title;
HomeAPP({Key
key, this.title}) : super(key: key);
@override
Widget
build(BuildContext context) {
// TODO:
implement build
return Scaffold(
appBar:
AppBar(
title:
Text(title),
),
body:
Center(child: Text('My Home Page')),
drawer:
Drawer(
child:
ListView(
padding:
EdgeInsets.zero,
children:
<Widget>[
DrawerHeader(
child: Text("Drawer
header"),
decoration:
BoxDecoration(color: Colors.green)),
ListTile(title:
Text('Menu 1'), onTap: () {}),
ListTile(title:
Text('Menu 2'), onTap: () {}),
ListTile(title:
Text('Menu 3'), onTap: () {}),
],
),
),
);
}
}
Dari
script code diatas terlihat beberapa kode penting yang digunakan untuk membuat
navigasi yaitu :
drawer: Drawer(
child: ListView(
padding:
EdgeInsets.zero,
children:
<Widget>[
DrawerHeader(
child: Text("Drawer
header"),
decoration:
BoxDecoration(color: Colors.green)),
ListTile(title: Text('Menu 1'), onTap: () {}),
ListTile(title: Text('Menu 2'), onTap: () {}),
ListTile(title: Text('Menu 3'), onTap: () {}),
],
),
),
Hasil dari source code diatas dapat
dilihat pada demo video dibawah
Tidak ada komentar:
Posting Komentar