Setting up 2d graphics with ImGuiCS

[se5a]

Trying to do something like this:

With some ImGuiCS menus 'floating' ontop of it. Should I try do this in an ImGuiCS window of some kind or have an SDLCS window with an ImGuiCS window inside it? or some other thing?

I'm going to want to mousewheel zoom, click and drag pan, click on some things, rightclick menu etc. The above picture is my attempt in eto.forms version of wpf/winforms canvas. the fading orbit circles are a bunch of arc segments each with slightly more alpha. the whole thing changes, ie the planets move around their orbits, those strange box things at earth are broken ship icons which are meant to be dynamic (ie the icon should be different depending on the ship's stats, cargo size engine size etc etc.)

[0x0ade]

ImGuiCS ships with the ImGuiSDL2CSWindow class, which builds on top of the SDL2Window helper class. It allows you to handle events and set an OnLoop action.

I'd start by taking a look at the example YourGameWindow class and this tutorial on writing your own SDL2 key / mouse event handler.

[se5a]

I've been looking at the YourGameWindow class, been trying to draw a line, rectangle filled rectangle... anything but failing hard. the only thing I managed to do was change the background window color using the GL.ClearColor and GL.Clear as per the YourGameWindow class. is this what I should be trying to draw on?

This mess of commented out attempts pretty much shows what I've been throwing at it to get something kinda not sure what I should be passing to functions when they're wanting ie the surface pointer.

 public unsafe override void ImGuiLayout()
        {

            SDL.SDL_Rect rect = new SDL.SDL_Rect();
            rect.x = 50;
            rect.y = 50;
            rect.h = 100;
            rect.w = 200;
            ImVec3 clear_color = new ImVec3(114f / 255f, 144f / 255f, 154f / 255f);
            //var surface = SDL.SDL_GetWindowSurface(this.Handle); or this.GLContext??

            //var windowFlags = ImGuiWindowFlags.NoCollapse | ImGuiWindowFlags.NoMove | ImGuiWindowFlags.NoBringToFrontOnFocus | ImGuiWindowFlags.NoTitleBar;    
            ImGui.SetNextWindowSize(new ImVec2(600, 800), ImGuiCond.FirstUseEver);
            //ImGui.Begin("MapWindow", windowFlags);
            var drawData = ImGui.GetDrawData();
            GL.ClearColor(clear_color.X, clear_color.Y, clear_color.Z, 1f);

            GL.Clear(GL.Enum.GL_COLOR_BUFFER_BIT);

            //SDL.SDL_RenderDrawRect(surface, ref rect);
            //uint green = ColorToUInt(Color.Green);
            //SDL.SDL_FillRect(GLContext, ref rect, green);
            //SDL.SDL_UpdateWindowSurface(GLContext);

            //SDL.SDL_RenderDrawLine(this.Handle, 50, 50, 200, 200);

            if (_state.MainMenu.IsActive)
                _state.MainMenu.Display();
            if (_state.NewGameOptions.IsActive)
                _state.NewGameOptions.Display();

            //ImGui.End();
        }

Basically at this point I'm not even sure I'm trying to do this in the right place.

[0x0ade]

You're drawing in the layout method, which you should avoid, but it's my fault, as I don't expose any other way to drop in your own rendering code 😅

Try the following instead:

public virtual void ImGuiRender() {
    // Selfnote for future releases: This method should just be called Render.

    // Feel free to add any GL drawing here.

    // Render ImGui on top of the rest.
    base.ImGuiRender();
}

OpenGL is out of the scope of this library and honestly, I'm not really experienced either, meaning that I won't be able to help you much with that.

What you're trying to achieve could probably be easily done with a fully fledged game framework, such as XNA / FNA / MonoGame. Many more beginner friendly resources exist for these, and with FNA and MonoGame, you're still targeting all desktop platforms. And ImGuiCS is even available when using those frameworks.

I'm going to close this issue, as I can't teach you OpenGL. If you still need any help with ImGuiCS, though, feel free to ask.

Good luck :)

[se5a]

Yeah fair enough. Much of the game engine stuff is done, it's displaying the info that I'm trying to polish up a bit. Reading around it looks like an immediate mode GUI would have solved a lot of the problems I ran into trying to do it with a reactive mode gui. The graphics themselves are pretty basic. Lines circles and arcs mostly. I'm still trying to figure out where the line between what I can do in basic SDL and how much OpenGL is overkill.

[se5a]

I must be misunderstanding something fundamental here, because this doesn't make a whole lot of sense to me:

In the first image, I get a line but no ImGui stuff, in the second image, I get the ImGui menu that I've made, but the line doesn't show up. the only difference in the code is creating a reference to the surface Ptr being commented out or not: IntPtr surfacePtr = SDL.SDL_GetWindowSurface(windowPtr); which is not even used anywhere in the code. stumped.

[se5a]

It occurred to me that I was needlessly creating that reference in a loop which was probability less than ideal, so I moved it to the constructor which fixed the problem I was having.

Still, not sure why it was occurring when I was creating the reference each frame.

[se5a]

Made some progress: Just messing around with creating Arcs, Ellipses etc. havin't got them rotating on the focal point yet. as you can see I've got an 3/4 ellipse there which has a fading line, I'm just creating a bunch of points, then changing the alpha colour as I draw them using SLD_RenderDrawLine.

Couple of quick questions with the imgui stuff though, you can see the control at the top: how do I size the slider and more importantly the combo? also, I'm a little stumped on the ImageButton, is there some example code somewhere for this? I'm unsure where the int userTextureID comes from. and the UV, though I can probably figure that out through experimentation.