User Tools

Site Tools


en:tutorials:ui:imgui

This is an old revision of the document!


Creating your own ImGui based project

Huge thanks go to the thegwydd for his work bringing the ImGui User Interface Library to Orx.

Please note that ImGui project creation will soon be built into the init script. Once supported, this page will be removed.

Start by working through the guide to create the imgui_orx library and demo project.

Once those are done, head back here.

Start by init'ing up a new project.

Your new project already contains references to the Orx library, but you will also need to reference the ImguiOrx library as well. To do this:

  1. Add ../../../../ImGuiOrx/lib/static to your Library paths.
  2. Add ../../../../ImGuiOrx/include and ../../../../ImGuiOrx/imgui to your Include paths.
  3. Add imgui_orxd to your Libraries.

Important: Ensure that your library order is: imgui_orxd;orxd Otherwise you will get a link time error later on.

Remove all code your main .cpp file.

Add the following includes to your main .cpp file:

 #include "orx.h" 
 #include "imgui.h"
 #include "ImGui_Orx.h"

Copy the Viewport and Camera declarations from the ImGuiOrx test project (main.cpp) to your .cpp file. Copy all the functions from the ImGuiOrx test project file (main.cpp) into your .cpp file.

Change your Orx_Execute line in your main function to be:

 orx_Execute(argc, argv, ImGuiOrx_Init, ImGuiOrx_Run, ImGuiOrx_Exit);

Compiling will be fine but you'll get a runtime error. This is because you will be missing the ini files required from the ImGuiOrx project.

Add the following Post Build command to your project configuration:

 cmd /c copy /Y ..\..\..\..\ImGuiOrx\test\\*.ini ..\..\..\data\config

Change the number of ..\ to get your relative path back to where your ImGuiOrx project lives.

Add the following to the bottom of your main project .ini file to load the ini files required from imgui:

 @imgui_orx_testd.ini@

Compile and run. You should get a nice screen with demo gui controls.

Feel free to add the Orx logo back into the project by adding:

 orxObject_CreateFromConfig("Object");
 

… into the bottom of the ImGuiOrx_Init() function.

And just for some extra flair, add a little up/down movement to the logo:

[Object]
Graphic         = @
SoundList       = @
Sound           = appear.ogg
Texture         = logo.png
Pivot           = center
Scale           = 0.5
Position        = (0, 0, 0)
AngularVelocity = 18
FXList          = FadeIn # ColorCycle # MoveAround
 
[MoveAround]
SlotList        = @
Type            = position
StartTime       = 0.0
EndTime         = 4
Curve           = sine
StartValue      = (0,0)
EndValue        = (0, -300)
Loop            = true

Now you can drag your windows over moving Orx objects.

Learning ImGui

To get started learning how to use the UI Library, check the official repo page: https://github.com/ocornut/imgui

Many examples are in the ImGuiOrx\imgui\examples folder of the ImGuiOrx library project.

en/tutorials/ui/imgui.1552215665.txt.gz · Last modified: 2019/03/10 07:01 (5 years ago) (external edit)