事件与窗口：交互式应用

事件与窗口：交互式应用程序

静态应用程序很少有用。要构建真正的交互式软件，你的前端需要与 Rust Core 进行实时通信，并且你需要控制应用程序窗口本身。在本章中，我们将探讨用于消息传递的事件系统 (Event System) 和用于管理应用程序生命周期及外观的窗口 API (Window API)。

事件系统

尽管命令 (IPC) 非常适合请求-响应式交互（例如要求 Rust 计算某些内容并返回结果），但它们不适用于自发事件。例如，如果 Rust 中一个长时间运行的下载完成，前端如何得知？这就是事件 (Events) 发挥作用的地方。

Tauri 提供了一个全局事件总线，它基于发布-订阅模型运行。Rust 后端和 JavaScript 前端都可以发出和监听事件。

从 Rust 向前端发出事件

要从 Rust 向你的 UI 发送消息，你可以在应用句柄 (app handle) 或窗口实例上使用 emit 方法。

// 在命令或 setup 钩子中
app.emit("download-progress", "99%").unwrap();

在前端监听事件

在 JavaScript 侧，你订阅这个事件。请记住清除监听器以避免内存泄漏，尤其是在 React 或 Vue 等框架中。

import { listen } from '@tauri-apps/api/event';

// 设置监听器
const unlisten = await listen<string>('download-progress', (event) => {
  console.log(`Download status: ${event.payload}`);
});

// 稍后，当你想要停止监听时：
unlisten();

窗口 API

Tauri 允许你通过编程方式控制应用程序窗口。你不仅限于一个窗口；你可以修改现有窗口或动态生成新窗口。这通过 @tauri-apps/api/window 模块处理。

常见操作包括：

装饰：显示或隐藏标题栏和窗口控件。
调整大小：设置特定的宽度和高度。
聚焦：将窗口置于最前。
关闭：终止窗口。

import { getCurrentWindow } from '@tauri-apps/api/window';

const appWindow = getCurrentWindow();

// Minimize the window
await appWindow.minimize();

// Toggle fullscreen
await appWindow.setFullscreen(true);

// Close the window
await appWindow.close();

创建多窗口应用程序

许多复杂的应用程序需要多个窗口——例如，一个主仪表盘和一个单独的设置窗口或一个启动画面。

你可以在 tauri.conf.json 中静态定义窗口，也可以在运行时使用 JavaScript 中的 WebviewWindow 类创建它们。这允许你为新窗口加载不同的 HTML 文件或路由。

import { WebviewWindow } from '@tauri-apps/api/webviewWindow';

const settings = new WebviewWindow('settings', {
  url: 'settings.html',
  title: 'Preferences',
  width: 600,
  height: 400
});

settings.once('tauri://created', function () {
 console.log('Settings window created successfully');
});

通过掌握事件 (Events) 和窗口 (Windows)，你可以将你的应用程序从一个静态页面转变为一个流畅的、桌面级的应用程序。