Problems with Sprite opacity

Hey there!
I tried to create Layer and put 3 Sprites there (body, eyes and mouth). And it was okay.
But when I’m trying to change opacity of sprites appears this thing (semitransparent rectangles).
Is there any way to get rid of it?
cocos3.5 jfbylmQU3L0

can you share the seperate images?
body, eyes and mouth

Yeah, if you can share the sprites and some code, we can try this easily in 3.17.2. The code will also help/ensure correct usage.

Ok, here’s code and 3 png

	auto Some_node = Node::create();
	auto Chapter_Layer = Layer::create();
	auto Chapter_Body = Sprite::create();
	auto Chapter_Eyes = Sprite::create();
	auto Chapter_Mouth = Sprite::create();

	Some_node->addChild(Chapter_Layer);
	Chapter_Layer->addChild(Chapter_Body);
	Chapter_Body->addChild(Chapter_Eyes);
	Chapter_Body->addChild(Chapter_Mouth);
	Chapter_Eyes->setAnchorPoint(Vec2(0,0));
	Chapter_Mouth->setAnchorPoint(Vec2(0, 0));
	Vec2 Pos_Eyes(203, 378);
	Vec2 Pos_Mouth(241, 361);

	Chapter_Body->setTexture("Body.png");
	Chapter_Eyes->setTexture("Eyes.png");
	Chapter_Mouth->setTexture("Mouth.png");
	Chapter_Layer->setPosition(Vec2(500,200));
	Chapter_Eyes->setPosition(Pos_Eyes);
	Chapter_Mouth->setPosition(Pos_Mouth);
	Chapter_Body->setOpacity(100);
	Chapter_Eyes->setOpacity(100);
	Chapter_Mouth->setOpacity(100);
	this->addChild(Some_node, 0);


Eyes
Mouth

Hi,
i think the “holes” in your sprites are smaller then the sprites that you want to fit in.
Therefore when you set the opacity to a lower value, the overlapping of the images sums up the alpha value and therefore results in those edges.

Edit:
Setting only the opacity of Chapter_Body would solve this because eyes and mouth are children of it.

1 Like

image

sprite’s position is wrong.

hmm strange, try dont change Anchor Point Chapter_Eyes and Chapter_Mouth

No, it didn’t work, but now I know how this thing works, so thank you)
As an example I can show you this - if I change opacity of only one element, overlap of alphas causes the same effect.
It doesn’t matter if it’s children of Chapter_Body or no, and it’s only logical.
I need to disable the overlap of alpha channel in different images (so that alpha channel Chapter_Body completely overlaps and replaces alphas of Chapter_Eyes and Chapter_Mouth, and leaves only that is not overlays), but I don’t know how…
(example cocos studio)

Just from experience and assumptions… it seems you are interested in having the mouth and eyes as separate/customizable pieces. I would personally make these completely separate as in the face, main sprite would be fully colored in (with no empty boxes), and the eyes and mouth would be only the eyes and mouth on a transparent back. Then you would remove the issue you have, and would be better practice overall. When you change skin tone of the character for example, it will in your scenario apply to even the eyes now, and vice versa.

1 Like

But still alpha of the eyes will overlay the sprite with skin when opacity will be changed…
I thought about clipping eyes and mouth to boxes, but there are many resources and it’ll be very time-consuming.
So I want to find a code decision