当前位置：首页 > backend >正文

C++每日训练 Day 16：构建 GUI 响应式信号机制（面向初学者）

backend 2025/5/22 1:37:13

📘 本篇我们将结合之前的 SignalHub 与 Dispatcher 机制，构建一个适合 GUI 场景的响应式信号系统。以按钮点击为例，构建一个跨线程安全的事件响应系统，配合协程挂起/恢复，让 UI 编程也能更优雅易读。本篇以通俗方式讲解，适合初学者入门 GUI 驱动信号机制。

在这里插入图片描述

✅ 目标概览

模块	功能
SignalHub GUI 版	管理 UI 控件的事件信号
GUIThreadDispatcher	保障协程 resume 回到主线程执行（GUI 安全）
按钮信号绑定	点击按钮 emit 信号，触发等待协程执行
协程结构	UI 写法更清晰：等事件，再执行响应逻辑

✅ 一、简单 GUI 场景抽象（模拟）

为了不引入真实 GUI 库（如 Qt/SDL/ImGui），我们先模拟一个 UI 控件：

struct Button {std::string label;std::function<void()> onClick;void click() {if (onClick) onClick();}
};

📌 假设你点击一个按钮，就会触发 onClick() 回调。

✅ 二、构建 GUI 主线程 Dispatcher

class GUIThreadDispatcher : public Dispatcher {
public:void dispatch(std::function<void()> task) override {tasks.push(task); // 假设 GUI 主线程会轮询执行这些任务}void runAll() {while (!tasks.empty()) {auto fn = tasks.front();tasks.pop();fn();}}private:std::queue<std::function<void()>> tasks;
};

📌 实际 GUI 框架中，主线程 loop 会负责 runAll()。

✅ 三、构建 GUI 按钮信号中心

template<typename T>
class ButtonSignal {
public:ButtonSignal(Dispatcher* d) : dispatcher(d) {}void emit(const T& value) {for (auto* w : waiters) {w->resume(value);}waiters.clear();}HubAwaiter<T>* wait() {auto* w = new HubAwaiter<T>();w->dispatcher = dispatcher;waiters.push_back(w);return w;}private:Dispatcher* dispatcher;std::vector<HubAwaiter<T>*> waiters;
};

✅ 四、绑定协程处理逻辑

Task<void> onButtonClicked(ButtonSignal<std::string>& sig) {std::string label = co_await *sig.wait();std::cout << "🟢 你点击了按钮：" << label << std::endl;co_return;
}

✅ 五、完整主函数模拟：模拟 UI 信号触发

int main() {GUIThreadDispatcher guiDispatcher; // GUI 主线程调度器ButtonSignal<std::string> signal(&guiDispatcher); // 按钮信号中心Button btn { "登录" };auto task = onButtonClicked(signal); // 协程等待按钮点击btn.onClick = [&]() {signal.emit(btn.label); // 点击按钮发出信号};// 模拟 UI 用户点击按钮std::cout << "📋 用户点击按钮...\n";btn.click();// 主线程调度 resumeguiDispatcher.runAll();return 0;
}

输出：

📋 用户点击按钮...
🟢 你点击了按钮：登录

✅ 总结回顾

点位	说明
按钮.onClick	发出信号（emit）
协程 co_await	挂起，等待按钮被点击
Dispatcher	保证协程 resume 在 GUI 主线程
UI逻辑更清晰	不再回调地狱，线性协程代码更可维护