Thunkable Drag and Drop Docs are Here!

Hi everyone :wave:,

You may remember an announcement we made in December concerning 👩‍🎨 The future of UI design in Thunkable, which revealed our fabulous new Drag and Drop UI and invited you to try it for yourself.

Well after some tweaks and some updates, we have a lovely set of docs for you to check out!

A lot of the layout content has been removed, since it’s not necessary in the new UI, and we have added information about adding invisible components to your app from the blocks.

We hope it encourages you to try building a drag and drop app!

See the new docs at đź‘‹ Welcome to Thunkable - Thunkable Docs

Don’t worry - the current docs are still in exactly the same place!

You can switch between the current set of docs and the Drag and Drop docs at any time by selecting an option from the top banner of the docs:

Happy Thunking :rainbow:

8 Likes

Woahhh This is so good!!

1 Like

Thank you! We hope you find them useful :rainbow:

cool i was really finding something like this…
well
im waiting for the features to get completed

But I cant see drag and drop interface

Hi there,

When you create a new project, you will see a checkbox in the create project modal that asks if you want to try out Thunkable’s new drag and drop interface

If you check this checkbox, as seen in the above screenshot, you can start building with the drag and drop interface!

2 Likes

well now things are easy to place and it will look neat

1 Like

Hi there,

Our most recent update brought AdMob Banners and Switches to the Drag and Drop UI.

What features are you looking forward to seeing in the Drag and Drop UI?

2 Likes

Definitely! Designing your app’s UI is much easier with the Drag and Drop project builder :grin:

1 Like

Hi! I think in the next update of Thunkable X, you should add a dropdown component. E.g. if we are making a translator app, in the code we can do “in translator1 call translate…” and e.g. we have to translate it from english to chinese, we can do “in translator1 call translate…” and in the dropdown we can select chinese language to be translated to it

Hi there,

This is how the Translate block looks in the Drag and Drop UI! You can find more info on our Translator block in the Drag and Drop docs :grin:

@dhairyahrathixxvwh It’s possible to make a dropdown using thunkable,
Firstly add a button then add an invisible list below the button and then when the button is clicked set the list to be visible and then when a list viewer item is clicked get the text of that item and the set the button’s text to the item’s text.

Hi,
I am looking forward to a feature, which converts your Snap to Place project to Drag and Drop projects.
Thanks!

3 Likes

Hello @jane I don’t know if it’s only me.
But I don’t see the switch in the designer.
Is this stil in the make or not?
Also I am really looking forwad to see a way to create custom lists in the drag and drop UI.
And my editor seems to be having a lot of lag when adding assets.
The designer doesn’t display them.
Also the drop down menus have a lot of lag.

1 Like

Hi there,

I apologize for this miscommunication. We have a Switch ready to go on the Drag and Drop UI, it’s ready to be released, and we tested it in our previous internal testing session. My understanding was that it would be released after the testing session went well, but the setting that makes it visible to all Thunkers, instead of just staff, wasn’t changed. I brought this up with the team today and the Switch really should be made publicly available today!

Thanks for the tag, this should be sorted out ASAP :slight_smile:

4 Likes

I use a trick of my own.
I have a screen created in the Legacy UI and saved and whenever I need a switch in the DnD UI, I just add from saved screen then use the switch in the existing screen. And it works.

2 Likes

Hi !

Well, there is no doubt (as a designer), this drag and drop version is awesome ! It’s much easier to add images, buttons…
But (as always there is one) when we’ll all the features from the “normal” version will be moved to this one ?
I’ve heard that you didn’t really know in January :confused:
Do you have a better idea now ? I’m so excited !!!

Thanks for all your work :slight_smile:

Have a nice day !

4 Likes

There is no option to align the objects, i made the app when i test it on phone it is fine but tested it on the ipad and objects are all over the screen , i cannot find a ui property or a block that can align them in center.

How to set a 10 seconds countup timer in drag and drop?

1 Like

Use the timer component in the Blocks screen. The default is 1 second but you can change it to whatever you want.