electron 部分常用功能的实现

标签：election api 系统托盘 图标 线程 通信 消息 浏览器 跳转

（windowds下测试，其他系统未测）

1，系统托盘图标，

main.js:

const Tray = require(‘electron‘).Tray;
const Menu = require(‘electron‘).Menu;
let tray;
tray = new Tray(__dirname + ‘/build/img/icon.png‘);//系统托盘图标
tray.setToolTip(‘miaoLian.in‘);//鼠标放到系统托盘图标上时的tips;
const menu = Menu.buildFromTemplate([   // 定义右建菜单
    {label: "主页", click: goHomeHandle},
    {label: "注册", click: registerHandle},
    {label: "注销", click: logoutHandle},
    {label: "退出", click: closeHandle}
]);
tray.setContextMenu(menu);//应用右建菜单
tray.on(‘click‘, function () { // 左键单击时显示窗口
    mainWindow.show();
});

2,渲染线程向main线程发送消息

渲染线程：你的正常项目中的文件

main线程：electron要求必须有的main.js文件;

main.js:

//接收消息
const ipcMain = require(‘electron‘).ipcMain;
ipcMain.on(‘closeWindow‘, function () { // closeWindow  可自己随意定义
    app.quit();
});
ipcMain.on(‘minimize‘, function () { //minimize 可自己随意定义
    mainWindow.hide();
});

project XX.js:

//发送消息
const ipcRenderer = global.require(‘electron‘).ipcRenderer;
minimizeBtnClickHandle() {
    ipcRenderer.send(‘minimize‘)// 和接收消息的字符串对应
};

3，main线程向渲染线程发送消息

main.js:

//发送消息
const BrowserWindow = electron.BrowserWindow;
let mainWindow;
mainWindow = new BrowserWindow({ XX:XX,XX:XX});
function closeHandle() {      //见（1）系统托盘图标中右键菜单中的退出选项
                              // closeFunc 可自己随意定义 与接收消息对应即可
    mainWindow.webContents.send("closeFunc"); 
}

project XX.JS:

//接收消息
const ipcRenderer = global.require(‘electron‘).ipcRenderer;
ipcRenderer.once(‘closeFunc‘,this.closeHandle.bind(this));
closeHandle() {
    /*自己的逻辑处理*/
     ipcRenderer.send(‘closeWindow‘);
}

注意：所有的监听中，都可以用on 或者once 但两者有区别，on是一直监听，触发事件之后还能继续监听。但once只能被触发一次，然后就会被自动取消监听，请在合适的时候用合适的方法。

4，打开默认浏览器并跳转到指定网页

const shell = require(‘electron‘).shell;
shell.openExternal(`https://miaolian.in`);

另：

electron 中的API 不是在任何文件中都可以用的。

有一部分只能在main线程中用，比如ipcMain

有一部分只能在渲染线程中用，比如ipcrenderer

还有一部分是通用的，比如shell。

更多详情见文档：http://electron.atom.io/docs/

中文文档：https://github.com/electron/electron/tree/master/docs-translations/zh-CN

本文出自 “__无字书” 博客，请务必保留此出处http://wuzishu.blog.51cto.com/6826059/1829551

electron 部分常用功能的实现

标签：election api 系统托盘 图标 线程 通信 消息 浏览器 跳转

原文地址：http://wuzishu.blog.51cto.com/6826059/1829551