How do we change button/label height in code?

I want to code it so that a label’s height (can also be button’s height) to change when a variable is changed. However, there is no “set label height to” block for the new Thunkable Drag and Drop version. Is there a way I can code this? Or do I have to use an image instead?

2 Likes

Welcome to Thunkable.

This feature is currently not available in the DnD (new) version. It can be found only in StP (old) version

1 Like

This is certainly one way to do it! I am working on an app in DND and that is exactly what I did!

I used icons8.com but You could also create them in figma pretty easily!

What kind of app are you building?!

1 Like

I’m new to thinkable and I’ve just discovered I cant set the width or height in blocks for any components - frustratingly the documentation shows this setting is available in the drag and drop interface Button - Thunkable Docs
https://docs.thunkable.com/v/drag-and-drop/image-1#width

Ultimately I’m struggling to understand how I can stop my components from stretching on wider screens?

Welcome to Thunkable.

Note that Thunkable has two UI designer platforms, StP (Snap to Place) and DnD (Drag and Drop). It seems to me that you are using DnD and viewing the documentation of StP or the other way round.

If you are using StP the just set the size of your your component as absolute so that it stays as is despite of the difference device sizes.

[Edit]
I just checked the documentation again and I believe there is a mistake. In DnD there is no option to change the size. This option is only available in StP.

hi thanks
yes the documentation for UI components in DND is incorrect - I’ve spent ages trying to figure why I couldn’t see the setting!
anyway I see I can set this in the STP version but is there a way to convert my DND app to STP - there doesn’t seem to be an obvious option/convertor?

1 Like

Unfortunately NO. You will have to start from scratch.

1 Like

oh not so good -
In what use cases/scenarios would you want to use DND over STP? - it feels like the limitations preclude it for being a platform for developing anything responsive/iOS / ultimately DND is still in beta
Thanks for your help

1 Like

I use DnD for quick prototyping or for projects that don’t require full production. For example, my daughter and I are designing a board game and we needed an app to do percentage calculations. So I took about an hour and made an app to accompany our game. It would have taken slightly longer in StP. But I didn’t need anything complex so I used DnD. But if I’m going to publish an app, I’m probably going to use StP because it’s less limited.

1 Like

I’ve been playing around with DND I’ve found I can change the height of any component - but only under certain circumstances
starting with a blank screen in design mode and add a group
In Blocks Go to ‘Any Component’ and there’s an option for setting the group height
When you use the block it throws up a warning - but it does work
If you change the name of the component to an image or button (below) it will also work.
If you add any other components and delete the block - the option disappears from the menu!
Unfortunately I can’t find a way to change the width of a group -
when Screen4

When I do that in DnD, I don’t have the option to set the height for a group:

Hi
it only appears in the ‘any component’ menu if a group is the only component on the screen (if you add any other component it disappears).
but once you use it it stays - albeit with the error.
(you cant access height from the drop-down)
I’ve built a simple demo at
https://x.thunkable.com/projects/61e009f8846bfc0010918e25/816b6e3a-a24e-4d7c-a5c3-f2157bda6acf/designer

vertical loading bar! - it allows you to grow/animate an objects height -
https://x.thunkable.com/projects/61e00e4dab4b620011d8a0bf/4d0bea70-7bed-4bfd-977a-3a09b274446f/blocks

cant help thinking thunkable should fix this feature, add a width option and option to constrain the grouped objects

This topic was automatically closed 90 days after the last reply. New replies are no longer allowed.