Indie game storeFree gamesFun gamesHorror games
Game developmentAssetsComics

How do you create a tileable centre for a 9 sliced image like in the update video?

A topic by hoops doggit created Aug 06, 2018 Views: 80 Replies: 5
Viewing posts 1 to 5

Just wondering how you do it. I spent a while messing around but can't work it out. Anyone got it going?

so the way I did it is with two separate animations:

Draw a 9 sliced image that has the corners and the sides (which should be tileable). Make the center transparent.

Draw an image with pattern mode on, for the center pattern.

Add both as a sprite, with the first one moved a bit up so it’s on top.

On the first image, set the Sprite Renderer tiling mode to Repeat, that way when we extend it, the sides repeat instead of stretching.

Select both images and extend one of the corners using the quad tool to extend the rug.

If the first image’s border don’t reach the edge of the image you might need to make the pattern image a bit smaller.

Does that make sense?

Not at my computer but I’m pretty sure I included the rug you see on the video in the Patterns example scene, so you can check how it works.

Ahhh thanks very much. I checked out the example scene and it has the example from the video. I can't get it to behave the exact same way with the rect tool (only one extends to follow the border) but that's fine. I just wanted to check if you had some kind of setup with multiple animators on the same object etc

You have to have both the top and bottom layers selected for both to scale with the rect tool

I think mine messed up because i had the center bit parented to the outer edge so it moved it around instead of extending