Messy piping in launched app

I have the piping neatly laid out and properly aligned in the Designer, but when the project is launched, depending on the size of the window and how much it is stretched, the piping gets all messed up and the pipe joints are all out of alignment.

Does anyone have any suggestions on how to adjust this? It looks pretty bad when the app is launched. Thanks!

There really isn’t anyway around this. Playing with the anchoring of the objects and zooming in closely and fine tuning is all that can be done. The alternative to this is using straight lines.

As Greg alluded to, I think OP may not realize the layout options and that it defaults to “relative” (stretching) as opposed to “anchored”, which is probably what you want. Try selecting all of your pipes and changing the anchoring to top and left.
inductiveautomation.com/support/ … layout.htm

The anchored layout is the best option for making sure everything you place on the window will appear exactly the same during runtime. You can change the designer’s default layout by going Project > Properties > Designer > Window Editing.

Here’s a tip for using anchored layout. If you anchor everything top-left, your piping will appear exactly the same in the client, problem is if you get a client with a wide screen then everything will appear mostly on the left side of the screen with a lot of white space on the right side of the screen, looks kind of goofy. To get around this I put a container on the window and anchor it to top-center, I then place all my components in the container and anchor them to top-left. Now everything will be centered in the client window no matter how wide the monitor is.

Pat has great advice! Adding to that, you can do a lot of cool things with combinations of fixed and stretch anchors using hidden containers containing containers. For example, you can use a fixed width, fixed height logo on the top left, with a fixed height stretching container that fills the “rest of the room” horizontally.

Play with containers and layout a bit and it will make sense. It’s not nearly as complicated as it sounds.

Thanks everyone! The anchoring worked for a desktop view, but was getting cut off when launched on a tablet with a smaller screen. Has anyone had success with this on a tablet?

There are a few things you can do for using Ignition on a mobile phone or tablet.

Set the size of the mobile viewport under Project > Properties > Mobile > General to Custom and make is as large as your project is.

I have issues in trying to use the Mobile Module on projects that I’ve developed for desktops. This mostly has to do with window sizes, zooming in/out, switching between the pointer and pan, it’s a pain for me to do and even more so for operators. So when I have a customer who wants mobile access I either -

  1. install a Remote Desktop Client app on their mobile device and allow them to use that to RDP into the server and run the desktop project on the server or
  2. I create a special mobile project that is used just for mobile clients, windows are sized to the smallest screen size on which it is to be viewed on (no zoom or pan required) and I set the Mobile Viewport size to my project windows’ size.

tera,

Don’t know if you are still watching this thread but… I have found that the piping components built into Ignition do not handle resizing very well. On the other hand, the piping objects (correct term?) that are in Symbol Factory stay joined together very nicely when stretched in relative mode.

[quote=“tera”]I have the piping neatly laid out and properly aligned in the Designer, but when the project is launched, depending on the size of the window and how much it is stretched, the piping gets all messed up and the pipe joints are all out of alignment.

Does anyone have any suggestions on how to adjust this? It looks pretty bad when the app is launched. Thanks![/quote]

try grouping them?

Pat’s suggestion fixes this problem of the display but opens up another issue…since you now have “fixed” scaling you lose the ability to resize and your pipework gets truncated on resized and lower rez screens than designed for. (can’t see a way to either pan or scroll images)

Here is what I think is going on…Ignition is looking at the pipes as a series of swatches (sub images) and rescaling them independantly onto the scaled view. When this happens you can end up with slightly different offsets in pixels due to the requirement to integer scale.

This happens for other objects as well but since you are not pixel aligning it is not that obvious.

It also happens in the designer as you zoom in and out.

By way of example I have attached a brief python program to demonstrate and its output. The first panel in the image is the original, the second with the whole image rescaled (will look pixel perfect) and the third with image scaled as individual sections highlighting the pixel shift that can occur.

It would be great to have this matter resolved since it makes it hard to achieve the look you are after but with the flexibility to use on various rex screens.

I am beginning to understand - weertske’s comment gives the key.

If you use vector images eg SVG etc you are in much better shape. It is not pixel perfect at all scalings but it is getting close enough not to be a eyesore.

The pipe tool appears to use images and this causes the problem due to the scaling issues involved.

Maybe the pipe tool should be updated to use vectors so the problem goes away.

At least this gives me a way forward.

The Symbol Factory Module uses vector graphics and includes pipes. This is an option for you as well. However, you still need to adjust your layout constraints, use grouping, and containers to fine tune the look of your project.