12
30

IMGUI란?

Immediate Mode GUI라는 뜻으로
logger, profiler, debugger 게임 편집 등 C++에서
사용자 인터페이스를 빠르고 쉽게 만들 수 있는
라이브러리이다.

주로 게임 개발에 사용되는데, 헤더 파일과 소스파일만 넣으면 바로 사용이 가능하다. 심지어 자체적으로 파이프라인을 타서 별도로 해줄 것이 거의 없다.

https://github.com/ocornut/imgui

 

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

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

github.com

깃허브에서 다운로드 받을 수 있다.. 다이렉트x11 기준으로 포스팅 하겠다.

필요한 헤더파일과 소스파일


모두 불러왔다면, 고려해야할 것들은
Imgui, Imgui_dx11, imgui_win 총 3가지
객체를 다뤄야한다는 것이다.

그전에 imgui_impl_dx11 헤더와 win32에 기존 프로젝트의
KWindow 클래스(윈도우 생성 클래스)와 Directx11클래스
(다이렉트 디바이스 생성 클래스 )의 헤더를 포함시켜야한다.
개인이 생성한 Device나 Hwnd를 연동하기 위해서이다.

헤더 추가
헤더 추가

다음으로는 IMGUI를 관리해줄 IMGUI 매니져 클래스를 만든다.
효율적으로 관리하기위해 클래스를 별도로 만들었다.

ImGuiManager.cpp

더보기
#include "ImGuiManager.h"
#include "ImGui/imgui.h"
#include "ImGui/imgui_impl_dx11.h"
#include "ImGui/imgui_impl_win32.h"
void ImGuiManager::Frame()
{
    if (m_bImguiEnable) {
        ImGui_ImplDX11_NewFrame();
        ImGui_ImplWin32_NewFrame();
        ImGui::NewFrame();
    }
}
void ImGuiManager::Render()
{
    if (m_bImguiEnable) {
        ImGui::Render();
        ImGui_ImplDX11_RenderDrawData(ImGui::GetDrawData());
    }
}
void ImGuiManager::OnOffImgui() { m_bImguiEnable = !m_bImguiEnable; }
bool ImGuiManager::isImguiEnable() { return m_bImguiEnable; }
ImGuiManager::ImGuiManager()
{
    IMGUI_CHECKVERSION();
    ImGui::CreateContext();
    ImGui::StyleColorsDark();
}
ImGuiManager::~ImGuiManager()
{
ImGui::DestroyContext();
}


생성자와 해제자. Imgui를 생성하고 해제한다.

ImGuiManager::ImGuiManager()
{
    IMGUI_CHECKVERSION();
    ImGui::CreateContext();
    ImGui::StyleColorsDark();
}
ImGuiManager::~ImGuiManager() { ImGui::DestroyContext(); }


이제 생성을 했으면 초기화를 해야한다.
Window는 ShowWindow를 호출하고 나서
초기화하고 DXDevice는 뷰포트를 세팅하고 나서
초기화하면 된다.(setviewport)

IMGUI_Win 초기화, 소멸 작업

헤더 추가
ShowWindow 호출 후에 초기화


wndhandler가 만들어진 후에 imgui_win를 생성한다.
그리고 클릭이나 윈도우 메세지를 imgui도 받기위해
메세지 프로시저에 imgui_win의 wndproc를 넣어준다.
반환될게 없기 때문에 그냥 true로 했다.


소멸자에서 imgui_win를 해제해주는 함수를 쓴다.

소멸

 

Directx IMGUI 초기화 작업

RSSetviewports() 함수 호출 후에 초기화를 해준다.


마찬가지로 위에 imgui_win처럼 생성을 하고

해제자에서 ImGui_ImplDX11_Shutdown() 함수를 호출해 릴리즈해주는

작업을 똑같이 해준다. 그러면 세팅은 끝났다.

Game Render 작업

 

더보기
#include "ImGuiManager.h"
#include "ImGui/imgui.h"
#include "ImGui/imgui_impl_dx11.h"
#include "ImGui/imgui_impl_win32.h"
void ImGuiManager::Frame()
{
    if (m_bImguiEnable) {
        ImGui_ImplDX11_NewFrame();
        ImGui_ImplWin32_NewFrame();
        ImGui::NewFrame();
    }
}
void ImGuiManager::Render()
{
    if (m_bImguiEnable) {
        ImGui::Render();
        ImGui_ImplDX11_RenderDrawData(ImGui::GetDrawData());
    }
}
void ImGuiManager::OnOffImgui() { m_bImguiEnable = !m_bImguiEnable; }
bool ImGuiManager::isImguiEnable() { return m_bImguiEnable; }
ImGuiManager::ImGuiManager()
{
    IMGUI_CHECKVERSION();
    ImGui::CreateContext();
    ImGui::StyleColorsDark();
}
ImGuiManager::~ImGuiManager() { ImGui::DestroyContext(); }


위에 풀소스를 보면 Frame에서는 bool값으로
켜고 끄고 가능하게 제작하였고,
Render에서는 렌더를 담당하였다.


IMGUI매니져 객체를 만들어 마지막에 렌더를 했다. 이유는
IMGUI는 각자의 파이프라인을 타기때문에 Zbuffer가 없다.
별도로 뿌리기때문에 오브젝트를 뿌리기전에 Imgui를 렌더하면
오브젝트에 가려지게 된다. 아래처럼 된다.


그럼 간단하게 IMGUI를 사용해서

게임 시간을 조절하고 Frame를 출력해보자.

static char buffer[1024];
if (ImGui::Begin("Simulation Speed")) {
    ImGui::InputText("Input text", buffer, sizeof(buffer));
    ImGui::SliderFloat("Speed Factor", &m_Speed, 0.0f, 4.0f);
    ImGui::Text("Average %.3f ms/Frame (%.1f FPS)", 1000.0f / ImGui::GetIO().Framerate, ImGui::GetIO().Framerate);
}
ImGui::End();


별도로 Frame를 계산하지 않아도, Imgui의 별도의 프레임 연산이 있다.
ImGui::GetIO()에 포함되어 있다.

ImGui :: Begin() - 함수는 시작이자, 창의 제목을 담당한다.
ImGui :: SliderFloat() - 슬라이더로 값을 조정한다.
ImGui :: Text() - printf문과 유사하다. 글자를 출력하다.
ImGui :: End() - 창 레이아웃 종료

결과

IMGUI 슬라이더를 이용해 속도 조절 


이외에도 RGB 선택기나, 저장기능, 그래프 등 여러 기능을 포함하고 있다.
자세한건 공식 문서 참조해야겠다.
그나저나 난 아엠지유아이라고 불렀는데 어떤 사람은 임구이라 부르더라.
임구이라니..

source : https://github.com/ocornut/imgui

COMMENT