GUI: 9-patch images, the 1px gap on resize (reloaded)

Questions
1

Dears,
I’m back with the GUI and the nine-patch images. I remember we twice had an issue where the 9-patch image on canvas resize would eventually leave a gap of 1 px.
Now I’m building an 18-patch image kind of set-up. Understand a grid with 2 nine-patch images forming a frame. My problem is no matter if I use grid or rectangles or both, no matter if I align center, or left and right, I seem to always have this 1px gap eventually showing on resize.
I’m not using a sliced image. I made sure my image/frame goes to the 0px of the image size. I also made sure my image size does not include half-size pixels. Though no matter how hard I try, I don’t seem to be able to fix the gap. Any ideas, suggestions? Thanks,

The testing pg:

The gui editor layout:

2

Hey there mawa! I’m investigating this. It doesn’t seem to be exclusive to the nine patch, because I could get it to appear just with the containing rectangles: test mirrored 9-patch (center gap issue on resize) | Babylon.js Playground (babylonjs.com) (it’s a bit harder to notice but if you resize it around you can see it). It might be a rounding issue, I’ll continue investigating.

3

Might be something in the Grid sizes calculation, if I add two rectangles in a containing rectangle instead, there’s no gap: test mirrored 9-patch (center gap issue on resize) | Babylon.js Playground (babylonjs.com)

1 Like
4

Added proper rounding to the calculations so it should not have gaps even on the grid now :slight_smile: Round values coming from grid width calculation to avoid gaps between… by carolhmj · Pull Request #13743 · BabylonJS/Babylon.js (github.com)

1 Like
5

Yes, thank you. I thought it might come from the rounding values, but then of course only AFTER I already posted. And I didn’t have the time to check back on it until now.
So, you’re right and your solution with just a rectangle container works (and works for me in this project, already implemented :smiley:).
Thanks a lot and also thanks for the PR. GJ :smiling_face_with_three_hearts: and have a great day :sunglasses:

1 Like