I am learning Unreal 5.3.x after having used Unity since 2008.
I am trying to create some UI Widgets and I would like to know if in Unreal is possible to achieve something I was doing in Unity using their UGUI System.
Basically I would like to be able to set a background texture as sliced by specifying some borders. Doing this way I will be able to stretch the texture and use it as a background for a panel keeping the proportion of the 4 angles.
PLEASE NOTE: because I am new in the forum, I cannot post a question with more than 1 embedded media, therefore, I strongly suggest you to take a look at this shared document that better explains what I mean using a few more screenshots.
I will now try to explain what I mean in words and 1 single image.
In Unity, I have a texture 64x64 imported as a Sprite.
Using the Sprite Editor I can then set some borders.
Having 2 different images with the same settings allows me to configure the texture borders as much as I like but, in essence, the texture used is the same.
With a sliced sprite I can create a panel stretching it as much as I like in both X and Y without modifying the 4 angles look’n’feel.
Basically, it’s the same as having the corners and the lines in separated textures and combining them to form some sort of border. In fact, if in Unity I will uncheck the FillCenter setting, I literally get
EDIT
I took a look to the video and I think this doesn’t answer my question.
Is it pretty cool to see that in Unreal you can create a box and manage its shape natively giving you the possibility to create a few interesting shape without the need of having custom textures, however, when I normally create UI, I work in conjunction with UX/UI artists who provide custom skin designs that I have then to implement.
This implies the usage of custom textures.
I tried to play around with the Border widget but I was not able to replicate the same result I can achieve in Unity.
Maybe it was me not fully understanding the tool but I mostly think it was not what I am looking for.
Anyway, thank you very much for the resource you linked because it was really useful nonetheless !!!
I would like to use the Border (or could also be directly a simple Image but I don’t know if I can achieve the 9-slicing with it) as the background for my panel and then add more stuff inside it (such as some text and a few buttons).
Although, as you can see, I am not able to “slice” style properly and the image looks really ugly. I need the image more tall than wide and at the moment it is just stretched.
I would like to share more screenshots but I cannot still add more than 1 media in my posts: I tried a few combinations but nothing is letting me do what I am trying to achieve…
Once you’ve decided on the desired mode, use margins to dictate the behaviour. For this particular shape, you’ll need margins around 0.4. The actual math:
From 0.3 to 0.7 of the margins, the image looks exactly the same. Not exactly what I wanted that to look but I started understanding how this works, thank you !!
I think I need to get different resources from the ones I was using in Unity: probably with a different texture I can actually achieve what I am trying to.
