mvww11
mvww11

Reputation: 33

How to make a Widget come from below and stack itself on top of current screen?

In Duolingo's app, there is an element that comes animated from the bottom and displays some text every time you answer a question (see image below).

How to replicate that feature with Flutter?

enter image description here

Upvotes: 0

Views: 332

Answers (2)

Payam Asefi
Payam Asefi

Reputation: 2757

You can use showModalBottomSheet widget. Here is a simple usage of this widget:

  showModalBottomSheet(
  context: context,
  builder: (BuildContext bc){
      return Container(
        child: new Wrap(
        children: <Widget>[
         new ListTile(
          leading: new Icon(Icons.music_note),
           title: new Text('Music'),
          onTap: () => {}          
         ),
         new ListTile(
          leading: new Icon(Icons.videocam),
          title: new Text('Video'),
          onTap: () => {},          
         ),
        ],
      ),
      );
  }
);

Upvotes: 1

littleironical
littleironical

Reputation: 1914

You can read an article about how to use Bottom sheets here

I hope this will help you.

Upvotes: 0

Related Questions