I’m trying to set up 2 docked windows that will stay in place permanently.
I’ve created the docked windows and marked them to open on startup.
However, I’m having trouble with the sizing of the docked window. Layout is set to the default (relative, scale center, scale font).
I’ve set up the project at 4k so it can easily scale down to 1080p. The components within the docked windows shrink as I expected, but the docked window’s root container is still the size that I set for 4k. (ex. width of the West docked window is 320px in 4k. I would expect it to be 160px in 1080p, but it is still 320px)
Is there a setting to allow the root container to shrink as well?
You never want to design Vision at a large scale and expect it to scale down smoothly.
Do the opposite; design at the minimum screen resolution you expect and let Swing scale up for you, which it’s (relatively speaking) much better at.
Yeah, that’ll happen. I would also avoid the pipe components.
If you need things to line up and maintain scaling, design them as an SVG in e.g. Inkscape and put it into an Image component to act as the ‘background’. You’re going to have an infinitely better time than trying to manipulate pixel accurate locations in the Vision runtime.
As Paul said, the pipe component in Vision is uh… not great (unless you use anchored layout - but they’re still not great imo visually)… and one of the main reasons is due to its bounding box being much larger than the pipe graphic it contains. When the object is scaled it scales proportionately to its bounding box, not to the screen, and so it moves around and will never end up where you placed it at the resolution you designed it at. For things to scale nicely in terms of behaving well with surrounding components, the object must touch all four edges of their bounding box. Which leads me to…
For pipes, I personally use the basic line tool as these scale nicely; their graphic touches every edge of their bounding box. You do see some slight movement at some resolutions, but it’s only ever by 1px due to rounding errors which unfortunately is unavoidable.
A single SVG for the entire background image. That way Ignition/Java Swing has only one thing to deal with resizing, and can be trusted to maintain the relative location of everything (since it’s all defined in the one SVG file).
You can keep the existing SVG there, drag on the new SVG, copy the elements prop and paste over the top of your existing SVG component’s elements prop, then delete the new dragged in SVG. Then you won’t have to mess around with the size