(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文件;
//接收消息
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线程向渲染线程发送消息
//发送消息
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。