置面板)
raygui 即時模式 GUI如何 5 步給 C 游戲裝上可拖動的設(shè)置面板【免費下載鏈接】raylibA simple and easy-to-use library to enjoy videogames programming項目地址: https://gitcode.com/GitHub_Trending/ra/raylib你在寫 C 游戲想在屏幕上加一塊能讓玩家點擊、拖動的設(shè)置面板。raylib一個輕量跨平臺的 C 游戲庫為此配套了 raygui——一個單文件即時模式 GUI 庫所謂即時指屏幕上所有控件每幀都重新畫一遍狀態(tài)只存放在你的變量里。零構(gòu)建接入raygui 單文件怎么放進項目raygui 全部代碼就是raygui.h一個頭文件沒有構(gòu)建系統(tǒng)唯一依賴是 raylib 本身。raylib 倉庫在examples/各模塊目錄下都放了一份副本例如 examples/shapes/raygui.h把它拷進你自己項目的源碼目錄即可。規(guī)矩只有一條整個工程里只有一個源文件承載實現(xiàn)。// ui.c實現(xiàn)放在這里全工程只允許定義一次 #define RAYGUI_IMPLEMENTATION #include raygui.h這個宏讓編譯器把完整實現(xiàn)展開進這一個編譯單元其余文件只寫#include raygui.h拿到的是函數(shù)聲明。若定義兩次鏈接時會撞出重復(fù)符號。raylib 已在編譯命令行上raygui 隨之一并可用。raygui 控件為什么沒有狀態(tài)那控件的狀態(tài)存哪兒哪兒也不存——這正是即時模式的核心設(shè)計。想象一個現(xiàn)做檔口廚師每隔一秒把盤子端走重做一遍舊盤子從不保留。菜譜你代碼里的變量是唯一真相做菜渲染只是把菜譜翻譯成一盤眼見的東西。所以每幀創(chuàng)建一遍控件聽著浪費實際不浪費控件沒有實例、沒有記憶聲明即渲染。每幀你把變量的當(dāng)前值交給控件控件把自己畫出來用戶若拖動或點了它它就把新值寫回你傳入的那個變量。寫代碼時只需記住一句每幀把控件聲明出來以變量為準(zhǔn)。跑起來20 行最小 raygui 演示把上面說的拼起來得到一個能直接編譯運行的最小 demo一個窗口、一個滑塊、一個復(fù)選框外加一行回顯文字。#include raylib.h #define RAYGUI_IMPLEMENTATION // 整個工程只在這一個文件里定義 #include raygui.h int main(void) { InitWindow(480, 260, raygui 練習(xí)); float musicVol 35.0f; // 綁給滑塊的量 bool gridOn true; // 綁給復(fù)選框的開關(guān) while (!WindowShouldClose()) { BeginDrawing(); ClearBackground(BLACK); // 第一參數(shù)給位置尺寸指針參數(shù)由控件回寫新值 GuiSliderBar((Rectangle){ 30, 50, 200, 20 }, 音樂, TextFormat(%.0f, musicVol), musicVol, 0.0f, 100.0f); // 勾選發(fā)生的那一幀返回非 0拿它當(dāng)觸發(fā)信號 if (GuiCheckBox((Rectangle){ 30, 90, 20, 20 }, 網(wǎng)格, gridOn)) TraceLog(gridOn %d, gridOn); DrawText(TextFormat(vol%.0f grid%d, musicVol, gridOn), 30, 130, 10, WHITE); EndDrawing(); } CloseWindow(); return 0; }兩處值得留意所有控件第一參數(shù)都是Rectanglex、y、寬、高位置和大小全靠它返回值在本幀剛被操作過時非 0可當(dāng)觸發(fā)一次動作的信號。? raygui 控件選型速查表什么場景用哪個控件適用場景返回值易錯點GuiSliderBar連續(xù)量音量、透明度、半徑非 0 本幀被拖動左右兩段文本要自己格式化忘了傳最小/最大范圍滑塊會卡住GuiCheckBox二態(tài)開關(guān)非 0 本幀被勾選或取消標(biāo)簽畫在框右側(cè)控件高度給小了會被裁GuiToggle狀態(tài)指示 點擊切換按鈕非 0 本幀被翻轉(zhuǎn)和復(fù)選框易混它是整顆按鈕的形態(tài)GuiDropdownBox多選項里挑一個非 0 本幀選了新選項開合狀態(tài)要用自存的 bool 回傳GuiSpinner步進整數(shù)數(shù)量、索引、等級非 0 本幀點過加減或改過輸入末尾的 editMode 決定能否鍵入下拉框第 4 個參數(shù)editMode是開沒開的開關(guān)要自己存一個 bool 每幀回傳不存的話列表點一下就塌。它的第 2 個參數(shù)是分號連起來的選項文本串選中項下標(biāo)經(jīng)第 3 個參數(shù)寫回。下面這張餅圖示例里右側(cè)整塊就是 raygui 面板spinner 調(diào)切片數(shù)、復(fù)選框切顯示模式、滑塊管內(nèi)環(huán)半徑源碼在 examples/shapes/shapes_pie_chart.c。窗口縮放不失亂raygui 錨點布局做法窗口一拉大坐標(biāo)還硬寫嗎實用做法是每幀用GetScreenWidth()/GetScreenHeight()反推錨點控件只相對錨點排布。int w GetScreenWidth(), h GetScreenHeight(); float ax (float)(w - 240 - 24); // 240 面板寬24 右邊距 float ay (float)(h - 90 - 24); // 從底緣反推面板跟著窗口走 GuiSliderBar((Rectangle){ ax 16, ay, 208, 20 }, 等級, TextFormat(%d, level), level, 1.0f, 9.0f);注意取的是邏輯分辨率開了高分屏縮放時返回值已是縮放后的邏輯像素別自己再乘 DPI 系數(shù)。倉庫 examples 里的樣條編輯器是另一路玩法右側(cè)是 raygui 下拉框與滑塊畫布上的控制點可自由拖動——命中檢測每幀拿鼠標(biāo)坐標(biāo)減去控件bounds就行。 raygui 排障清單4 個高頻坑文字溢出控件框現(xiàn)象文字頂出控件上下邊緣原因默認字號偏大而控件高度給小了改法控件高度加到 24~30或用GuiSetStyle(DEFAULT, TEXT_SIZE, 10)整體縮字號中文顯示成方塊現(xiàn)象中文標(biāo)簽變成一排方框原因內(nèi)置字形表不含 CJK 字符改法GuiSetFont(LoadFontEx(cjk.ttf, 20, 0, 256));換成含對應(yīng)字形的字體文件同幀操作兩個控件只生效一個現(xiàn)象輸入被吃掉只有其中一個控件有反應(yīng)原因帶焦點的控件ValueBox、TextBox 等同時 editMode 為 1輸入被后聲明者搶走改法同一時刻只留一個控件 editMode 為 1其余給 0每幀 TextFormat 帶來分配抖動現(xiàn)象profiler 里小分配成串幀時間抖動原因每次 TextFormat 都新分配字符串堆反復(fù)切割改法結(jié)果緩存進char buf[32]只在值真正變化時重算控件跑通之后raygui 三個進階方向接下來值得試三件事用GuiSetStyle換一套貼合游戲的配色與字號讓控件與自繪內(nèi)容比如示例里那塊餅圖拼出半托管界面再去examples/目錄里翻更多用例看別人怎么把屏幕撐滿。raygui 的哲學(xué)自始至終只有一句控件不存狀態(tài)。記住每幀聲明、變量為準(zhǔn)界面就可以放心刪了重寫?！久赓M下載鏈接】raylibA simple and easy-to-use library to enjoy videogames programming項目地址: https://gitcode.com/GitHub_Trending/ra/raylib創(chuàng)作聲明：本文部分內(nèi)容由AI輔助生成（AIGC），僅供參考 raygui 即時模式 GUI：如何 5 步給 C 游戲裝上可拖動的設(shè)置面板
raygui 即時模式 GUI如何 5 步給 C 游戲裝上可拖動的設(shè)置面板【免費下載鏈接】raylibA simple and easy-to-use library to enjoy videogames programming項目地址: https://gitcode.com/GitHub_Trending/ra/raylib你在寫 C 游戲想在屏幕上加一塊能讓玩家點擊、拖動的設(shè)置面板。raylib一個輕量跨平臺的 C 游戲庫為此配套了 raygui——一個單文件即時模式 GUI 庫所謂即時指屏幕上所有控件每幀都重新畫一遍狀態(tài)只存放在你的變量里。零構(gòu)建接入raygui 單文件怎么放進項目raygui 全部代碼就是raygui.h一個頭文件沒有構(gòu)建系統(tǒng)唯一依賴是 raylib 本身。raylib 倉庫在examples/各模塊目錄下都放了一份副本例如 examples/shapes/raygui.h把它拷進你自己項目的源碼目錄即可。規(guī)矩只有一條整個工程里只有一個源文件承載實現(xiàn)。// ui.c實現(xiàn)放在這里全工程只允許定義一次 #define RAYGUI_IMPLEMENTATION #include raygui.h這個宏讓編譯器把完整實現(xiàn)展開進這一個編譯單元其余文件只寫#include raygui.h拿到的是函數(shù)聲明。若定義兩次鏈接時會撞出重復(fù)符號。raylib 已在編譯命令行上raygui 隨之一并可用。raygui 控件為什么沒有狀態(tài)那控件的狀態(tài)存哪兒哪兒也不存——這正是即時模式的核心設(shè)計。想象一個現(xiàn)做檔口廚師每隔一秒把盤子端走重做一遍舊盤子從不保留。菜譜你代碼里的變量是唯一真相做菜渲染只是把菜譜翻譯成一盤眼見的東西。所以每幀創(chuàng)建一遍控件聽著浪費實際不浪費控件沒有實例、沒有記憶聲明即渲染。每幀你把變量的當(dāng)前值交給控件控件把自己畫出來用戶若拖動或點了它它就把新值寫回你傳入的那個變量。寫代碼時只需記住一句每幀把控件聲明出來以變量為準(zhǔn)。跑起來20 行最小 raygui 演示把上面說的拼起來得到一個能直接編譯運行的最小 demo一個窗口、一個滑塊、一個復(fù)選框外加一行回顯文字。#include raylib.h #define RAYGUI_IMPLEMENTATION // 整個工程只在這一個文件里定義 #include raygui.h int main(void) { InitWindow(480, 260, raygui 練習(xí)); float musicVol 35.0f; // 綁給滑塊的量 bool gridOn true; // 綁給復(fù)選框的開關(guān) while (!WindowShouldClose()) { BeginDrawing(); ClearBackground(BLACK); // 第一參數(shù)給位置尺寸指針參數(shù)由控件回寫新值 GuiSliderBar((Rectangle){ 30, 50, 200, 20 }, 音樂, TextFormat(%.0f, musicVol), musicVol, 0.0f, 100.0f); // 勾選發(fā)生的那一幀返回非 0拿它當(dāng)觸發(fā)信號 if (GuiCheckBox((Rectangle){ 30, 90, 20, 20 }, 網(wǎng)格, gridOn)) TraceLog(gridOn %d, gridOn); DrawText(TextFormat(vol%.0f grid%d, musicVol, gridOn), 30, 130, 10, WHITE); EndDrawing(); } CloseWindow(); return 0; }兩處值得留意所有控件第一參數(shù)都是Rectanglex、y、寬、高位置和大小全靠它返回值在本幀剛被操作過時非 0可當(dāng)觸發(fā)一次動作的信號。? raygui 控件選型速查表什么場景用哪個控件適用場景返回值易錯點GuiSliderBar連續(xù)量音量、透明度、半徑非 0 本幀被拖動左右兩段文本要自己格式化忘了傳最小/最大范圍滑塊會卡住GuiCheckBox二態(tài)開關(guān)非 0 本幀被勾選或取消標(biāo)簽畫在框右側(cè)控件高度給小了會被裁GuiToggle狀態(tài)指示 點擊切換按鈕非 0 本幀被翻轉(zhuǎn)和復(fù)選框易混它是整顆按鈕的形態(tài)GuiDropdownBox多選項里挑一個非 0 本幀選了新選項開合狀態(tài)要用自存的 bool 回傳GuiSpinner步進整數(shù)數(shù)量、索引、等級非 0 本幀點過加減或改過輸入末尾的 editMode 決定能否鍵入下拉框第 4 個參數(shù)editMode是開沒開的開關(guān)要自己存一個 bool 每幀回傳不存的話列表點一下就塌。它的第 2 個參數(shù)是分號連起來的選項文本串選中項下標(biāo)經(jīng)第 3 個參數(shù)寫回。下面這張餅圖示例里右側(cè)整塊就是 raygui 面板spinner 調(diào)切片數(shù)、復(fù)選框切顯示模式、滑塊管內(nèi)環(huán)半徑源碼在 examples/shapes/shapes_pie_chart.c。窗口縮放不失亂raygui 錨點布局做法窗口一拉大坐標(biāo)還硬寫嗎實用做法是每幀用GetScreenWidth()/GetScreenHeight()反推錨點控件只相對錨點排布。int w GetScreenWidth(), h GetScreenHeight(); float ax (float)(w - 240 - 24); // 240 面板寬24 右邊距 float ay (float)(h - 90 - 24); // 從底緣反推面板跟著窗口走 GuiSliderBar((Rectangle){ ax 16, ay, 208, 20 }, 等級, TextFormat(%d, level), level, 1.0f, 9.0f);注意取的是邏輯分辨率開了高分屏縮放時返回值已是縮放后的邏輯像素別自己再乘 DPI 系數(shù)。倉庫 examples 里的樣條編輯器是另一路玩法右側(cè)是 raygui 下拉框與滑塊畫布上的控制點可自由拖動——命中檢測每幀拿鼠標(biāo)坐標(biāo)減去控件bounds就行。 raygui 排障清單4 個高頻坑文字溢出控件框現(xiàn)象文字頂出控件上下邊緣原因默認字號偏大而控件高度給小了改法控件高度加到 24~30或用GuiSetStyle(DEFAULT, TEXT_SIZE, 10)整體縮字號中文顯示成方塊現(xiàn)象中文標(biāo)簽變成一排方框原因內(nèi)置字形表不含 CJK 字符改法GuiSetFont(LoadFontEx(cjk.ttf, 20, 0, 256));換成含對應(yīng)字形的字體文件同幀操作兩個控件只生效一個現(xiàn)象輸入被吃掉只有其中一個控件有反應(yīng)原因帶焦點的控件ValueBox、TextBox 等同時 editMode 為 1輸入被后聲明者搶走改法同一時刻只留一個控件 editMode 為 1其余給 0每幀 TextFormat 帶來分配抖動現(xiàn)象profiler 里小分配成串幀時間抖動原因每次 TextFormat 都新分配字符串堆反復(fù)切割改法結(jié)果緩存進char buf[32]只在值真正變化時重算控件跑通之后raygui 三個進階方向接下來值得試三件事用GuiSetStyle換一套貼合游戲的配色與字號讓控件與自繪內(nèi)容比如示例里那塊餅圖拼出半托管界面再去examples/目錄里翻更多用例看別人怎么把屏幕撐滿。raygui 的哲學(xué)自始至終只有一句控件不存狀態(tài)。記住每幀聲明、變量為準(zhǔn)界面就可以放心刪了重寫?！久赓M下載鏈接】raylibA simple and easy-to-use library to enjoy videogames programming項目地址: https://gitcode.com/GitHub_Trending/ra/raylib創(chuàng)作聲明：本文部分內(nèi)容由AI輔助生成（AIGC），僅供參考