AppBar
- leading
- title
- actions
Properties:
- actions
- actionslconTheme
- automaticallyImplyLeading
- backgroundColor
- backwardsCompatibility
- bottom
- bottomOpacity
- brightness
- centerTitle
- elevation
- excludeHeaderSemantics
- flexibleSpace
- foregroundColor
- iconTheme
- leading
- leadingWidth
- preferredSize
- primary
- shadowColor
- shape
- systemOverlayStyle
- textTheme
- title
- titleSpacing
- titleTextStyle
- toolbarHeigh
- toolbarOpacity
- toolbarTextStyle
Example 1:
import 'package:flutter/material.dart';
void main() {
runApp(
MaterialApp(
home: Scaffold(
appBar: AppBar(
leading: const Icon(Icons.account_box),
leadingWidth: 300,
),
body: Container(),
),
),
);
}
Example 2:
import 'package:flutter/material.dart';
void main() {
runApp(
MaterialApp(
home: Scaffold(
appBar: AppBar(
leading: const Icon(Icons.account_box),
leadingWidth: 300,
),
drawer: const Drawer(),
body: Container(),
),
),
);
}
Example 3:
AppBar(
title: const Text('Name'),
),
Example 4:
AppBar(
title: Container(
child: Image.network('https://cdn.pixabay.com/photo/2017'),
centerTitle: true,
),
),
Example 5:
AppBar(
actions: const [
Icon(Icons.more_vert),
],
),
Example 6:
AppBar(
backgroundColor: Colors.lime,
actions: const [Icon(Icons.more_vert)],
),
Example 7:
AppBar(
backgroundColor: Colors.lime,
actions: const [Icon(Icons.more_vert)],
actionsIconTheme: const IconThemeData(
color: Colors.purple,
),
),
Example 8:
AppBar(
backgroundColor: Colors.lime,
actions: const [Icon(Icons.more_vert)],
actionsIconTheme: const IconThemeData(
color: Colors.purple,
size: 58,
),
),
Example 9:
AppBar(
title: const Text('Title'),
textTheme: const TextTheme(
headline6: TextStyle(
color: Colors.yellow,
fontSize: 30,
)),
),
Example 10:
AppBar(
toolbarHeight: 150,
toolbarOpacity: 0.5,
title: const Text('Hello'),
),
Video Link: