【imgui基礎學習】Widgets/Basic實現

    在學習imgui給出的Demo中，自己手動實現了一下Widgets/Basic選項裏面的組件，並且做了一些簡單的修改。

 

在貼代碼之前，簡答說一下遇到的一點點坑：

Text系列函數顯示漢字的解決方法，已經在另外一篇博客中闡述：【Imgui基礎學習】組件的使用之Text

但是，有可能我們需要在代碼裏面使用我們輸入的漢字

比如現在我們需要用戶去輸入一個文件名，然後使用用戶輸入的文件名去創建一個新的文件，但是我們之前顯示漢字的方法是在字符串的前面加“u8”，這樣字符串就會按照UTF-8的編碼去顯示，這個時候就能顯示漢字。

但是當我們在代碼裏面使用的時候就會是亂碼，這個時候創建出來的文件名字也是亂碼，所以我們在使用輸入的中文字符串之前，應該將其轉爲gbk編碼。

下面是代碼以及接口的一些註釋：

// 這是一個utf-8轉gbk文件的函數（網上找的，感覺可用，好人一生平安）
string Utf8ToGbk(const char *src_str)
{
	int len = MultiByteToWideChar(CP_UTF8, 0, src_str, -1, NULL, 0);
	wchar_t* wszGBK = new wchar_t[len + 1];
	memset(wszGBK, 0, len * 2 + 2);
	MultiByteToWideChar(CP_UTF8, 0, src_str, -1, wszGBK, len);
	len = WideCharToMultiByte(CP_ACP, 0, wszGBK, -1, NULL, 0, NULL, NULL);
	char* szGBK = new char[len + 1];
	memset(szGBK, 0, len + 1);
	WideCharToMultiByte(CP_ACP, 0, wszGBK, -1, szGBK, len, NULL, NULL);
	string strTemp(szGBK);
	if (wszGBK) delete[] wszGBK;
	if (szGBK) delete[] szGBK;
	return strTemp;
}

