import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Home(),
    );
  }
}

class Home extends StatefulWidget {
  @override
  _HomeState createState() => _HomeState();
}

class _HomeState extends State<Home> {
  @override
  Widget build(BuildContext context) {
    return DefaultTabController(
      length: 3,
      child: Scaffold(
        appBar: AppBar(
          title: Text("AppBar"),
          backgroundColor: Colors.purple,
          brightness: Brightness.dark,
          leading: Icon(Icons.menu),
          actions: [
            IconButton(icon: Icon(Icons.settings), onPressed: () {}),
          ],
          bottom: TabBar(
            tabs: [
              Tab(icon: Icon(Icons.notifications)),
              Tab(icon: Icon(Icons.search)),
              Tab(icon: Icon(Icons.person)),
            ],
          ),
        ),
        body: TabBarView(
          children: [
            Icon(Icons.notifications),
            Icon(Icons.search),
            Icon(Icons.person),
          ],
        ),
      ),
    );
  }
}
View Compiled

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.