title: Sliver app bar background color not working
body: <p>I have a sliver app bar with the background of the same color as the color or the contents that are scrolled under it, therefore making the appbar blend with the contents. Is there any way I can completely hide the contents that are beneath the SliverAppBar?</p>
  <p>So as you can see below, the background color of the main app bar is the same as the background color of what follows(the contents).</p>
  <pre><code>CustomScrollView(
        controller: controller,
        slivers: [
  // This should be the main app bar where the contents have to be behind it
          SliverAppBar(
              toolbarHeight: 36,
              centerTitle: true,
              title: showChatTitle
                  ? const Text(
                      'Chats',
                      style: TextStyle(fontSize: 13, color: Colors.black),
                    )
                  : null,
              pinned: true,
              floating: true,
              elevation: 0,
              backgroundColor: Colors.grey.withOpacity(0.002),
              leading: Container(
                margin: const EdgeInsets.only(left: 14, top: 10),
                child: const Text(
                  'Edit',
                  style: TextStyle(color: Colors.blue, fontSize: 12.5),
                ),
              ),
              actions: [
                IconButton(
                  onPressed: () {},
                  icon: const Icon(
                    Icons.edit_calendar,
                    color: Colors.blueAccent,
                  ),
                ),
              ]),
  //--------------------------------------------------------------------
  
  // Contents follows now
          SliverAppBar(
            toolbarHeight: 45,
            elevation: 0,
            pinned: pinChatText,
            foregroundColor: Colors.black,
            backgroundColor: Colors.grey.withOpacity(0.002),
            title: const Text(
              'Chats',
              style: TextStyle(
                fontSize: 25,
                fontWeight: FontWeight.bold,
                color: Colors.black,
              ),
            ),
          ),
          SliverPadding(
            padding: const EdgeInsets.symmetric(horizontal: 10),
            sliver: SliverAppBar(
                toolbarHeight: searchBarHeight,
                floating: false,
                shape: RoundedRectangleBorder(
                  borderRadius: BorderRadius.circular(5),
                ),
                foregroundColor: Colors.black,
                backgroundColor: Colors.grey.withOpacity(0.2),
                title: Text.rich(
                  TextSpan(
                    style: TextStyle(
                      fontSize: 15,
                      color: Colors.grey.withOpacity(textColorOpacity),
                    ),
                    children: [
                      WidgetSpan(
                        child: Icon(
                          Icons.search,
                          color: Colors.grey.withOpacity(textColorOpacity),
                          size: 17,
                        ),
                      ),
                      const TextSpan(
                        text: ' Search',
                      )
                    ],
                  ),
                )),
          ),
          SliverList(
              delegate: SliverChildListDelegate(
            [
              Padding(
                padding: const EdgeInsets.only(left: 8.0, right: 8, top: 15),
                child: Row(children: const [
                  Text(
                    'Broadcast Lists',
                    style: TextStyle(
                      color: Colors.blueAccent,
                    ),
                  ),
                  Spacer(),
                  Text(
                    'New Group',
                    style: TextStyle(
                      color: Colors.blueAccent,
                    ),
                  )
                ]),
              ),
              ListView.builder(
                shrinkWrap: true,
                itemCount: 20,
                itemBuilder: (context, index) =&gt; Column(
                  children: const [
                    ChatItem(),
                    Divider(
                      indent: 50,
                      thickness: 0.4,
                    )
                  ],
                ),
              ),
            ],
          ))
        ],
      );
  
  </code></pre>