João Martins
João Martins

Reputation: 794

Expandable AppBar (onPressed)

How do I achieve this effect? I wanted to expand my AppBar after clicking on the dates.

Collapsed AppBar

Expanded AppBar

Upvotes: 6

Views: 2737

Answers (1)

Constantin N.
Constantin N.

Reputation: 2839

The simplest way is to bring toggle a veriable then change the height of the bottom widget.

Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
        actions: [IconButton(icon: Icon(Icons.place),onPressed: (){
          setState((){
            isOpen = !isOpen;
          });
        })],
        bottom: PreferredSize(child: isOpen? Container(color:Colors.red, height: 100):Container(),preferredSize:Size.fromHeight(isOpen? 100:0) ,)
      ),)

Upvotes: 7

Related Questions