void MyClass::CreateTestBasic()
{
	ImGui::Begin("Basic_Windiow");

	// 勾選框
	static bool isChecked = false;
	ImGui::Checkbox("CheckBox", &isChecked);
	if (isChecked)
	{
		//可以使用isChecked來判斷勾選框是否勾選，從而進行判斷邏輯
	}

	// 原型勾選框
	static int num = -1;
	ImGui::RadioButton("RadioA", &num, 0); ImGui::SameLine();
	ImGui::RadioButton("RadioB", &num, 1); ImGui::SameLine();
	ImGui::RadioButton("RadioC", &num, 2);
	ImGui::NewLine();

	// 幾個按鈕，懸停，點擊的顏色都不同（使用PushID創建）
	for (int i = 0; i < 5; i++)
	{
		ImGui::SameLine();
		ImGui::PushID(i);
		// button原本的顏色
		ImGui::PushStyleColor(ImGuiCol_Button, (ImVec4)ImColor::HSV(i / 7.0f, 0.6f, 0.6f));
		// 懸停的顏色
		ImGui::PushStyleColor(ImGuiCol_ButtonHovered, (ImVec4)ImColor::HSV(i / 7.0f, 0.7f, 0.7f));
		// 點擊的顏色
		ImGui::PushStyleColor(ImGuiCol_ButtonActive, (ImVec4)ImColor::HSV(i / 7.0f, 0.8f, 0.8f));
		ImGui::Button("button");
		ImGui::PopStyleColor(3);
		ImGui::PopID();
	}


	// 可以連續響應的按鈕，也就是摁住不鬆手一直在響應的按鈕
	static int cnt = 0;
	float spacing = ImGui::GetStyle().ItemInnerSpacing.x;
	ImGui::PushButtonRepeat(true);
	// 連續響應的普通按鈕
	if (ImGui::Button(u8"普通按鈕")) cnt++;
	// 箭頭按鈕
	ImGui::AlignTextToFramePadding();
	if (ImGui::ArrowButton("left", ImGuiDir_Left))cnt--;
	ImGui::SameLine();
	ImGui::Text("%d", cnt);
	ImGui::SameLine();
	if (ImGui::ArrowButton("right", ImGuiDir_Right))cnt++;
	ImGui::PopButtonRepeat();

	// 一條實線，用來進行分割
	ImGui::Separator();

	ImGui::LabelText(u8"條目", u8"可選項");
	// 下拉菜單：
	{
		const char* itemName[] = { u8"文件1",u8"文件2",u8"文件3",u8"EnglishFile" };
		static int index = 0;
		// index就是當前選擇的選項的序號：0，1，2，3......
		ImGui::Combo(u8"選擇文件", &index, itemName, IM_ARRAYSIZE(itemName));
	}

	// 文字輸入框（沒有提示字符）
	{
		bool isCreate = false;
		static char str[128] = u8"你好";
		// 第一個參數：輸入框後面顯示的標識符，可爲空
		// 第二個參數：一段緩存，存放輸入的字符
		// 第三個參數：緩存的大小
		ImGui::InputText("", str, IM_ARRAYSIZE(str));
		ImGui::SameLine();
		if (ImGui::Button(u8"確定"))
		{
			// 點擊確定，創建文件
			std::string path = "e:/ADMIN/";
			std::string fileName = path + str + ".txt";
			fileName = Utf8ToGbk(fileName.c_str());
			FILE *fp = fopen(fileName.c_str(), "wb");
		}

	}

	// 文字輸入框（帶提示字符）
	{
		bool isCreate = false;
		static char str_Hint[128] = u8"";
		// 第一個參數：輸入框後面顯示的標識符，可爲空,
		// 第二個參數：默認顯示的字體
		// 第三個參數：開闢的一段緩存
		// 第四個參數：開闢緩存的大小
		// 這裏第一個參數作爲一個新ID的輸入框，以免和上面的輸入框重複
		ImGui::InputTextWithHint("##Hint", u8"請在此輸入文件名", str_Hint, IM_ARRAYSIZE(str_Hint));
		ImGui::SameLine();
		if (ImGui::Button(u8"確定_Hint"))
		{
			// 點擊確定，創建文件
			std::string path = "e:/ADMIN/";
			std::string fileName = path + str_Hint + ".txt";
			fileName = Utf8ToGbk(fileName.c_str());
			FILE *fp = fopen(fileName.c_str(), "wb");
		}

	}

	{
		// 數字輸入，自帶加鍵按鍵，也可以鍵盤輸入
		static int i0 = 123;
		ImGui::InputInt("input int", &i0);

		// float輸入器，第三個參數是step，第四個暫時不清楚，第五個格式
		static float f0 = 1.0;
		ImGui::InputFloat("input float", &f0, 0.01f, 1.0f, "%.3f");

		// 輸入分開的三個值，輸入顏色信息的時候可能有用
		// 輸入的三個值，對應的是數組前三個值，第四個值 ，暫時不知道爲毛
		static float vec4a[4] = { 0.10f, 0.20f, 0.30f, 0.44f };
		ImGui::InputFloat3("input float3", vec4a);

		// 可輸入，可滑動（但是不是很靈敏），將輸入的數值向下取整
		static int i1 = 50, i2 = 50;
		ImGui::DragInt("drag int", &i1, 1);

		// 第三個到第五個參數依次是：step，最小值，最大值，顯示格式
		ImGui::DragInt("drag int 0..100", &i2, 1, 0, 100, "%d%%");

		// slider float
		// slider int
		// ...... 原理參數什麼的都差不多

		// 類似與RN的ColorPicker
		// rgb的顏色選擇
		static float col1[3] = { 1.0f,1.0f,1.0f };
		// rgba的顏色選擇
		static float col2[4] = { 0.4f,0.7f,0.0f,0.5f };
		ImGui::ColorEdit3("color 1", col1);
		ImGui::ColorEdit4("color 2", col2);
	}


	ImGui::End();
}

最後附上我的效果圖：

Basic效果圖