ImGui 入门到精通 项目源代码
某科学的_半个人
编辑于 2022年11月05日 12:42

这篇文章是给予 ( ImGui 入门到精通 )​ 这期视频进行参考使用

GitHub : https://github.com/Half-People/Video-ImGuiCode

代码块
text/x-c++src
自动换行
复制代码
// main.cpp 主要運行
//這個代碼由 半個人(HalfPeople) 編寫
// By HalfPeople Studio
// https://www.bilibili.com/read/cv19537138   專欄連結
// https://space.bilibili.com/443124242/video Up主頁

//定義此宏 ( GLEW_STATIC ) 告訴GLEW 需要公開某些函數  !!!否則無法使用
#define GLEW_STATIC
//引用 glfw (窗口創建工具) 和 glew (OpenGL 3d繪製褲)
#include <GL/glew.h>
#include <GLFW/glfw3.h>
//導入褲
#pragma comment(lib,"../API/GLFW/glfw3.lib")
#pragma comment(lib,"../API/GLEW/glew32s.lib")
//雖然我們沒有這一個 lib 但是他直接存在於 你的顯卡驅動當中
#pragma comment(lib,"Opengl32.lib")
//引用 <iostream> 方便進行Debug和打印 (可以沒有)
#include <iostream>
//引用 <string> 方便進行文本操作 (可以沒有)
#include <string>

//引用 "imgui.h" 當中包含大部分 Imgui 內容
#include "imgui.h"
//引用 "imgui_impl_glfw.h" 由於我們的窗口是由 GLFW 進行創建的
#include "imgui_impl_glfw.h"
//引用 "imgui_impl_opengl3.h" 由於我們的底層渲染是由 OpenGL (glew) 進行的
#include "imgui_impl_opengl3.h"
//引用 把控件繪製分離到 "GUI.h" 當中 (方便整理)
#include "GUI.h"

//窗口指針
GLFWwindow* Windows;

