Flutter: Is there a way to make sliverAppBar disappear when pressing a button

Issue

I was wondering if there is a way to make the sliverAppBar disappear once a button has been pressed. Instead of just scrolling.

Solution

yes, it is possible. checkout below example.

import 'package:flutter/material.dart';

  class Ch1 extends StatefulWidget {

    @override
    _Ch1State createState() => _Ch1State();
  }

  class _Ch1State extends State<Ch1> {
    bool check = true;

    @override
    Widget build(BuildContext context) {
      return Scaffold(
        body: NestedScrollView(
          headerSliverBuilder: (BuildContext context, bool innerBoxIsScrolled) {
            return <Widget>[
               if(check)SliverAppBar(
                expandedHeight: 200.0,
                floating: false,
                pinned: true,
                flexibleSpace: FlexibleSpaceBar(
                    centerTitle: true,
                    title: Text("Collapsing Toolbar",
                        style: TextStyle(
                          color: Colors.white,
                          fontSize: 16.0,
                        )),
                    background: Image.network(
                      "https://images.pexels.com/photos/396547/pexels-photo-396547.jpeg?auto=compress&cs=tinysrgb&h=350",
                      fit: BoxFit.cover,
                    )),
              ),
            ];
          } ,
          body: Center(
            child: InkWell(
              onTap: (){
                setState(() {
                  check= !check;
                });
              },
                child: Text("Press"),
            ),
          ),
        ),
      );
    }
  }

Answered By – Viren V Varasadiya

Answer Checked By – Clifford M. (FlutterFixes Volunteer)

Leave a Reply

Your email address will not be published. Required fields are marked *