300 行代码搭出轻量级 DMX 灯光控制台Dear ImGui 舞台控制快速上手【免费下载链接】imguiDear ImGui: Bloat-free Graphical User interface for C with minimal dependencies项目地址: https://gitcode.com/GitHub_Trending/im/imguiDear ImGui 是一个无膨胀、依赖极少的 C 即时模式 GUI 库。这篇文章基于它官方的 GLFW OpenGL3 示例演示如何用 300 行左右的代码搭出一套轻量级 DMX 灯光控制板推子、512 通道矩阵、数据输出同一份代码在 Windows、macOS、Linux 上都能跑。先看目标场景你拖动主推子到 128舞台上那一排 PAR 灯应同步亮起来——本文就是实现这条链路的。 能力速览这套控制台能帮你做什么️逐通道调节512 个通道值用一组滑块直接编辑拖多少发多少所见即所得️跨平台 GUI基于 examples/ 里的后端模板换一台电脑不用改代码就能重跑后端可换需要接 DirectX 或 Metal 时只需替换 backends/ 下的实现文件界面代码一行不动场景存取把当前 512 个通道值序列化到文件一键保存/调出灯光方案⚡产物轻核心库是几个 C 文件编译出来的控制台可执行文件通常不到 1MB适合塞进笔记本或嵌入式盒子它的即时模式架构对这类工具特别友好界面就是每帧执行一遍的普通 C 代码通道值和 UI 控件天然绑定在同一个变量上没有回调、没有事件表要维护。⚡ 最小闭环最快跑通的灯光控制台先跑通官方示例确认工具链没问题git clone https://gitcode.com/GitHub_Trending/im/imgui cd imgui/examples/example_glfw_opengl3 sudo apt-get install libglfw-dev # LinuxmacOS 用 brew install glfw make -j4 ./example_glfw_opengl3能在屏幕上看到 Demo 窗口说明窗口、渲染、输入三条链路都通了。初始化部分只需要抓住这四行——创建上下文、定主题、绑定两个后端ImGui::CreateContext(); ImGui::StyleColorsDark(); ImGui_ImplGlfw_InitForOpenGL(window, true); // 平台后端窗口 输入 ImGui_ImplOpenGL3_Init(nullptr); // 渲染后端OpenGL 3后面的所有工作都是往每帧循环里加一行 UI 调用的事。 核心功能拆解️ 控制面板推子直接绑在通道数据上做什么控制台的数据核心就是一个 512 元素的数组UI 控件直接读写它不存在界面状态和数据状态两份拷贝。struct DMXUniverse { std::vectorint channels(512); // 取值范围 0–255 }; void DrawLightConsole(DMXUniverse uni) { ImGui::Begin(DMX Console); ImGui::VSlider(主推子, ImVec2(30, 180), uni.channels[0], 0, 255); ImGui::SameLine(); if (ImGui::CollapsingHeader(CH 01–16)) for (int i 1; i 16; i) { ImGui::PushID(i); char label[16]; snprintf(label, sizeof label, CH %02d, i); ImGui::SliderInt(label, uni.channels[i], 0, 255); ImGui::PopID(); } ImGui::End(); }看到的效果一个竖排主推子加一排横向通道滑块。注意PushID/PopID必须成对——同窗口里多个滑块共用同名控件时靠 ID 区分漏掉一半就会串值。 DMX 输出把 512 个通道打包发出去做什么每帧或按键触发把通道值按 DMX512 的字节序写进发送缓冲区。真实项目里这一步是写串口或 USB-DMX 设备的文件描述符这里先留一个清晰的接口void SendDMXData(const DMXUniverse uni) { // 把 512 个值截断为字节并发送例如 // for (int i 0; i 512; i) tx[i] (unsigned char)uni.channels[i]; // write(fd, tx, 512); // fd 为串口/USB-DMX 句柄 }看到的效果接上 USB-DMX 转换器后滑块每动一下对应灯具就跟着变亮变暗断开设备时函数退化为空操作界面照常可用方便纯软件调试。 帧循环三个 NewFrame 把一切串起来做什么即时模式意味着每帧把界面画一遍所以主循环里先让两个后端和核心各走一次 NewFrame再画你的控制台、发一次数据最后把生成的顶点缓冲画到屏幕while (!glfwWindowShouldClose(window)) { glfwPollEvents(); ImGui_ImplOpenGL3_NewFrame(); ImGui_ImplGlfw_NewFrame(); ImGui::NewFrame(); DrawLightConsole(uni); // 画控制台 SendDMXData(uni); // 推出去 ImGui::Render(); int w, h; glfwGetFramebufferSize(window, w, h); glViewport(0, 0, w, h); glClear(GL_COLOR_BUFFER_BIT); ImGui_ImplOpenGL3_RenderDrawData(ImGui::GetDrawData()); glfwSwapBuffers(window); }看到的效果推子拖动即时生效帧率稳定。一个容易踩的细节视口尺寸要取glfwGetFramebufferSize而不是窗口逻辑尺寸否则高分屏上画面会糊边。️ 进阶技巧主题定制与舞台预览深色台控皮肤灯光控台通常要在暗环境里看改几个颜色就够ImGuiStyle s ImGui::GetStyle(); s.Colors[ImGuiCol_WindowBg] ImVec4(0.06f, 0.06f, 0.08f, 1.0f); s.Colors[ImGuiCol_SliderGrab] ImVec4(0.85f, 0.25f, 0.20f, 1.0f);3D 预览占位想放舞台效果预览先用一个纹理占位横版比例更协调if (ImGui::CollapsingHeader(灯光预览)) ImGui::Image((void*)(intptr_t)preview_tex, ImVec2(360, 202)); // 16:9后续把这张纹理换成 OpenGL 离屏渲染的灯光模拟结果即可界面代码不用动。✅ 上生产前清单从演示到可用控制台构建与部署make -j4之后单文件运行跨平台靠换后端文件而不是改逻辑嵌入设备时用无窗口的 Null 后端思路参考 backends/imgui_impl_null.cpp关闭 Demo 窗口show_demo_window false避免发布版还挂着教学界面避坑备忘中文显示默认内嵌字体不含中文字形控制台标题会变成方块。用AddFontFromFileTTF加载一款 CJK 字体或在 imconfig.h 里启用 FreeType参考 docs/FONTS.md通道值若用unsigned char存储传给SliderInt前要先转成int的引用直接强转会破坏控件VSlider/SliderInt的越界值会钳回范围但不会报错调试时别以为滑块坏了资源导航组件与主题参考docs/README.md常见问题输入捕获、字体、多视口docs/FAQ.md各平台可编译示例examples/换 GPU API 时照葫芦画瓢一套能推动真实灯具的灯光控制台核心其实就是一个 512 长度数组 每帧画一遍 写一次串口——这正是即时模式 GUI 的省事之处。下一期我们在这个控制台基础上接入 Art-Net 网络输出把单台电脑的控制扩展到整个舞台灯光系统觉得有用的话点个关注更新不会漏。【免费下载链接】imguiDear ImGui: Bloat-free Graphical User interface for C with minimal dependencies项目地址: https://gitcode.com/GitHub_Trending/im/imgui创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考 300 行代码搭出轻量级 DMX 灯光控制台：Dear ImGui 舞台控制快速上手
300 行代码搭出轻量级 DMX 灯光控制台Dear ImGui 舞台控制快速上手【免费下载链接】imguiDear ImGui: Bloat-free Graphical User interface for C with minimal dependencies项目地址: https://gitcode.com/GitHub_Trending/im/imguiDear ImGui 是一个无膨胀、依赖极少的 C 即时模式 GUI 库。这篇文章基于它官方的 GLFW OpenGL3 示例演示如何用 300 行左右的代码搭出一套轻量级 DMX 灯光控制板推子、512 通道矩阵、数据输出同一份代码在 Windows、macOS、Linux 上都能跑。先看目标场景你拖动主推子到 128舞台上那一排 PAR 灯应同步亮起来——本文就是实现这条链路的。 能力速览这套控制台能帮你做什么️逐通道调节512 个通道值用一组滑块直接编辑拖多少发多少所见即所得️跨平台 GUI基于 examples/ 里的后端模板换一台电脑不用改代码就能重跑后端可换需要接 DirectX 或 Metal 时只需替换 backends/ 下的实现文件界面代码一行不动场景存取把当前 512 个通道值序列化到文件一键保存/调出灯光方案⚡产物轻核心库是几个 C 文件编译出来的控制台可执行文件通常不到 1MB适合塞进笔记本或嵌入式盒子它的即时模式架构对这类工具特别友好界面就是每帧执行一遍的普通 C 代码通道值和 UI 控件天然绑定在同一个变量上没有回调、没有事件表要维护。⚡ 最小闭环最快跑通的灯光控制台先跑通官方示例确认工具链没问题git clone https://gitcode.com/GitHub_Trending/im/imgui cd imgui/examples/example_glfw_opengl3 sudo apt-get install libglfw-dev # LinuxmacOS 用 brew install glfw make -j4 ./example_glfw_opengl3能在屏幕上看到 Demo 窗口说明窗口、渲染、输入三条链路都通了。初始化部分只需要抓住这四行——创建上下文、定主题、绑定两个后端ImGui::CreateContext(); ImGui::StyleColorsDark(); ImGui_ImplGlfw_InitForOpenGL(window, true); // 平台后端窗口 输入 ImGui_ImplOpenGL3_Init(nullptr); // 渲染后端OpenGL 3后面的所有工作都是往每帧循环里加一行 UI 调用的事。 核心功能拆解️ 控制面板推子直接绑在通道数据上做什么控制台的数据核心就是一个 512 元素的数组UI 控件直接读写它不存在界面状态和数据状态两份拷贝。struct DMXUniverse { std::vectorint channels(512); // 取值范围 0–255 }; void DrawLightConsole(DMXUniverse uni) { ImGui::Begin(DMX Console); ImGui::VSlider(主推子, ImVec2(30, 180), uni.channels[0], 0, 255); ImGui::SameLine(); if (ImGui::CollapsingHeader(CH 01–16)) for (int i 1; i 16; i) { ImGui::PushID(i); char label[16]; snprintf(label, sizeof label, CH %02d, i); ImGui::SliderInt(label, uni.channels[i], 0, 255); ImGui::PopID(); } ImGui::End(); }看到的效果一个竖排主推子加一排横向通道滑块。注意PushID/PopID必须成对——同窗口里多个滑块共用同名控件时靠 ID 区分漏掉一半就会串值。 DMX 输出把 512 个通道打包发出去做什么每帧或按键触发把通道值按 DMX512 的字节序写进发送缓冲区。真实项目里这一步是写串口或 USB-DMX 设备的文件描述符这里先留一个清晰的接口void SendDMXData(const DMXUniverse uni) { // 把 512 个值截断为字节并发送例如 // for (int i 0; i 512; i) tx[i] (unsigned char)uni.channels[i]; // write(fd, tx, 512); // fd 为串口/USB-DMX 句柄 }看到的效果接上 USB-DMX 转换器后滑块每动一下对应灯具就跟着变亮变暗断开设备时函数退化为空操作界面照常可用方便纯软件调试。 帧循环三个 NewFrame 把一切串起来做什么即时模式意味着每帧把界面画一遍所以主循环里先让两个后端和核心各走一次 NewFrame再画你的控制台、发一次数据最后把生成的顶点缓冲画到屏幕while (!glfwWindowShouldClose(window)) { glfwPollEvents(); ImGui_ImplOpenGL3_NewFrame(); ImGui_ImplGlfw_NewFrame(); ImGui::NewFrame(); DrawLightConsole(uni); // 画控制台 SendDMXData(uni); // 推出去 ImGui::Render(); int w, h; glfwGetFramebufferSize(window, w, h); glViewport(0, 0, w, h); glClear(GL_COLOR_BUFFER_BIT); ImGui_ImplOpenGL3_RenderDrawData(ImGui::GetDrawData()); glfwSwapBuffers(window); }看到的效果推子拖动即时生效帧率稳定。一个容易踩的细节视口尺寸要取glfwGetFramebufferSize而不是窗口逻辑尺寸否则高分屏上画面会糊边。️ 进阶技巧主题定制与舞台预览深色台控皮肤灯光控台通常要在暗环境里看改几个颜色就够ImGuiStyle s ImGui::GetStyle(); s.Colors[ImGuiCol_WindowBg] ImVec4(0.06f, 0.06f, 0.08f, 1.0f); s.Colors[ImGuiCol_SliderGrab] ImVec4(0.85f, 0.25f, 0.20f, 1.0f);3D 预览占位想放舞台效果预览先用一个纹理占位横版比例更协调if (ImGui::CollapsingHeader(灯光预览)) ImGui::Image((void*)(intptr_t)preview_tex, ImVec2(360, 202)); // 16:9后续把这张纹理换成 OpenGL 离屏渲染的灯光模拟结果即可界面代码不用动。✅ 上生产前清单从演示到可用控制台构建与部署make -j4之后单文件运行跨平台靠换后端文件而不是改逻辑嵌入设备时用无窗口的 Null 后端思路参考 backends/imgui_impl_null.cpp关闭 Demo 窗口show_demo_window false避免发布版还挂着教学界面避坑备忘中文显示默认内嵌字体不含中文字形控制台标题会变成方块。用AddFontFromFileTTF加载一款 CJK 字体或在 imconfig.h 里启用 FreeType参考 docs/FONTS.md通道值若用unsigned char存储传给SliderInt前要先转成int的引用直接强转会破坏控件VSlider/SliderInt的越界值会钳回范围但不会报错调试时别以为滑块坏了资源导航组件与主题参考docs/README.md常见问题输入捕获、字体、多视口docs/FAQ.md各平台可编译示例examples/换 GPU API 时照葫芦画瓢一套能推动真实灯具的灯光控制台核心其实就是一个 512 长度数组 每帧画一遍 写一次串口——这正是即时模式 GUI 的省事之处。下一期我们在这个控制台基础上接入 Art-Net 网络输出把单台电脑的控制扩展到整个舞台灯光系统觉得有用的话点个关注更新不会漏。【免费下载链接】imguiDear ImGui: Bloat-free Graphical User interface for C with minimal dependencies项目地址: https://gitcode.com/GitHub_Trending/im/imgui创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考