Forums

RenderTarget as ImageSource
Last Post 16 Jul 2016 06:26 PM by wookie_rookie. 6 Replies.
Printer Friendly
  •  
  •  
  •  
  •  
  •  
Sort:
PrevPrev NextNext
You are not authorized to post a reply.
Author Messages
wookie_rookieUser is Offline
New Member
New Member
Posts:9


--
15 Jul 2016 05:29 AM
    Hi,

    i want to mix UI with custom drawn stuff in MonoGame. In this case i have an inventory screen where i want the backround (grids, images, texts) to be designed in xaml. The items itself should be rendered in game with spritebatch. The problem is i want another layer of UI on top of my custom item render pass. In this case an info overlay box thingy.

    My first idea was to try to create an image in xaml and set a renderTarget as source using:
    itemImage.Source.Texture = Engine.Instance.Renderer.CreateTexture(itemRenderTarget);
    


    This works fine with normal Texture2D instances but it doesn't seem to work with renderTargets. Even if it would work i don't know if its a good idea to do this every frame in a game.

    Is there any other solution to achieve different "layers"?

    Filip DušekUser is Offline
    Advanced Member
    Advanced Member
    Posts:676


    --
    15 Jul 2016 04:00 PM
    Hmm to be honest I never tried RenderTarget2D, which is pretty much Texture2D with few more stuff. I will defo check that out, because I was thinking to have 3D view of my space ship in tool tips somehow.

    About "layers" depends what you want. You can make Tool Tips on any control and they can contain any kind of UI. Useful for info overlays, imagine tool tip for a weapon with picture and some text about it.

    If you need something more complex, lets say some dialog, there is custom Windows support. See MonoGame example on GitHub.
    wookie_rookieUser is Offline
    New Member
    New Member
    Posts:9


    --
    15 Jul 2016 09:04 PM
    With "layers" i mean draw some UI, then draw something custom (sprites/models), and finally draw some UI parts again on top of your custom stuff. Let's say you have a nice hangar UI then render your 3D space ship onto it and then render some tooltips above the ship.

    Since there can be only one UIRoot and everything is drawn in a single draw call i don't think its possible. Unless the RenderTarget2D to ImageSource approach will work. Does it even makes sense to try this or are you doing some heavy calculations when creating a new ImageSource?

    Maybe i try some dirty stuff as well like draw UI -> draw custom stuff -> change some visibilities -> draw UI again
    Filip DušekUser is Offline
    Advanced Member
    Advanced Member
    Posts:676


    --
    15 Jul 2016 09:38 PM
    Yeah, that makes sense. Using render target should be fine. I will check why its not working.

    You could prolly somehow draw windows later, anything else would tick layout pass and would not work tho.
    Filip DušekUser is Offline
    Advanced Member
    Advanced Member
    Posts:676


    --
    16 Jul 2016 10:18 AM
    So I did few tests and it's working fine for me.

               ... somewhere after graphic init ... 
    
                RenderTarget2D renderTarget = new RenderTarget2D(GraphicsDevice,
                    100,
                    100,
                    false,
                    GraphicsDevice.PresentationParameters.BackBufferFormat,
                    DepthFormat.Depth24Stencil8);
    
                BitmapImage testImage = new BitmapImage();
                var texture = Engine.Instance.Renderer.CreateTexture(renderTarget);
                testImage.Texture = texture;
               
                .....
    
            protected override void Draw(GameTime gameTime)
            {
                GraphicsDevice.SetRenderTarget(renderTarget);
                Color color = new Color();
                color.A = 255;
                color.R = (byte)random.Next(0, 255);
                color.G = (byte)random.Next(0, 255);
                color.B = (byte)random.Next(0, 255);
                GraphicsDevice.Clear(color);
                GraphicsDevice.SetRenderTarget(null);
    
    
                GraphicsDevice.Clear(Color.CornflowerBlue);
                uiRoot.Draw(gameTime.ElapsedGameTime.TotalMilliseconds);
                debug.Draw();
                base.Draw(gameTime);
            }
    
    


    And you can use this Bitmap Image as Source for Image control or ImageBrush.
    Filip DušekUser is Offline
    Advanced Member
    Advanced Member
    Posts:676


    --
    16 Jul 2016 10:38 AM
    Added that to MonoGame examples on GitHub (Windows DX) - http://github.com/EmptyKeys/UI_Examples
    wookie_rookieUser is Offline
    New Member
    New Member
    Posts:9


    --
    16 Jul 2016 06:26 PM
    Hi, now it works. I have now idea why it wasn't working first, but after i moved some code around it works. Thank you for checking and adding the sample!
    You are not authorized to post a reply.