Bottom popup overlay UI

[TheLakshya (Lakshya Pratap)]

Can anyone help me achieve this UI…Means this bottom popup overlay design…

[Saezy (Farhad Stanekzay)]

You can use Alpha Dialog by ZainulHassan

[UPDATE] Free Alpha Dialog | Transparent Dialogs, Custom Toasts and much more

Alpha Dialog Extension Alpha Dialog is a simple yet powerful and easy to use extension that you can use freely in your projects to create awesome and unique dialogs. The extension allows you create transparent dialogs, full screen dialogs and by using a very simple technique you can use custom color for dim. Docs [create dialog] Create Dialog using ant visible component. Set cancel-able to true or false [show dialog] Show dialog [dismiss dialog] Dismiss Dialog [on show] This bl…

The method is shown very helpfully in his post so I hope this helps you.

[TheLakshya (Lakshya Pratap)]

thanks for your quick reply @Saezy , but this is not what i was looking for…let me help you with the design…

I am talking about the bottom popup that emerges

[Saezy (Farhad Stanekzay)]

Copy the same style as this (from Alpha dialog link above) but put it at the bottom and fill the width. Then use animations to create the pop in effect.

[TheLakshya (Lakshya Pratap)]

its okay but i didnt find anything related to width and bottom as you said…can you guide me with an aia?

[Still-learning (1-2-3-4...)]

@TheLakshya .

It is Very simple. Use bottom sheet block

1. While Screen initialise, register the bottom sheet with required vertical arrangement.
2. Add your components in the vertical arrangement.
3. When the user hits the button, fire the bottom sheet to pop up.

It will gives you what you want just try and enjoy

[iamwsumit (Sumit Kumar)]

@Still-learning

It is Very simple. Use bottom sheet block

Well @Still-learning It is not possible with Bottom sheet because bottom sheet does not allow transparent background

@TheLakshya Use this guide and you are good to go

Make Custom Bottom Round Sheet [Guide]

Hello everyone I have created rounded bottom sheet and today I am presenting here how to create it Screen1 [Without any extension] Component required Screenshot [Screenshot (14)] Blocks Images [blocks (8)] Video output of screen1 As u can see in screen1 Bottom sheet is looking very low corner round In this case I used an extension that I have taken from https://community.thunkable.com/t/extension-change-the-design-of-the-button/36717 Same component required on screen2 but w…

[Still-learning (1-2-3-4...)]

But i have tried like this, and i happy with that…

[TheLakshya (Lakshya Pratap)]

OMG i was just unaware of this component…thanks a lot

[iamwsumit (Sumit Kumar)]

@Still-learning

But i have tried like this, and i happy with that…

And look at the background it is white however, @TheLakshya want a dark background that is not possible with Bottom Sheet component

[TheLakshya (Lakshya Pratap)]

But i am able to get a dim dark background…with bottom sheet

[oseamiya]

@iamwsumit has already said that you cant achieve dark background with the bottom sheet component and has provided you a guide. See there :

Bottom popup overlay UI

Well @Still-learning It is not possible with Bottom sheet because bottom sheet does not allow transparent background @Lakshya_Pratap1 Use this guide and you are good to go