Electron 创建一个空白的界面

来源：cnblogs　　作者：唐宋元明清2188　　时间：2018/10/15 9:22:10　　对本文有异议

添加应用

首先添加一个Lorikeet版本的Electron应用。

 1 'use strict' 2 const electron = require('electron'); 3 const app = electron.app; 4 const BrowserWindow = electron.BrowserWindow; 5  6 let mainWindow = null; 7  8 app.on('window-all-closed', () => { 9     if (process.platform !== 'darwin') {10         app.quit();11     }12 });13 14 app.on('ready', () => {15     mainWindow = new BrowserWindow();16     mainWindow.loadURL(`file://${app.getAppPath()}/index.html`);17     mainWindow.on('closed', () => {18         mainWindow = null;19     });20 });

菜单设置

1. 永久隐藏菜单

const electronMenu=electron.Menu;

electronMenu.setApplicationMenu(null);

另：也可以直接设置mainWindow.setMenu(null);

 1 'use strict' 2 const electron = require('electron'); 3 const app = electron.app; 4 const BrowserWindow = electron.BrowserWindow; 5 const electronMenu=electron.Menu; 6  7 let mainWindow = null; 8  9 app.on('window-all-closed', () => {10     if (process.platform !== 'darwin') {11         app.quit();12     }13 });14 15 app.on('ready', () => {16     electronMenu.setApplicationMenu(null);17     mainWindow = new BrowserWindow();18     mainWindow.loadURL(`file://${app.getAppPath()}/index.html`);19     mainWindow.on('closed', () => {20         mainWindow = null;21     });22 });

View Code

2. 自动隐藏菜单

设置BrowserWindow的属性，autoHideMenuBar： true。

设置autoHideMenuBar隐藏后，按Alt，可显示出菜单选项。

 1 'use strict' 2 const electron = require('electron'); 3 const app = electron.app; 4 const BrowserWindow = electron.BrowserWindow; 5  6 let mainWindow = null; 7  8 app.on('window-all-closed', () => { 9     if (process.platform !== 'darwin') {10         app.quit();11     }12 });13 14 app.on('ready', () => {15     mainWindow = new BrowserWindow({autoHideMenuBar：true});16     mainWindow.loadURL(`file://${app.getAppPath()}/index.html`);17     mainWindow.on('closed', () => {18         mainWindow = null;19     });20 });