Imgui with monogame

[ossyahya60]

Hey folks!
I was interested in using imgui in C# with monogame, I used it before in c++ and I know it’s written in c++, but I recently found a .net wrapper to the library, I integrated it with my engine, and everything is fine except one thing…imgui renders below everything else…even the clear screen, I tried to put it after all draw calls, before and other locations, but it didn’t work, did someone has an idea why this would happen?

This is a “Zoomed Out” image for clarification.

And this is the draw method in Main.cs:

[boot]

Can you draw imgui to its own rendertarget then draw that rendertarget to yours?

[ossyahya60]

It works, but all I see now is imgui UI stuff only, am I missing something in the code?
maybe because the render target I draw, covers the stuff underneath?

[boot]

Thats strange.

What about try draw your world stuff to its own rendertarget to. Then at the end draw both render targets to the null rendertarget. See if that works

Maybe your applylighting is doing something?

[ossyahya60]

I noticed something while drawing the ImGUI on a render target, the color of the whole render target is (0, 0, 0, 255), excluding the UI elements themselves, this makes it cover everything beneath it!, why does this happen?, I tried to set the color array to be transparent for the render target, but whenever something is drawn on it, it overwrites what I did…How do I make everything transparent except what was drawn on the render target?

[Kwyrky]

Maybe clear with Color.Transparent will work? Did you try this already?

[ossyahya60]

I tried it, and it’s the same thing…,
this photo demonstrates what I said in the above reply:

Notice that this area is transparent by ImGUI element,
then see if I moved it a little bit:

[ossyahya60]

I Did manage to render everything fine except the UI, which draws beneath everything, although its drawing code is beneath everything…

[ossyahya60]

I solved it eventually, I had to draw ImGUI on a separate render target, then draw all my stuff, then draw the render target used for ImGUI. Clearing after setting the render target is crucial and took me a lot of time to figure out XD, here is the code anyway:

        protected override void Draw(GameTime gameTime)
        {
            if (!this.IsActive) //Pause Game when minimized
                return;

            GraphicsDevice.SetRenderTarget(ImGUI_RenderTarget);
            GraphicsDevice.Clear(Color.Transparent);

            GuiRenderer.BeginLayout(gameTime); // Must be called prior to calling any ImGui controls
            ImGui.ShowDemoWindow(); // Render the built in demonstration window
            GuiRenderer.EndLayout(); // Must be called after ImGui control calls
            GraphicsDevice.SetRenderTarget(null);

            ///
            Light.Init_Light();
            RIR.BeginDraw(); //Resolution related -> Mandatory

            spriteBatch.Begin(SpriteSortMode.Deferred, BlendState.AlphaBlend, SamplerState.PointClamp, DepthStencilState.Default, RasterizerState.CullNone, null, Camera.GetViewTransformationMatrix()); // -> Mandatory
            SpriteRenderer.LastEffect = null; // This should be the same effect as in the begin method above
            SceneManager.ActiveScene.Draw(spriteBatch);
            spriteBatch.End();

            //Light (Experimental)
            Light.ApplyLighting();

            // Drawing ImGUI Stuff
            GraphicsDevice.SetRenderTarget(null);
            spriteBatch.Begin(SpriteSortMode.Deferred, BlendState.AlphaBlend, SamplerState.PointClamp, DepthStencilState.Default, RasterizerState.CullNone, null, Camera.GetViewTransformationMatrix());
            spriteBatch.Draw(ImGUI_RenderTarget, Vector2.Zero, new Rectangle(0, 0, graphics.PreferredBackBufferWidth, graphics.PreferredBackBufferHeight), Color.White);
            spriteBatch.End();

            base.Draw(gameTime);

            SceneManager.LoadSceneNow();
        }