Flutter Appbar with Example

The Flutter AppBar is a Material Design widget that provides a top app bar for an application. Some of the commonly used properties of the AppBar are:

1. title: A widget that displays the primary content of the app bar. The title is usually set to a Text widget with the string that represents the title of the app.
2. backgroundColor: The background color of the app bar.
3. leading: A widget that is placed at the start of the app bar. It is often used to display a menu button or back button.
4. actions: A list of widgets that are placed at the end of the app bar. These widgets are usually used to represent actions such as search, settings, or other options.
5. centerTitle: A boolean value that determines if the title is centered in the app bar. If set to true, the title is centered, and if set to false, the title is positioned at the start of the app bar.
6. elevation: The z-coordinate of the app bar. It determines the shadows that are cast by the app bar.
7. iconTheme: An IconThemeData object that is used to control the color and size of the icons in the app bar.
8. textTheme: A TextTheme object that is used to control the style of the text in the app bar.

By setting the values of these properties, you can customize the appearance and behavior of the Flutter AppBar to fit the needs of your application.

Here’s an example of how to use an AppBar in Flutter:

import 'package:flutter/material.dart';

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text('Flutter AppBar Example'),
        ),
        body: Center(
          child: Text('This is the body of the app'),
        ),
      ),
    );
  }
}

In this example, the AppBar widget is a child of the Scaffold widget, which is the root of the app’s visual structure. The AppBar has a title property, which is set to a Text widget with the string “Flutter AppBar Example”.

You can customize the appearance of the AppBar by setting its properties. For example, you can change the background color, add leading and trailing widgets, and change the elevation.