title: Flutter: hide and display app bar in scrolling detected
body: <p>I'm having trouble with app bar animation, I'm using <code>SilverAppBar</code>, in my app. So, the problem is when I'm in the middle of my list and I scroll up, the app bar does not appear, but it appears just when scrolling reaches the top of the items list. I already tested the <code>snap</code> parameter and give it <code>true</code>, but not the result I expect. I have ideas about creating a custom animation for this, but I'm not too experienced in Flutter, and also if there is a way to add parameters, or another widget that will work for my situation, it would be great.</p>
  
  <p>The actual code of the demo I'm using: </p>
  
  <pre><code>  Widget _search() =&gt; Container(
          color: Colors.grey[400],
          child: SafeArea(
              child: Container(
            child: Padding(
              padding: const EdgeInsets.all(8.0),
              child: TextField(
                enabled: false,
                style: TextStyle(fontSize: 16, color: Colors.white),
                decoration: InputDecoration(
                  prefix: SizedBox(width: 12),
                  hintText: "Search",
                  contentPadding:
                      EdgeInsets.symmetric(horizontal: 32.0, vertical: 14.0),
                  border: InputBorder.none,
                ),
              ),
            ),
          )),
        );
  
    Container _buildBody() {
      return Container(
          child: new GridView.count(
        crossAxisCount: 2,
        children: List.generate(100, (index) {
          return Center(
            child: Text(
              'Item $index',
              style: Theme.of(context).textTheme.headline,
            ),
          );
        }),
      ));
    }
  
    @override
    Widget build(BuildContext context) {
      return new Scaffold(
          resizeToAvoidBottomPadding: false,
          body: new NestedScrollView(
              headerSliverBuilder:
                  (BuildContext context, bool innerBoxIsScrolled) {
                return &lt;Widget&gt;[
                  new SliverAppBar(
                    title: Text("Demo",
                        style: TextStyle(
                          color: Colors.white,
                        )),
                    pinned: false,
                    floating: true,
                    forceElevated: innerBoxIsScrolled,
                  ),
                ];
              },
              body: new Column(children: &lt;Widget&gt;[
                _search(),
                new Expanded(child: _buildBody())
              ])));
    }
  </code></pre>
  
  <p>The result I have now:
  <a href="https://i.stack.imgur.com/WHIpH.gif" rel="nofollow noreferrer">Image 1</a></p>
  
  <p>The result I got after giving <code>true</code> to the <code>snap</code> parameter:
  <a href="https://i.stack.imgur.com/QVjfH.gif" rel="nofollow noreferrer">Image 2</a></p>
  
  <p>Plenty of applications like WhatsApp, Facebook, LinkedIn ... have this animating app bar. To explain more what exactly I expect with this animating app bar, I added an example of Google Play Store, showing the wanted animation: <a href="https://i.stack.imgur.com/wwCTL.gif" rel="nofollow noreferrer">Play Store example</a></p>