Flutter || Add text below AppBar


There is an application page that is responsible for displaying devices. There is a code that returns AppBar, Body, Drawer.
Question: how do I put the description "List of devices" between AppBar and Body (as in the photo)

sample of output

  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        automaticallyImplyLeading: true,
        backgroundColor: Colors.black,
        title: const Text('IT', style: TextStyle(fontSize: 45,
                                   fontWeight: FontWeight.w800,
                                    color: Colors.white)),
        centerTitle: true,
        actions: [
            icon: const Icon(Icons.filter_alt,
                             size: 30.0,),
            color: Colors.white,
            onPressed: () {
              showDialog<Filter>(context: context, builder: (_) {
                return FilterDialog(onApplyFilters: _filter,);

      body: PhonesList(phones: filteredPhones),

      drawer: Drawer(.....),


you use appbar bottom … and customization

 bottom: PreferredSize(
                child: Container(
                  color: Colors.white,
                  child: row(
          preferredSize: Size.fromHeight(kToolbarHeight)

Answered By – Jamirul islam

Answer Checked By – Marilyn (FlutterFixes Volunteer)

Leave a Reply

Your email address will not be published. Required fields are marked *