Sorry your browser is not supported!

You are using an outdated browser that does not support modern web technologies, in order to use this site please update to a new browser.

Browsers supported include Chrome, FireFox, Safari, Opera, Internet Explorer 10+ or Microsoft Edge.

AppGameKit Chat / RenderToImage and drawsprite()

Author
Message
Blendman
3
Years of Service
User Offline
Joined: 17th Feb 2014
Location: Arkeos
Posted: 17th Feb 2017 16:36 Edited at: 17th Feb 2017 16:52
Hi

I'm looking for a way to draw a sprite, with transparency set to 1 (to get the shades of transparency) and not get the border of the alpha chanel.

I know If I use SetSpriteTransparency(sprite,0), I can get the correct blending, but I lost all the shades of transparency when I paint (it's to paint on a rendertoImage with sprite)

The code to explain the issue :
+ Code Snippet

I have tried with a shader, without success.
An idea on how to get the good drawing without border and with the use of SetSpriteTransparency(sprite,1) (to have the shade of alpha) ?

EDIT :
I have add an image to explain the issue, and what I would like to have :
AGK2 tier1 - http://www.dracaena-studio.com

Attachments

Login to view attachments
Paul Johnston
TGC Developer
14
Years of Service
User Offline
Joined: 16th Nov 2002
Location: United Kingdom
Posted: 23rd Feb 2017 14:34
Line 28, replace it with this
+ Code Snippet
The clear color of the render image was getting blended into the final scene, use white so it doesn't affect the final scene color
Blendman
3
Years of Service
User Offline
Joined: 17th Feb 2014
Location: Arkeos
Posted: 23rd Feb 2017 17:07
Hi

I have tried. It works only if I use a white color for my painting, but if I change the color to paint, I get a white border with the transparency.
I'm looking for a way to paint sprite on a renderimage and not get the color of the clearcolor of this image if the alpha is < 255.

You can see the issue on the image (all the colors except white has a white border (the color I use to clear the renderimage)).
I was thinking about using a shader with premul color, but I don't know how to do that, and I don't know if it will work.


The code to test :
+ Code Snippet



In this image we can see the issue. It works with color = white, but doesn't work with other color (yellow, green and more darker color...), when I use other colors, I get a white border (the border is the color of the clearcolor I use to erase the RenderImage at its creation).


AGK2 tier1 - http://www.dracaena-studio.com
Paul Johnston
TGC Developer
14
Years of Service
User Offline
Joined: 16th Nov 2002
Location: United Kingdom
Posted: 23rd Feb 2017 18:19
Does it work any better if you match the clear color of the render image to the color of the sprite it is later displayed above? You will get a slightly darker image, as it is being blended with the background color twice (once with the render image and again with the background sprite), but it should get rid of the border.
BatVink
Moderator
14
Years of Service
User Offline
Joined: 4th Apr 2003
Location: Gods own County, UK
Posted: 24th Feb 2017 13:19
I think I have the same issue with normal sprites on screen.
I have 2 sprites, each one made of a png image which is 75% opaque.
If I put one on top of the other, the totally transparent areas on the top image become 100% white.

I also tried with the lower image 100% opaque and I have the same problem. This is very bizarre, I have not had this issue previously. I'm using the February 2017 update

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
Quidquid latine dictum sit, altum sonatur
TutCity is being rebuilt
Blendman
3
Years of Service
User Offline
Joined: 17th Feb 2014
Location: Arkeos
Posted: 24th Feb 2017 16:46
Quote: "Does it work any better if you match the clear color of the render image to the color of the sprite it is later displayed above?"

The matter is I can have a sprite with a lot of color (not a unique color)
I paint some sprite (with drawSprite()) on the renderimage, And the color of each sprite can changed at any time.
And the sprite above this renderimage can have lots of colors too.

Is there a way to not get the color of the renderimage when we draw a sprite on this renderimage with alpha<255 (or with alpha in the image of the sprite) ?
AGK2 tier1 - http://www.dracaena-studio.com
BatVink
Moderator
14
Years of Service
User Offline
Joined: 4th Apr 2003
Location: Gods own County, UK
Posted: 24th Feb 2017 20:45
ignore my input. My png file was 24-bit, which is not transparent!
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
Quidquid latine dictum sit, altum sonatur
TutCity is being rebuilt
CJB
Valued Member
13
Years of Service
User Offline
Joined: 10th Feb 2004
Location: Essex, UK
Posted: 25th Feb 2017 16:54 Edited at: 25th Feb 2017 16:54
Try not setting a clear colour for your render image at all.

+ Code Snippet

Attachments

Login to view attachments
Blendman
3
Years of Service
User Offline
Joined: 17th Feb 2014
Location: Arkeos
Posted: 26th Feb 2017 14:03
Hi CJB

Thanks, but, it doesn't work .

Try to change line 13 :
c=120
to
c=220

In fact, the clearcolor is set to (100,100,100)
so the sprite above with a color of (120,120,120) is nea the clearcolorr, so we don't see the border.
But if the color of this sprite is set to (220,220,220), we see again the issue :



+ Code Snippet
AGK2 tier1 - http://www.dracaena-studio.com
Scraggle
Valued Member
14
Years of Service
User Offline
Joined: 10th Jul 2003
Location: Yorkshire
Posted: 26th Feb 2017 15:04 Edited at: 26th Feb 2017 21:05
You can possibly achieve what you are trying to do by changing your drawing method completely and using memblocks instead.
I posted a library of useful memblock functions. There's a few functions in there that will help with this.

It might not run fast enough but definitely worth a try
AGK V2 user - Tier 1 (mostly)
Paul Johnston
TGC Developer
14
Years of Service
User Offline
Joined: 16th Nov 2002
Location: United Kingdom
Posted: 27th Feb 2017 16:05
It looks like this can be done with some use of shaders to preprocess the iRenderImage so that it has the right background color before the sprite is drawn to it. The problem is when the first sprite is drawn it is taking the clear color of iRenderImage and blending it into itself, so when you then take iRenderImage and blend it with something else the clear color of iRenderImage is influencing the final result. So one solution would to make sure the color under the sprite matches itself if it is the first sprite to draw at that location, then it won't be affected be the clear color of iRenderImage. We can do this by keeping a separate image the same size as iRenderImage which is white where sprites have drawn and black where nothing has yet been drawn, as a sort of mask. We can then use a shader with the brush sprite that checks the mask image, if the mask image tells the shader that the brush sprite is drawing to a new (black) area of iRenderImage then it first draws its color to iRenderImage without alpha blending, then draws itself normally so it blends with its own color instead of the clear color of iRenderImage. Subsequent sprites will then blend normally with other sprites, and skip the non-blending step if a sprite has already drawn at that location in iRenderImage.

Here's the new code I came up with
+ Code Snippet

You will need the attached shaders in your media folder

Attachments

Login to view attachments

Login to post a reply

Server time is: 2017-08-23 01:34:39
Your offset time is: 2017-08-23 01:34:39