Jump to content

Canvas2d: Sprites with transparency: Weird behaviour [solved]


jpdev
 Share

Recommended Posts

Edit: The solution to get Sprite2D with transparent areas working is to set "hasAlpha" on the Texture to "true".

---

Hi,

I want to use sprites2d (in canvas2d) made from png files that have transparent areas.

expected behavior: Transparent areas are rendered transparent

actual behavior: transparent areas are rendered not transparent

It gets super weird, if I set opacity on the sprite to 0.999 everything works fine.

Working, with opacity 0.999

http://www.babylonjs-playground.com/#DSJDT#11

no longer working with opacity 1.0 (or opacity removed):

http://www.babylonjs-playground.com/#DSJDT#12

I will use the 0.99 opacity workaround for now., but this seems buggy - I would like my sprite to be rendered according to the alpha channel, and it's weird that this only seems to happen if I set opacity to 0.99.

Maybe I missed another property?

 

 

Link to comment
Share on other sites

@jpdev I realise that I didn't write proper documentation about this so you can't know how things are supposed to work.

Bottom line: @Wingnut is right, you have to set texture.hasAlpha = true to notice the Canvas2D engine that you're willing to use the Alpha Channel of the Picture, which will make your Sprite always Transparent.

Otherwise having an actualOpacity < 1.0 will also make it transparent, which is why you have the behavior you describe.

An old discussion with @Deltakosh led me to count on this flag which must be manually set to know if I should consider a texture as transparent or not, this is not something that can be detected.

Link to comment
Share on other sites

Well, there's no point for such flag in reality, or it would be a proxy of the hasAlpha property of its assigned texture.

A Sprite2D is transparent if its assigned texture use the alpha channel or if its actualOpacity is < 1.0. What it missed is a proper overview doc about all of this, I will write it soon.

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
 Share

  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...