koobas.hobune.stream
Color specific sections of a texture
Hello, everyone.
I have this code, which allows the user to choose the colors of certain sections of the character's clothes. It works by taking a base color-coded texture and replacing the colors in it for the ones the player chooses, but I have a problem.
public void Gen()
{
ShirtColor = MyPicker.corShirt;
ShortsColor = MyPicker.corShort;
SocksColor = MyPicker.corSocks;
DetailColor = MyPicker.corDetail;
int contx = 0;
int conty = 0;
foreach (Color32 pixel in tex1.GetPixels())
{
if (pixel.r < 120 && pixel.g > 100 && pixel.g < 250 && pixel.b > 230)
{
Finaltex.SetPixel(contx, conty, ShirtColor);
}
if (pixel.r < 120 && pixel.g > 140 && pixel.b < 10)
{
Finaltex.SetPixel(contx, conty, ShortsColor);
}
if (pixel.r < 115 && pixel.g < 115 && pixel.b > 140)
{
Finaltex.SetPixel(contx, conty, SocksColor);
}
if (pixel.r > 130 && pixel.g < 90 && pixel.b < 90)
{
Finaltex.SetPixel(contx, conty, DetailColor);
}
if (contx < tex1.width - 1)
{
contx++;
}
else
{
conty++;
contx = 0;
}
}
Rp = MyPicker.R;
Gp = MyPicker.G;
Bp = MyPicker.B;
Finaltex.Apply();
gl.generated = Finaltex;
}
It works, but it's too slow. I only call it once, when the player confirms the color they want, but still, the delay is too uncomfortable in smartphones.
Is there a better way to do this? Can a shader be used for that?(I understand nothing of shaders...) Or maybe a more efficient algorithm instead of checking each pixel?
Remaille's suggestion is a good one. You can however improve on your code above. Right now you are calling SetPixel() every pixel. You can modify an array of colors in an array and set them all at once. See the example on Texture2D.SetPixels to get you started in the right direction.
There's a simpler way to do it using multiple materials. For the sake of simplicity, I will only consider the "shirt" part, but it's the same principle for more clothing parts.
What you need is a second texture where everything is removed but the shirt. The rest of the texture should be transparent. This texture needs to be the same size as the other one, and the shirt should be in the same exact place (just like a layer in photoshop).
Create a material, assign this texture to it and select the transparent/cutout/diffuse shader.
Now, on your character, in the mesh renderer part, set the material list size as 2. Add the material you just created to your character. Your character should now have 2 materials. Make sure the shirt material is on top (Element 0) in the material list.
Now if you modify the main color of the material, you should see the color of the shirt change :)
You can modify this "main color" attribute via script :
// the list goes from top material to bottom
Material shirtMaterial = renderer.materials[0];
Material mainMaterial = renderer.materials[1];
shirtMaterial.color = Color.red; // or whatever color you need
Now if your video memory budget ever goes tight, multiple materials can be wasteful. That would be the time to look for a shader trick.
