SilverAppbar

main.dart

import 'package:flutter/material.dart';
  
  void main() => runApp(CustomScrollViewComponent());
class CustomScrollViewComponent extends StatefulWidget {
  @override
  _CustomScrollViewComponentState createState() =>
      _CustomScrollViewComponentState();
}

class _CustomScrollViewComponentState extends State<CustomScrollViewComponent> {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
        home: Scaffold(
      endDrawer: Drawer(),
      body: Builder(builder: (
        context,
      ) {
        return SafeArea(
          child: Material(
            child: CustomScrollView(
              slivers: [
                SliverPersistentHeader(
                  delegate: MySliverAppBar(
                      appBar: AppBar(
                        leading: BackButton(),
                        actions: [
                          IconButton(
                              icon: Icon(Icons.menu),
                              onPressed: () {
                                Scaffold.of(context).openEndDrawer();
                              }),
                        ],
                        backgroundColor: Colors.transparent,
                        elevation: 0,
                      ),
                      expandedHeight: MediaQuery.of(context).size.height * 0.3),
                  pinned: true,
                ),
              ],
            ),
          ),
        );
      }),
          ),
    );
  }
}

class MySliverAppBar extends SliverPersistentHeaderDelegate {
  final double expandedHeight;
  final AppBar appBar;

  MySliverAppBar({
    @required this.expandedHeight,
    this.appBar,
  });

  @override
  Widget build(
      BuildContext context, double shrinkOffset, bool overlapsContent) {
    return Stack(
      fit: StackFit.expand,
      overflow: Overflow.visible,
      children: [
        Container(
          decoration: BoxDecoration(
            gradient: LinearGradient(
              begin: Alignment.topCenter,
              end: Alignment.bottomCenter,
              colors: [
                Color.fromRGBO(29, 75, 136, 1.0),
                Color.fromRGBO(18, 57, 99, 1.0)
              ],
            ),
          ),
        ),
        Positioned(
          top: expandedHeight / 1.7 - shrinkOffset,
          left: MediaQuery.of(context).size.width / 3.5,
          child: CircleAvatar(
            radius: MediaQuery.of(context).size.width / 4.3,
            backgroundColor: Colors.yellow,
            child: CircleAvatar(
              radius: MediaQuery.of(context).size.width / 4.6,
              backgroundImage: NetworkImage(
                  'https://pm1.narvii.com/7219/b493e34427e645f3fb82d09f2185a177d9230392r1-466-658v2_00.jpg'),
            ),
          ),
        ),
        Positioned(
          left: 0,
          top: 0,
          right: 0,
          child: appBar,
          height: kToolbarHeight,
        ),
      ],
    );
  }

  @override
  double get maxExtent => expandedHeight;

  @override
  double get minExtent => kToolbarHeight;

  @override
  bool shouldRebuild(SliverPersistentHeaderDelegate oldDelegate) => true;
}