[UPDATE]Get your Dynamic Drop-down here

I quickly made a small project from a drop-down menu

It has 455 blocks with style and animation. Can be optimized for performance at the expense of style.

Remix : REMIX

Update 07/12/2020 Thanks @drted for the idea of adding several on the screen

6 Likes

Nice! If I want 2 on a screen, how many blocks do I need?

2 Likes

I hadn’t thought about it lol! I’ll do that tomorrow and send but I’d say between 100 and 200 more.

well great work
how u put animations?

With delay.

Amazing been looking for how to do this

150 blocks it too much. All what you need is
1- text input field
2- a button to show the arrow image (if needed)
3- listviwer with loaded with choices

You will achieve same results. :grin:

2 Likes

The text input is bad it opens the keyboard, even if you close the keyboard as soon as you press it opens 0.5 seconds. I started with the text input before.

And if you disable text input the click event is not taken into account.

1 Like

I use text input if I want to enable search option of the list otherwise I use a label component which does not interact with the keyboard.

Ah okay yes you’re right the text input is useful when searching. But how many blocks do you take if you need to have several dropdown on the screen ?

@kushweez,
check this example
Dropdown Example

@muneer Yes indeed it does not consume much.
But let’s say you have to create the interface according to the user data and options and you generate 5 or 6 or 10 depending on the options. Your way works only if you are sure to have the list there.

hmm…
u removed animations but y

I simply animated the addition to the list.
Before I used labels now a simple list.

But it’s possible to animate it by adapting the size of the column to each addition in the list, which creates the effect.

@kushweez,
I populated the list in the code for simplicity only but you are welcome to get the options in the list from a data source. Nothing will change.
This method will work exactly the same.
Should you want, I can create a local data source and connect it to the listviwer then you can add or remove from the data source itself and see for yourself that this coding is dynamic.

Happy Thunking :grin:

1 Like

kk
but u totally removed animations broooooo

@kushweez,
I forgot to send you the link for the sample with options of the list from a data source to be controlled by user/developer

1 Like

Thank you very much @muneer

1 Like