//程式開始
int main()
{
  	//初始化窗口
	glfwInit();
  	//給窗口定義 創建模式 (包括關閉垂直同步 使用不同的底層渲染 多重渲染... ... 操作可以使用它來實現)
	glfwWindowHint(GLFW_CONTEXT_VERSION_MAJOR, 3);
	glfwWindowHint(GLFW_CONTEXT_VERSION_MINOR, 3);
	glfwWindowHint(GLFW_OPENGL_PROFILE, GLFW_OPENGL_CORE_PROFILE);
	
  	//創建窗口給予 窗口指針     窗口大小X 窗口大小Y  窗口標題   這兩個為控制項 直接留空
	Windows = glfwCreateWindow(900, 800,"HalfPeople-Imgui",NULL,NULL);
	//給予控制權
	glfwMakeContextCurrent(Windows);
	glfwSwapInterval(0);

  	//初始化ImGui
	IMGUI_CHECKVERSION();
	ImGui::CreateContext(NULL);
  	//獲取 io (設置ImGui內容)
	ImGuiIO& io = ImGui::GetIO(); (void)io;
  	//添加字體                  文件路徑   字體大小 (高級)混合多種字體會使用所以留空即可  定義字體範圍
	io.Fonts->AddFontFromFileTTF("kaiu.ttf" ,  18 ,  NULL, io.Fonts->GetGlyphRangesChineseFull());
	
  	//允許停靠
	io.ConfigFlags |= ImGuiConfigFlags_DockingEnable;
  	//視口設置無裝飾
	io.ConfigFlags |= ImGuiViewportFlags_NoDecoration;
  	//允許視口停靠
	io.ConfigFlags |= ImGuiConfigFlags_ViewportsEnable;
  	//停靠於背景
	io.ConfigFlags |= ImGuiCol_DockingEmptyBg;
	
	//設置基礎 顏色風格
	ImGui::StyleColorsDark();
  	//獲取風格
	ImGuiStyle& style = ImGui::GetStyle();
	//從風格當中獲取顏色列表
	ImVec4* colors = style.Colors;
  	//進行顏色配置
	colors[ImGuiCol_FrameBg] = ImVec4(0.16f, 0.16f, 0.17f, 1.00f);
	colors[ImGuiCol_FrameBgHovered] = ImVec4(0.37f, 0.36f, 0.36f, 102.00f);
	colors[ImGuiCol_FrameBgActive] = ImVec4(0.10f, 0.10f, 0.10f, 171.00f);
	colors[ImGuiCol_TitleBgActive] = ImVec4(0.20f, 0.20f, 0.20f, 255.00f);
	colors[ImGuiCol_CheckMark] = ImVec4(0.61f, 0.61f, 0.61f, 1.00f);
	colors[ImGuiCol_SliderGrab] = ImVec4(0.64f, 0.64f, 0.64f, 1.00f);
	colors[ImGuiCol_SliderGrabActive] = ImVec4(0.31f, 0.31f, 0.31f, 1.00f);
	colors[ImGuiCol_Button] = ImVec4(0.22f, 0.22f, 0.22f, 0.40f);
	colors[ImGuiCol_ButtonHovered] = ImVec4(0.29f, 0.29f, 0.29f, 1.00f);
	colors[ImGuiCol_ButtonActive] = ImVec4(0.13f, 0.13f, 0.13f, 1.00f);
	colors[ImGuiCol_Header] = ImVec4(0.45f, 0.45f, 0.45f, 0.31f);
	colors[ImGuiCol_HeaderHovered] = ImVec4(0.55f, 0.55f, 0.55f, 0.80f);
	colors[ImGuiCol_HeaderActive] = ImVec4(0.09f, 0.09f, 0.09f, 1.00f);
	colors[ImGuiCol_ResizeGrip] = ImVec4(1.00f, 1.00f, 1.00f, 0.20f);
	colors[ImGuiCol_ResizeGripHovered] = ImVec4(0.46f, 0.46f, 0.46f, 0.67f);
	colors[ImGuiCol_ResizeGripActive] = ImVec4(0.17f, 0.17f, 0.17f, 0.95f);
	colors[ImGuiCol_SeparatorActive] = ImVec4(0.42f, 0.42f, 0.42f, 1.00f);
	colors[ImGuiCol_SeparatorHovered] = ImVec4(0.50f, 0.50f, 0.50f, 0.78f);
	colors[ImGuiCol_TabHovered] = ImVec4(0.45f, 0.45f, 0.45f, 0.80f);
	colors[ImGuiCol_TabActive] = ImVec4(0.28f, 0.28f, 0.28f, 1.00f);
	colors[ImGuiCol_TabUnfocusedActive] = ImVec4(0.19f, 0.19f, 0.19f, 1.00f);
	colors[ImGuiCol_DockingPreview] = ImVec4(0.51f, 0.51f, 0.51f, 0.70f);
	colors[ImGuiCol_Tab] = ImVec4(0.21f, 0.21f, 0.21f, 0.86f);
	colors[ImGuiCol_TabUnfocused] = ImVec4(0.15f, 0.15f, 0.15f, 0.97f);
	colors[ImGuiCol_NavHighlight] = ImVec4(1.00f, 0.40f, 0.13f, 1.00f);
	colors[ImGuiCol_TextSelectedBg] = ImVec4(0.45f, 1.00f, 0.85f, 0.35f);

	//從風格當中配置 窗口/控件 樣式數據
	style.WindowRounding = 4;
	style.FrameRounding = 4;
	style.GrabRounding = 3;
	style.ScrollbarSize = 7;
	style.ScrollbarRounding = 0;

	//初始化ImGui用於Glfw創建的窗口 (而且使用OpenGL進行底層渲染)
	ImGui_ImplGlfw_InitForOpenGL(Windows, true);
  	//初始化ImGui用於OpenGL渲染繪製  (需要定義OpenGL版本號  進行GLSL代碼的自動創建)
	ImGui_ImplOpenGL3_Init("#version 330");
	//創建文本編輯器給予 "GUI.h"
	te = new TextEditor();
  	//給文本編輯器定義  使用的電腦語言
	te->SetLanguageDefinition(TextEditor::LanguageDefinition::C());
  	//渲染循環  (若用戶點擊右上角 交叉 停止循環)
	while (!glfwWindowShouldClose(Windows))
	{
      	//清除渲染數據
		glClear(GL_COLOR_BUFFER_BIT);
		//ImGui每幀初始化
		ImGui_ImplOpenGL3_NewFrame();
		ImGui_ImplGlfw_NewFrame();
		ImGui::NewFrame();
      	//創建視口停靠
		ImGui::DockSpaceOverViewport();
		//調用 "GUI.h" 當中函數進行繪製
		DrawGUI();
		//繪製 ImGui Demo Window (完全是可以不用)
		ImGui::ShowDemoWindow();
		//獲取所需繪製數據
		ImGui::Render();
      	//繪製ImGui數據
		ImGui_ImplOpenGL3_RenderDrawData(ImGui::GetDrawData());
		
		if (io.ConfigFlags & ImGuiConfigFlags_ViewportsEnable)
		{
          	//當窗口拉出窗口範圍 創建子窗口
			GLFWwindow* backup_current_context = glfwGetCurrentContext();
			ImGui::UpdatePlatformWindows();
			ImGui::RenderPlatformWindowsDefault();
			glfwMakeContextCurrent(backup_current_context);
		}
		//繪製窗口內容
		glfwSwapBuffers(Windows);
      	//繪製事件
		glfwPollEvents();
	}
}

