Float values for positionning controls

gui

#1

Hello everybody !

Recently, I had to deal with controls positionning on a plug-in GUI, where the background was either a PNG file, or a SVG. The plug-in editor is resizeable, and the controls need to be at very specific places depending on the background.

Since the position of Component objects in JUCE is always an integer, I had to write the positions of the controls using the scale factor and the function roundToInt, and sometimes they look “off” because you have say one pixel of delay on the left and not on the right, and then for another size everything looks good.

How do you deal with this ? Would it be a good idea to allow the components in JUCE to have bounds being Rectangle<float> instead of Rectangle<int> ? Or would it be a design mistake ?

Thanks in advance !


#2

I’d love to refactor it all one day to change the coords from int to float. I’m sure that’ll eventually happen but would cause all kinds of breaking changes in user code, so no plans to do it imminently…


#3

Hello @jules ! I guess it would be complicated of course to make that change.

I was wondering if some people have already dealed with this issue somehow and have some tips for workarounds.


#4

If you look at the Drawable classes, they use some tricks where they store their own float coordinates for the shape, and then just reposition the component bounds so that it’s big enough to contain the shape. That’s a pretty easy trick that I’ve used in a few other places too.


#5

I’ll have a look in the Drawable classes code, thanks !


#6

We actually did a spike on this here across the whole JUCE codebase and it did indeed break a lot of things and was non-trivial. It was going to be too much work so we reverted to using the trick mentioned by Jules above


#7

We have some 1 pixel gaps between components that disappear entirely on non-integer scaling ratio high-dpi screens :frowning:


#8

@jimc maybe this is this problem.