INTRO
Good day everyone, I’m Ranz, Aaron in real life. I’m quite new here but I’m no means a beginner nor an expert in EU4. And this would be my first post so please be nice to me 
Without further adue, I would like to share to you a guide on how to make a croppable texture material. So, I’ve been looking for a way to crop a texture for some time ever since I examine the contents of Tappy Chicken. A we know, it uses sprite sheets in the development of its contents specially the UI. So I looked further on its contents and found out how they did it.
This material can crop the texture
As we can see, the algorithm for cropping textures is limited for square shapes, although you could make a rectangle shape crop by simply editing the TexCoord’s U and V tiling, but I’m still looking for more flexibility in it while making it easy to modify properties. So what I’m going to do is to modify this material and add features that will make it easier to crop textures within this material.
THE IMPORTANT PARTS
- Rows - this determines the number of divisions for your texture. This is used as a reference of the material’s computation to make a crop.
- FrameNumber - based on Rows, it determines which part of the texture will be cropped.
- TexCoord - this determines the size of the image that will be cropped, this is also dependent on Rows.
Basically, if we are to crop a texture in a sprite sheet, we want to determine where to crop and how big is the crop. So here we are lacking inputs that could help us crop our texture the way we want it but let’s take a look on what we currently have.
- Rows, as my definition says, we can make this as a reference for the overall size of our texture, say if our texture is 512 x 512, then we could be set the divisions 512.
- FrameNumber, with tests that I tried, if I increase this parameters value, say 1, it moves to the next image, so we can use this to set the crop’s X coordinate.
- TexCoord, increasing its U and V Tiling value increases the display in the material, therefore we could assume that this can handle the crop’s width and height.
So what we’re missing now is a way to determine the crop’s Y coordinate so we’ll try to add that.
MAKING THE MATERIAL
So, we are going to modify the material now so make sure you duplicate the material to avoid modifying the original contents of Tappy Chicken, or Migrate this material to your project. For this guide, we actually don’t need that FadeAmount flow so to avoid confusion with the guide, we’ll remove that.
Also, we are going to rename the parameters so that it’ll make sense with what we want to happen:
- Rows –> Texture Width
- FrameNumber –> Texture X
- Let’s add a Scalar Parameter and name it Texture Y, then multiply this to Texture Width.
- Connect the result to the Divide node where Texture X was originally connected.
Ok, so that actually takes care of the crop’s X and Y coordinate requirement but we’re going to push this a little further. Although we could set the crop’s width and height through TexCoord, but if we are talking about MaterialInstances this isn’t enough. So remember that our goal is to make us a material that can crop any texture just by giving the crop’s X, Y, Width, and Height.
- We’ll add two more Scalar Parameters and name it Width and Height.
- Multiply Width to Mask (R) and Height to Mask (G).
- Connect the result to the Multiply node were Mask (R) originally was. Do the same with Mask (G).
What this does is that we have now an access to modify TexCoord’s U and V Tiling. Just make sure that you leave TexCoord’s U and V Tiling to 1 so avoid any inconsistent results. Of course, don’t forget to change Texture Width to the size of texture that you used for this material, otherwise it won’t work smoothly.
CONCLUSION
As a sample here are my results,
This is the image I used, take note that this is originally 1024 x 1024 in my project.
This is the overview of the material in use. The parameters are set to: Texture Width = 1024; Texture X = 0; Texture Y = 680; Width = 200; Height = 341.
And here’s the result in my project.
