Custom Rounded appbar in flutter

Issue

Screenshot of Customise Appbar :

I want to make a Custom app bar like in the photo
Can anybody help me in creating this i had searched a lot but not found anywhere

Solution

I don’t think it is a rounded appBar but a rounded container below it.

I have added backgroundColor in the Scaffold which matches with the background color of AppBar. Also, I have set the elevation of AppBar to 0 to prevent shadow.

import 'package:flutter/material.dart';

class TempMyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Test App',
      home: Scaffold(
        backgroundColor: Colors.indigo.shade800,
        appBar: AppBar(
          title: Text(
            'Test App',
          ),
          elevation: 0,
          backgroundColor: Colors.indigo.shade800,
        ),
        body: Container(
          decoration: BoxDecoration(
            borderRadius: BorderRadius.only(
              topLeft: Radius.circular(60),
              topRight: Radius.circular(60),
            ),
            color: Colors.white,
          ),
        ),
      ),
    );
  }
}

Answered By – Ashesh Shrestha

Answer Checked By – Robin (FlutterFixes Admin)