I’m attempting to build a UI in UMG and one of the major elements is dialogue boxes, which ought to be straightforward enough to design: create a border graphic and utilize a 9-slice scaled image to draw it onto the canvas, right? From the documentation, it would seem that the intended behavior is that the “box” and “border” draw methods are functionally identical except that “box” fills the scaled image with the center of the source image, while “border” leaves the center empty.
In practice though, identical margin settings have dramatically different results on an image in each respective mode. Check it out:
The documentation is also very spotty on what precise effect the margin settings have; it implies that the borders are drawn using “margin x image size”, which would imply that the margin should be equal to pixel width of border ÷ image dimension (resulting in a decimal percentage of the total image dimension), but using that methodology produces dramatically skewed results. Here’s an example:
The source image in this case is a 64x64 graphic with a 16px border on all sides, implying that the margins ought to be .25 on all sides (64 • 0.25 = 16, right?), but doing so yields a distorted result. Switching to “border” mode has its own variety of distortion:
I’m probably just being really dumb, but it seems to me that this process is far less intuitive than it could be. It’s really difficult to understand visually what effects the margin settings are having, and the documentation isn’t exactly thorough on explaining how to use this feature, and I’m stumped.
Can anybody explain to me how this is supposed to work?