Thingworx application - Resolution 1920 * 1200

[krishnakomal211]

Currently application is showing up well at 1920 * 1080 .Need to make thingworx application usable at 1920 * 1200(Size of text ,apps - 100% and 150% ) but in the pc specified resolution is not available in display settings. Suggest us on how to proceed further.

[Constantine]

Open DevTools, click on the "screens" button and input required resolution there -- you'll be able to test with 1920x1200:

/ Constantine

[krishnakomal211]

We have tested the application at 1920 * 1080 with pc settings then we didn't get any scrolls but we got horizontal scroll and vertical scroll for the screen when using browser with inspect as above to view same resolution.

our browser setup is as per below screenshots.:

There are two different zoom percentage options at inspect in screenshot 1 and the other in browser setting in screenshot 2. Kindly let us know what is difference between both and why scrolls when using inspect option.

[Constantine]

You have "1872x1080" on your screenshot. That's wrong. Change it to 1920x1200, then adjust the zoom until the scroll bars disappear. Then test.

[krishnakomal211]

As per your suggestion I have put like below but still getting scrolls.

 And can you let me know difference between browser settings zoom and the zoom here.

Are the scrolls due to extra space taken by Dimensions setup and below empty blocks in above screenshot? 

And on the X-axis also on right and left side an extra empty space present. due to which may be seeing horizontal scroll.  

.If so, please help us how to hide them to get exact UI.Thanks in advance!

[Constantine]

You didn't do what I wrote. Set 1920x1200 there, then adjust the zoom (that "100%" to the right of the resolution), so that you don't see the scroll bars. Leave the "browser zoom" at 100%.

> And can you let me know difference between browser settings zoom and the zoom here.

Browser zoom is for normal browsing. Set it to what your end users will have, e.g. 100%. The "zoom here" is for testing how your UI works on devices with different screen resolutions. This helps you to test by removing the scroll bars.

[krishnakomal211]

Before working for 1920x1200, We are checking existing application developed at 1920 * 1080 using browser inspect to get confidence. But using browser tools we are getting scrolls .Without inspect browser tools we are not getting any scrolls..How can we rely on browser tools for 1920 * 1200 ?

[Constantine]

Try with DevTools zoom = 50%, you won't see scroll bars anymore. Or simply buy a bigger screen.

[krishnakomal211]

Thank you.

Is there any way to hide these extra space occupied by  Dimensions setting and space below it and the sliders on right and bottom?

[mute]

-- del --

[Constantine]

I don't think so, and why should you bother? I thought you wanted to test your mashups, to see what they look like in a different resolution -- this thing allows you to do exactly that, with those borders.

[Constantine]

I don't think so, and why should you bother? I thought you wanted to test your mashups, to see what they look like in a different resolution -- this thing allows you to do exactly that, with those borders.

[krishnakomal211]

with these extra borders getting unwanted scrolls which restricts us to test the application with appropriate results.

[mute]

What is your zoom in DevTools?

[krishnakomal211]

100

[mute]

Make it 50, the scroll bars will disappear.

[krishnakomal211]

Vertical scroll disappeared but horizontal scroll increased and it is showing extra space vertically than before.

The look is like a tablet than a pc look which our application is designed for. 

And any specific reason why we are making it to 50% zoom.