在 Devin 中试用 DeepWiki 处理私有仓库
DeepWiki

tauri-apps/tauri

菜单

API 示例应用

相关源文件

API 示例应用作为 Tauri 功能的全面演示，展示了如何在实际应用程序中实现和使用各种 Tauri API。该应用程序是 Tauri 开发的主要验证工具和测试平台，演示了通过 Tauri 框架将 Web 技术与 Rust 集成的最佳实践。

目的和概述

API 示例应用旨在

  1. 演示 Tauri API 的实际实现
  2. 作为 Tauri 开发者的参考
  3. 充当 Tauri 功能的测试平台
  4. 展示 JavaScript 和 Rust 之间的集成模式

该应用程序涵盖了大多数核心 Tauri 功能，包括窗口管理、IPC 通信、菜单创建、托盘图标和应用程序生命周期管理。有关通用 Tauri API 模式的信息，请参阅 关键概念。

来源： examples/api/src/views/Welcome.svelte26-33

应用程序架构

API 示例应用遵循典型的 Tauri 应用程序架构，具有基于 Web 的前端（使用 Svelte 构建）和 Rust 后端。该应用程序演示了 UI 组件和后端功能之间的关注点分离。

来源： examples/api/src/App.svelte1-353 examples/api/src-tauri/src/main.rs1-11

该应用程序采用侧边栏导航方法，以在单独的视图组件中演示不同的 API 功能。每个视图都侧重于特定的 Tauri API 功能。

UI 结构采用响应式设计，可在不同屏幕尺寸上运行，具有

  • 用于导航的可折叠侧边栏
  • 显示所选视图的主内容区域
  • 底部可调整大小的控制台区域，用于输出消息

来源： examples/api/src/App.svelte222-352 examples/api/src/app.css41-50

关键演示功能

API 示例应用在不同视图中展示了广泛的 Tauri 功能

视图主要功能相关 API
欢迎应用程序信息，基本交互@tauri-apps/api/app
通信JS 和 Rust 之间的 IPC，通道，事件@tauri-apps/api/core
窗口窗口创建、操作、样式、效果@tauri-apps/api/window，@tauri-apps/api/webviewWindow
应用程序应用程序生命周期，主题管理@tauri-apps/api/app
菜单菜单创建、上下文菜单、应用菜单@tauri-apps/api/menu
托盘系统托盘图标，托盘菜单@tauri-apps/api/tray
WebRTC媒体设备访问（摄像头/麦克风）浏览器 WebRTC API

来源： examples/api/src/App.svelte53-69

通信模式

该示例应用程序演示了三种主要的 JavaScript 和 Rust 之间的通信模式

1. 命令调用

命令是调用 JavaScript 中的 Rust 函数的主要方法。该示例展示了如何使用 invoke API 来调用 Rust 函数并处理响应。

在“通信”视图中的示例

来源： examples/api/src/views/Communication.svelte20-47

2. 事件系统

事件系统支持 JavaScript 和 Rust 之间的双向通信。事件可以从双方监听和发出。

来源： examples/api/src/views/Communication.svelte11-18 examples/api/src/views/Communication.svelte55-57

3. 通道 API

通道提供了 JavaScript 和 Rust 之间的流式通信机制，适用于随着时间推移发送多条消息。

来源： examples/api/src/views/Communication.svelte49-53

窗口管理展示

“窗口”视图提供了 Tauri 窗口管理功能的全面演示。它允许用户

  1. 创建新窗口
  2. 操作窗口属性（大小、位置、装饰）
  3. 控制窗口行为（可调整大小、可关闭等）
  4. 应用窗口效果（在支持的平台上）
  5. 管理窗口状态（最小化、最大化、全屏）

“窗口”视图实现了窗口指标的实时跟踪，并提供了用于修改窗口属性的交互式 UI。

来源： examples/api/src/views/Window.svelte1-808

示例应用程序通过交互式构建器展示了 Tauri 的菜单和托盘功能，允许用户

  1. 创建不同类型的菜单项（常规、图标、复选框、预定义）
  2. 构建应用程序菜单和上下文菜单
  3. 创建具有自定义菜单的系统托盘图标
  4. 处理菜单项点击事件

来源： examples/api/src/views/Menu.svelte1-50 examples/api/src/views/Tray.svelte1-80 examples/api/src/components/MenuBuilder.svelte1-46 examples/api/src/components/MenuItemBuilder.svelte1-150

控制台输出系统

该应用程序包含一个内置的控制台输出系统，用于显示前端和后端的各种消息，方便用户观察 API 调用和事件的结果。

控制台组件提供以下功能：

  • 显示结构化 JSON 响应
  • 自动滚动到最新消息
  • 清除控制台输出
  • 调整控制台面板高度

来源： examples/api/src/App.svelte94-127 examples/api/src/App.svelte316-350

应用程序生命周期

该示例应用程序演示了各种应用程序生命周期功能，包括

  1. 在浅色和深色模式之间切换主题
  2. 显示和隐藏应用程序
  3. 管理 Dock 可见性（在支持的平台上）
  4. 检索应用程序元数据（名称、版本、Tauri 版本）

来源： examples/api/src/views/App.svelte1-61 examples/api/src/views/Welcome.svelte1-41 examples/api/src/App.svelte77-92

与 Web 技术的集成

API 示例应用展示了 Tauri 如何与 Web 技术无缝集成。该应用使用了

  1. Svelte 用于 UI 组件和响应式
  2. 使用 UnoCSS 的现代 CSS 进行样式设计
  3. 用于媒体访问（WebRTC）的 Web 标准
  4. 与 Tauri 原生功能集成的浏览器 API

来源： examples/api/unocss.config.js1-102 examples/api/src/app.css1-51 examples/api/src/views/WebRTC.svelte1-57

开发和测试用法

API示例应用程序在Tauri生态系统中具有双重目的

  1. 开发者参考：Tauri API用法的综合示例，开发者可以从中学习和借鉴
  2. 测试平台：由Tauri团队在开发过程中用于验证API功能

如“欢迎”视图中所述，该应用程序计划未来集成到Tauri的自动化集成测试中。

来源： examples/api/src/views/Welcome.svelte26-33