title: Flutter Custom SliverAppBar
body: <p>I would like to understand if there's a way to make the default sliver app bar in flutter to look more like this design I found online.</p>
  <p><a href="https://i.stack.imgur.com/mOLr9.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/mOLr9.png" alt="enter image description here" /></a></p>
  <p>PS: I am familiar with the default way of doing this but to make use of flutter's extensively customizable widgets in this scenario seems to be the issue.</p>
  <p>Here's what I've done. Can't seem to have a way to round the bottom edges or achieve the non-default sliver app bar behavior.</p>
  <pre><code>return SafeArea(
    child: Scaffold(
      body: CustomScrollView(
        slivers: [
          SliverAppBar(
            automaticallyImplyLeading: false,
            expandedHeight: height * 0.35,
            pinned: false,
            floating: true,
            leading: IconButton(
              onPressed: () =&gt; Navigator.pop(context),
              icon: Icon(
                Icons.chevron_left,
                color: Theme.of(context).primaryColor,
              ),
            ),
            flexibleSpace: FlexibleSpaceBar(
              background: Container(
                decoration: BoxDecoration(
                  borderRadius: BorderRadius.only(bottomLeft: Radius.circular(20.0), bottomRight: Radius.circular(20.0))
                ),
                child: Stack(
                  children: [
                    Image.network(
                      'https://picsum.photos/200',
                      fit: BoxFit.cover,
                    ),
                    Container(
                      width: width,
                      height: height * 0.35,
                      color: Colors.redAccent,
                    ),
                  ],
                ),
              )
            ),
          ),
          SliverFillRemaining(
            child: Column(
              children: List&lt;int&gt;.generate(6, (index) =&gt; index)
                  .map((index) =&gt; Container(
                        height: 40,
                        margin: EdgeInsets.symmetric(vertical: 10),
                        color: Colors.grey[300],
                        alignment: Alignment.center,
                        child: Text('$index item'),
                      ))
                  .toList(),
            ),
          )
        ],
      ),
    ),
  );
  </code></pre>
  <p>Thanks.</p>