2016-07-05

桌面环境集成

对于桌面应用，不同的操作系统在左面环境中提供了不同的特性。比如在windows下应用程序可以将
应用程序的图标放在任务栏中的跳转列表上，在Mac上，应用可以将自定义菜单放在dock菜单上。
这篇指南将会说明如何利用Electron APIS集成你的应用到桌面环境上。

Notifications（通知）(Windows, Linux, Mac)

这三个操作系统都为用户提供了应用发送通知的方法。Electron允许开发者通过
HTML5 Notification API很方便的发送通知.
用操作系统原生的通知APIs去显示.
注意：由于这是HTML5的API所以只能在渲染进程中使用。
1
2
3
4
5
6
7
let myNotification = new Notification('Title', {
  body: 'Lorem Ipsum Dolor Sit Amet'
});

myNotification.onclick = () => {
  console.log('Notification clicked');
};
尽管代码和用户体验在不同的平台上基本相同，但还是有区别的.

Windows

在windows10, 通知可以工作。

在windows8.1,8上,需要安装
Application User Model ID.aspx)
到开始屏幕上,这不是将你的应用固定到开始屏幕。
Windows7及以下，不支持通知，可以通过
Tray API
发送一个气泡通知。
此外，通知的最大长度为250个字符，Windows团队建议通知的长度保持在200个字符。

Linux ToDo

macOS

通知在macOS上是直接转发的，你应该需要了解Apple's Human Interface guidelines regarding notifications.
注意，通知被限制在256bytes，如果超出将会被截断。

最近文档（Windows和macOS）

Windows 和 macOS 提供获取最近文档列表的便捷方式，那就是打开跳转列表或者鱼眼菜单。
增加一个文件到最近的访问文档，使用app.addRecentDocumentAPI.
1
app.addRecentDocument('/Users/USERNAME/Desktop/work.type');
使用app.clearRecentDocuments清空最近访问列表。
1
app.clearRecentDocuments();

Windows注意点

为了可以在windows上使用这个特性，你的应用需要被注册成为一种文件类型的句柄，否则，在你
注册之前，文件不会出现在跳转列表,你可以在ApplicationRegistration.aspx)
注册你的应用,并了解相关事宜.

macOS注意点

当在最近打开文档中访问该文件时，app模块的’open-file’事件将会被发出。

自定义菜单(macOS)

macOS 可以让开发者定制自己的菜单，通常会包含一些常用特性的快捷方式。
使用app.dock.setMenuAPI来设置你自定义的菜单，仅在macOS上可行。
1
2
3
4
5
6
7
8
9
10
11
12
13
const electron = require('electron');
const app = electron.app;
const Menu = electron.Menu;

const dockMenu = Menu.buildFromTemplate([
  { label: 'New Window', click() { console.log('New Window'); } },
  { label: 'New Window with Settings', submenu: [
    { label: 'Basic' },
    { label: 'Pro'}
  ]},
  { label: 'New Command...'}
]);
app.dock.setMenu(dockMenu);

用户任务（Windows）

在 Windows，你可以特别定义跳转列表的 Tasks 目录的行为，引用 MSDN 的文档：
Applications define tasks based on both the program’s features and the key things a user is expected to do with them. Tasks should be context-free, in that the application does not need to be running for them to work. They should also be the statistically most common actions that a normal user would perform in an application, such as compose an email message or open the calendar in a mail program, create a new document in a word processor, launch an application in a certain mode, or launch one of its subcommands. An application should not clutter the menu with advanced features that standard users won’t need or one-time actions such as registration. Do not use tasks for promotional items such as upgrades or special offers.
It is strongly recommended that the task list be static. It should remain the same regardless of the state or status of the application. While it is possible to vary the list dynamically, you should consider that this could confuse the user who does not expect that portion of the destination list to change.

不同于macOS的菜单，windows上的用户任务的工作方式就像快捷方式一样，当用户点击了一个任务，
一个程序将会被传入特定的参数并且运行.
在你的应用中使用app.setUserTasksAPI设置用户任务
1
2
3
4
5
6
7
8
9
10
app.setUserTasks([
  {
    program: process.execPath,
    arguments: '--new-window',
    iconPath: process.execPath,
    iconIndex: 0,
    title: 'New Window',
    description: 'Create a new window'
  }
]);
调用app.setUserTasks并传入空数组来清空任务列表
1
app.setUserTasks([]);
当你的应用关闭时，用户任务会仍然会出现，在你的应用被卸载前，任务指定的图标和程序的路径
必须是存在的。

缩略图工具栏

在 Windows，你可以在任务栏上添加一个按钮来当作应用的缩略图工具栏。它将提供用户一种用户
访问常用窗口的方式，并且不需要恢复或者激活窗口。
使用BrowserWindow.setThumbarButtons设置应用程序的缩略工具栏
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
const {BrowserWindow} = require('electron');
const path = require('path');

let win = new BrowserWindow({
  width: 800,
  height: 600
});

win.setThumbarButtons([
  {
    tooltip: 'button1',
    icon: path.join(__dirname, 'button1.png'),
    click() { console.log('button1 clicked'); }
  },
  {
    tooltip: 'button2',
    icon: path.join(__dirname, 'button2.png'),
    flags: ['enabled', 'dismissonclick'],
    click() { console.log('button2 clicked.'); }
  }
]);
调用BrowserWindow.setThumbarButtons并传入空数组即可清空缩略图工具栏：
1
win.setThumbarButtons([]);

Unity Launcher Shortcuts (Linux) TODO
Progress Bar in Taskbar (Windows, macOS, Unity) TODO

每天进步一点点