前言

今天来学一下 Tauri 菜单的使用

菜单

Menu 有三种类型, CustomMenuItemMenuItemSubmenu ,如下所示。

1
2
3
4
5
6
#[derive(Debug, Clone)]
pub enum MenuEntry {
  CustomItem(CustomMenuItem),
  NativeItem(MenuItem),
  Submenu(Submenu),
}
  • CustomMenuItem 允许我们自定义菜单的标题和 ID
  • MenuItem 是系统提供的一些功能,像拷贝、剪切等等
  • Submenu 就是子菜单,可以包含其它菜单

添加菜单

知道了菜单的类型,走两步试试,我们创建一个看看效果

1
2
3
4
5
6
7
8
9
let sub_menu = Submenu::new("Tauri", Menu::new().add_item(CustomMenuItem::new("quit", "退出")).add_item(CustomMenuItem::new("close", "关闭")));
let menu = Menu::new()
    .add_submenu(sub_menu);

tauri::Builder::default()
    .menu(menu)
    .invoke_handler(tauri::generate_handler![greet])
    .run(tauri::generate_context!())
    .expect("error while running tauri application");

如下所示

这里要注意,第一级菜单直接添加 CustomMenuItemMenuItem 是不会显示的。不知道是不是我使用的问题。

处理自定义菜单事件

处理自定义 menu 的事件是通过 on_menu_event

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
let sub_menu = Submenu::new("Tauri", Menu::new().add_item(CustomMenuItem::new("quit", "退出")).add_item(CustomMenuItem::new("close", "关闭")));
let menu = Menu::new()
    .add_submenu(sub_menu);
 tauri::Builder::default()
     .menu(menu)
     .on_menu_event(|event| {
         match event.menu_item_id() {
             "quit" => {
             std::process::exit(0)
             }
             "close" => {
                 event.window().close().unwrap()
             }
             _ => {}

         }
     })
     .invoke_handler(tauri::generate_handler![greet])
     .run(tauri::generate_context!())
     .expect("error while running tauri application");

MenuItem 是一个枚举,包含了常用的菜单功能,例如:拷贝、剪切、撤回、重做等等,很不幸的是 Windows 不能使用。

  • About 展示关于页面,包含版本、作者、注释、版权、许可、主页
  • Hide 隐藏程序
  • Services Mac 独有,常见的服务
  • HideOthers Mac 独有,隐藏其它窗口
  • ShowAll Mac 独有,显示所有窗口
  • CloseWindow 关闭当前窗口
  • Quit 退出程序
  • Copy 拷贝
  • Cut 剪切
  • Undo 撤销
  • Redo 重做
  • SelectAll 选择全部
  • Paste 粘贴
  • EnterFullScreen 全屏
  • Minimize 最小化
  • Zoom 缩放
  • Separator 暂不清楚干嘛用的

总结

今天讲了 Tauri 中如何给程序添加菜单功能,还是挺简单的,菜单可以丰富应用的功能,在某些场景下还是挺好用的。

参考

窗口菜单 | Tauri Apps