//這個代碼由 半個人(HalfPeople) 編寫
// By HalfPeople Studio
// https://www.bilibili.com/read/cv19537138   專欄連結
// https://space.bilibili.com/443124242/video Up主頁
复制成功

代码块
text/x-c++src
自动换行
复制代码
// GUI.h    從主文件中分離出來的IMGUI繪製部分
//這個代碼由 半個人(HalfPeople) 編寫
// By HalfPeople Studio
// https://www.bilibili.com/read/cv19537138   專欄連結
// https://space.bilibili.com/443124242/video Up主頁

//引用了IMGUI 文件作為函數調用
#pragma once
#include "Imgui.h"
#include "TextEditor.h"
#include <vector> // 這一個數組控制起來比較方便 : )

std::vector <int> DragList; //拖拽列表 用於保存拖拽過來的數據

TextEditor* te; //文本編輯器的指針

void DrawGUI()//繪製函數
{
	ImGui::Begin(u8"作業用");// 中文窗口標題測試 (默認使用八位元編碼 中文是16位的 所以前面要加一個u8 進行轉換)

  	// 為了方便直接使用 ForLoop 進行創建   循環5次
	for (size_t i = 0; i < 5; i++)
	{
      	//創建 按鈕 名稱等於 循環次數轉換為字符串再轉換為文本
		ImGui::Button(std::to_string(i).c_str());
      	//限制最後一個不同添加下面的函數
		if (i+1 < 5)
		{
          	//這一個函數會將下一個 控件位置 改為向右排佈  !! 此函數調用後沒有可以接受的控件程式崩潰
			ImGui::SameLine();
		}
      	//創建拖拽事件 (為上一個控件創建)
		if (ImGui::BeginDragDropSource())
		{
          	//拖拽時顯示控件 當然除了文本 你可以放置圖片
			ImGui::Text(std::string("Drag : ").append(std::to_string(i)).c_str());
			//設置拖拽時變量保存
			ImGui::SetDragDropPayload("DragIndexButton", &i, sizeof(int));
			ImGui::EndDragDropSource();
		}
	}
	//窗口完結
	ImGui::End();

	//創建窗口
	ImGui::Begin("Drag Window");
	//隨便放一個控件用於接收拖拽數據與訊息
	ImGui::Text("Drag Target");
	//創建拖拽目標用事件 (為上一個控件創建) 
	if (ImGui::BeginDragDropTarget())
	{
      	//獲取拖拽時變量保存
		if (const ImGuiPayload* payload = ImGui::AcceptDragDropPayload("DragIndexButton"))
		{
          	//把數據保存到 拖拽列表
			DragList.push_back(*(const int*)payload->Data);
		}
      	//完結拖拽事件
		ImGui::EndDragDropTarget();
	}

	//循環次數為  數組大小
	for (size_t i = 0; i < DragList.size(); i++)
	{
      	//創建按鈕 名稱為 拖拽列表當中 當前循環次數 的數據 將其轉換為字符串再轉換為文本
		if (ImGui::Button(std::to_string(DragList.at(i)).c_str()))
		{
          	//當按鈕被點擊時 移除 拖拽列表 當中 當前循環次數 的數據
			DragList.erase(DragList.begin() + i);
		}
      	//此處和上方十分相似  限制最後一個不同添加下面的函數
		if (i + 1 < DragList.size())
		{
          	//這一個函數會將下一個 控件位置 改為向右排佈  !! 此函數調用後沒有可以接受的控件程式崩潰
			ImGui::SameLine();
		}
	}
	//窗口完結
	ImGui::End();

	//創建窗口
	ImGui::Begin("TextEditor");
  	//繪製文本編輯器
	te->Render("TextED");
 	 //窗口完結
	ImGui::End();

}

//這個代碼由 半個人(HalfPeople) 編寫
// By HalfPeople Studio
// https://www.bilibili.com/read/cv19537138   專欄連結
// https://space.bilibili.com/443124242/video Up主頁
复制成功