How to paint on a image with tranparency with renderTarget2D?

Graphics
1

Hello,
first of all I hope you understood my English good enough…
I want to use an existing PNG image file with partial transparency. On this image I want to draw Rectangles, Lines (through MonoGame.Extended) and text which must be clipped outside of the image and within the transparency area. I’m not secure if I understood this right that it would function through renderTarget/renderTarget2D which I read in the Internet some time ago.

I did not found a solution with such a code for an image yet.

Kind regards

2

Hi @Stefan_Probst and Welcome to the Community!

Look for BlendState.NonPremultiplied

Something like this:

_spriteBatch.Begin(SpriteSortmode.Deferred, BlendState.NonPremultiplied;
.Draw();
.End()
...

I hope that helps.

Happy Coding!

3

Hello and thanks! I tried it out and unfortunately it does not work.
I think you did not understand my question. As yet I created a RenderTarget2D with a specified background color. Onto the RenderTarget2D i placed the mentioned image and DrawLine(…). The Line is within the target as well as the image. But the line is not clipped on the transparent image area. Should I post the appropriate code? Regards

4

That and a screenshot if you can…

5

I think this?

public RenderTarget2D (
         GraphicsDevice graphicsDevice,
         int width,
         int height,
         bool mipMap,
         SurfaceFormat preferredFormat,
         DepthFormat preferredDepthFormat,
         int preferredMultiSampleCount,
         RenderTargetUsage usage
)
6

screenshot

Sorry, I am a newbie, so I post the code better now:

Blockquote
public class Game1 : Game
{
private GraphicsDeviceManager _graphics;
private SpriteBatch _spriteBatch;
private Texture2D adi_h;
private RenderTarget2D renderTarget;

    protected void DrawSceneToTexture(RenderTarget2D renderTarget)
    {
        GraphicsDevice.SetRenderTarget(renderTarget);

        GraphicsDevice.DepthStencilState = new DepthStencilState() { DepthBufferEnable = true };

        GraphicsDevice.Clear(Color.Transparent);
        _spriteBatch.Begin();
        _spriteBatch.Draw(adi_h, destinationRectangle: new Rectangle(0, 0, 400, 400), null, Color.White, 0, Vector2.Zero, SpriteEffects.None, layerDepth: 0.1f);

        _spriteBatch.DrawLine(0, 50, 400, 400, Color.Yellow, layerDepth: 0.4f); //this is the Line which is currently not cropped in the upper region

        _spriteBatch.End();

        GraphicsDevice.SetRenderTarget(null);
    }

    protected override void Initialize()
    {
        renderTarget = new RenderTarget2D(
            GraphicsDevice,
            400,	 //GraphicsDevice.PresentationParameters.BackBufferWidth,
            400,	 //GraphicsDevice.PresentationParameters.BackBufferHeight,
            false,
            GraphicsDevice.PresentationParameters.BackBufferFormat,
            DepthFormat.Depth24);

        base.Initialize();
    }

    protected override void LoadContent()
    {
        _spriteBatch = new SpriteBatch(GraphicsDevice);
        adi_h = Content.Load<Texture2D>("test"); //temp
    }

    protected override void Draw(GameTime gameTime)
    {
        DrawSceneToTexture(renderTarget);

        GraphicsDevice.Clear(beige); //beige is my own Color

        _spriteBatch.Begin(SpriteSortMode.Deferred, BlendState.NonPremultiplied);
        _spriteBatch.Draw(renderTarget, new Rectangle(0, 0, 400, 400), Color.White);
        _spriteBatch.End();

        base.Draw(gameTime);
    }

Blockquote

7

Have a read of this page:

Hopefully, someone can chime in here as actually, almost none of the books I have, mention RenderTarget2D…

8

My prgramming language is C# I am using VisualStudio 2019 and the project “type” is Monogame (3.7) Windows Desktop Application (DirectX for Windows).

9

Not 100 but i think you have to have non premultiplied alpha on and the rt has to be color format prior to rendering and then pass it thru a shader that passes the alpha im not entirely sure that will work though.

1 Like
10

@willmotil
I don’t know enough how to do this.

However, is there any other way (perhaps without RenderTarget(2D)) to achieve my graphics to be clipped within the transparent area?