What I am trying to do is to get center lines and background “bound” to the top left and bottom right corners without distorting the width of the lines and background so everything lines up correctly. I know I could technically do this through property change event but the issue with that is that it will only run in the client so that won’t do plus you can’t reference a template instances width or height.
My best guess on how to do this is either through an objectScript() function or through a paintable canvas. The only issue with the paintable canvas is that when I was testing out load times it took significantly longer on initial load to boot using a paintable canvas versus a svg(with flashy graphics). Maybe I’m using them wrong then I’m not really sure.
I was able to make this work when there was no angle on the conveyor belt through layout bindings but there is no option to bind to only a corner and not the sides. Plus you can’t rotate template instances which would make this easy.
Edit: Also any advice/tips for redesigning a flashy HMI would be helpful. I am going for a grayscale design.