how to show an Info dialog in the bottom right corner of the screen like Youtube-CodePudding

I need to show an info dialog in the bottom right corner of the screen; an example is when I upload a new video on Youtube, it shows something like this dialog on Youtube there is some Widget for something like this? thanks in advance

CodePudding user response：

You can create an overlay entry, give it the correct position and add it to the context.

var overlayEntry = OverlayEntry(
  builder: (BuildContext context) {
    return YourWidget();
);

Then add it to the context whenever needed :

Overlay.of(context)!.insert(overlayEntry!);

You could also use a Tooltip widget if what you want to show is just a text. Create a SizedBox() and position just below where you want to have the dialog, wrap it with a Tooltip widget. Give the tooltip a global key, set the trigger type to manual and whenever needed show it.

final key = GlobalKey<State<Tooltip>>(); 

Tooltip(
   key: key,
   message: your text
   child: SizedBox(),
   triggerMode: TooltipTriggerMode.manual,)

and show it with :

void showDialog(GlobalKey key) {
var tooltip = key.currentState;
tooltip?.ensureTooltipVisible();}