Scaffold Widget will provide a basic material design layout.
Properties
- appBar
- body
- floatingActionButton
- drawer
- bottomNavigationBar
- backgroundColor
- floatingActionButtonAnimator
- primary
- drawerScrimColor
- bottomSheet
- drawerDragStartBehaviour
- drawerEdgeDragWidth
- drawerEnableOpenGesture
- endDrawer
- endDrawerEnable0penGesture
- extendBody
- extendBodyBehindAppBar
- floatingActionButtonLocation
- persistentFooterButton
- resizeToAvoidBottominsets
Example:
import 'package:flutter/material.dart';
void main() => DemoApp();
class DemoApp extends StatefulWidget {
@override
State<StatefulWidget> createState() {
return DemoAppState();
}
}
class DemoAppState extends State<DemoApp> {
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'App Title',
home: Scaffold(
appBar: AppBar(
title: const Text('App title'),
),
body: const Center(
child: Text('Hello'),
),
floatingActionButton: FloatingActionButton(
child: const Icon(Icons.add),
onPressed: () {},
),
bottomNavigationBar: BottomNavigationBar(
items: const [
BottomNavigationBarItem(icon: Icon(Icons.home), label: 'Home'),
BottomNavigationBarItem(
icon: Icon(Icons.add_chart), label: 'Chart'),
],
),
backgroundColor: Colors.grey,
drawer: const Drawer(
child: Text('Demo'),
),
),
);
}
}
Video Link: