Request IPad IPhone design mode

Hello,
It would be awesome if we could switch the view from iPhone to iPad to adapt the app for the two screens

Same! You should throw this into the git repository! I think a lot of us woudl like this. Not oly for the iPad for for screens larger than 4-6 inches in general.

My iphone 11 displays way different than some smaller android screens. and then my friends big iPad displays things even more differently. I imagine this is a difficult fix and low on the priority list but would be cool in the future.

3 Likes

Hi, @jared & @danyklein! :wave:

I also need this thing, I am on the same boat with you.
But, I now have my app responsive, through this -

image

Relative/Responsive sizing could be a good way, to make your app support many devices.

:+1:

Thanks! :blush:

1 Like

I specifically am thinking of the ability to add lore things on the screen without making them smaller! You are right, though, @kartik14, I use those settings too for optimal results.

1 Like

There are ready-made tools for styling the browser, for example, Stylish, but there was information that this plugin steals data, so I will show a manual method.

Suppose you want to display a button that is 800px wide:

  1. Open the project in the browser in the designer mode
  2. Press F12 to load the toolbar and select the tab where the html page is displayed
  3. in the search field, enter the line “phone-preview” and in the style window for this element, change the max-width style value from 350px to 900px, and turn off the background image
  4. also disable the properties-webkit-transform: scale (.85); and transform: scale(.Eighty five); and set padding: 0

2 Likes

thx !!

1 Like

Not a bad Idea !! but you thinks is possible that on iphone it shows for exemple each images under a images and on ipad always 2 images in a row ? how can I achive that pls ?

If I understand you correctly, you need an adaptive design. I didn’t experiment with this. The fact is that the mechanism for displaying the design in the IDE and on the device differs from each other. But using a styling template Improving the Thunkable x IDE you can create one view for viewing the design on iPhone, and a second view for iPad

3 Likes

can you provide a suggestion for the size to edit for a table? Pixle size i mean?

I have found the settings for this on chrome! Thank you for the suggestion

1 Like

I haven’t researched this issue. In a simple case, you can set the size equal to the device’s screen resolution.

2 Likes

Thank you!! You rock!

1 Like