[C++] ImGui - C++용 GUI Library

C++용 Bloat-Free GUI Library인 ImGui(아임구이) 입니다.

 

저도 최근에 알게된 라이브러리 입니다.

GitHub - ocornut/imgui: Dear ImGui: Bloat-free Graphical User interface for C++ with minimal dependencies

 

현재 많은 기업들로 부터 지원을 받고 있는 라이브러리입니다.

(블리자드, 유비소프트, 엔비디아, 어도비, 구글, 수퍼셀 등...)

(https://github.com/ocornut/imgui/wiki/Sponsors)

 

이 프로젝트의 Branch는 크게 2가지로 나뉘는데

일반 버전(master)과 Docking이 되는 버전(docking) 2가지로 구분이 됩니다.

 

ImGui의 배포에 관련하여

ImGui를 사용하려면 ImGui 프로젝트를 그대로 가져와서 자신의 프로젝트에 포함시켜서 빌드하여 사용해야합니다.

그러므로 자신의 프로그램에 내장되어집니다.

 

ImGui의 지원 범위

공식적으로는 C++용 GUI Library이며 ImGui는 위와 같은 렌더러와 플랫폼들을 지원합니다.

(이것을 ImGui에서는 백엔드라고 표현을 하더라구요.)

 

예제 실행해보기

먼저 git을 clone 또는 zip으로 다운받아서 원하는 위치에서 압축을 풉니다.

example 폴더에서 imgui_examples.sln (Visual Studio 솔루션 파일)을 열어서 예제들을 실핼해 볼 수 있습니다.

 

예제는 플랫폼 + 렌더러로 구분이 되어있습니다.

플랫폼은 GLFW, SDL, Win32 세가지 이며, 렌더러는 OpenGL2, OpenGL3, Vulkan, DirectX이며 SDL의 경우에는 SDLRender를 따로 예제를 두고 있습니다.

 

프로젝트 간단 분석 (GLFW_OpenGL3)

ImGui를 사용하기 위해서는

• Core 파일 (ImGui 프로젝트의 소스)
• Backend 파일 (imGui 프로젝트/backend 의 자신의 환경에 맞는 소스)
• Main 파일 (실제로 ImGui를 이용하여 UI를 구성하게 될 소스)

이렇게 구성이 되어집니다.

 

여기서 추가 하자면 GLFW의 경우에는 GLFW의 Lib 파일이 추가적으로 필요하며

Vulkan의 경우에는 Vulkan SDK, SDL의 경우에는 SDL2가 추가적으로 필요합니다.

 

더 자세한 구성은 예제의 프로젝트 속성을 보면서 구성할 수 있습니다.

 

예제를 실행시켜보면 이렇게 나옵니다.

 

Main 함수와 엮어서 보면

{
    static float f = 0.0f;
    static int counter = 0;

    ImGui::Begin("Hello, world!");                          // Create a window called "Hello, world!" and append into it.

    ImGui::Text("This is some useful text.");               // Display some text (you can use a format strings too)
    ImGui::Checkbox("Demo Window", &show_demo_window);      // Edit bools storing our window open/close state
    ImGui::Checkbox("Another Window", &show_another_window);

    ImGui::SliderFloat("float", &f, 0.0f, 1.0f);            // Edit 1 float using a slider from 0.0f to 1.0f
    ImGui::ColorEdit3("clear color", (float*)&clear_color); // Edit 3 floats representing a color

    if (ImGui::Button("Button"))                            // Buttons return true when clicked (most widgets return true when edited/activated)
        counter++;
    ImGui::SameLine();
    ImGui::Text("counter = %d", counter);

    ImGui::Text("Application average %.3f ms/frame (%.1f FPS)", 1000.0f / ImGui::GetIO().Framerate, ImGui::GetIO().Framerate);
    ImGui::End();
}

이게 왼쪽의 "Hello, world!" 창이고

 

if (show_demo_window)
    ImGui::ShowDemoWindow(&show_demo_window);

이게 오른쪽의 데모창입니다.

데모창의 내용은 "imgui_demo.cpp"를 확인하시면 됩니다.

 

ImGui의 단점1 - GUI 에디터(Designer)가 없다

ImGui는 코드로 GUI를 구성하게 됩니다.

 

ImGui의 단점2 - 국내 자료가 많지 않다

ImGui의 국내 자료가 그렇게 많지는 않아 보입니다.

하지만 해외에서는 어느 정도 사용하고 있으며 예제가 잘 되어있어 큰 단점은 아닙니다.