電子メールでMacのメニューバーにカスタムメニューを追加するには？

Question

私は、電子（nodejs）を持つMacのメニューバーにカスタムメニューを追加したい
例：我々は

を持っていると私は右Electron後filter menuを追加したいです。

Answer 1

API docs hereにネイティブのカスタムアプリケーションメニューを作成する方法についての素晴らしいドキュメントがあります。さまざまなオプションと機能、プラットフォームの違いがあります。

は、例えば、メイン処理コードで、あなたがこのような何かを行うことができます：

ラベル「フィルタ」を使用してアプリケーション・レベルのメニューを作成します

const { app, BrowserWindow, Menu } = require('electron'); 
const path = require('path'); 
let mainWindow; 

app.on('ready',() => { 
    mainWindow = new BrowserWindow(); 
    mainWindow.loadURL(path.join('file://', __dirname, 'index.html')); 
    setMainMenu(); 
}); 

function setMainMenu() { 
    const template = [ 
    { 
     label: 'Filter', 
     submenu: [ 
     { 
      label: 'Hello', 
      accelerator: 'Shift+CmdOrCtrl+H', 
      click() { 
       console.log('Oh, hi there!') 
      } 
     } 
     ] 
    } 
    ]; 
    Menu.setApplicationMenu(Menu.buildFromTemplate(template)); 
} 

ラベルされた1つのメニュー項目が表示されます開いたときに "こんにちは"。それをクリックすると、コンソールにログが記録されます。

electron-prebuiltを使用している場合は、常に左上に「エレクトロン」と表示されます。スタンドアロンアプリケーションとしてアプリケーションをコンパイルすると（電子プレビルドでは実行されません）、アプリケーション名が表示されます。

@nonhomerが指摘しているように、このAPIはappモジュールのreadyイベントの後に呼び出される必要があります。

電子版を開発に使用するときは、デフォルトの電子アプリでデフォルトメニューが表示されます（https://github.com/electron/electron/blob/d26e4a4abf9dfc277974c6c9678a24a5f9e4d104/default_app/main.js#L48参照）。あなたのアプリケーションをパッケージ化するとき、それはそこにはありません。

Answer 2

APIドキュメントの小さなメモがあります： http://electron.atom.io/docs/api/menu/#menusetapplicationmenumenu

注：このAPIは、アプリケーションモジュールの準備イベントの後に呼び出される必要があります。

興味深いのは、Windowsで直接呼び出されることです。ここで

は簡単な例です：

const {app, BrowserWindow, Menu} = require('electron') 

const menuTemplate = [...] 
const menu = Menu.buildFromTemplate(menuTemplate) 

let win 

function createWindow() { 
    win = new BrowserWindow({ width: 800, height: 600, }) 

    win.loadURL(`file://${__dirname}/index.html`) 

    win.on('closed',() => { 
     win = null 
    }) 
} 

app.on('ready',() => { 
    Menu.setApplicationMenu(menu) 
    createWindow() 
}) 

app.on('window-all-closed',() => { 
    app.quit(); 
}) 

app.on('activate',() => { 
    if (win === null) { 
     createWindow() 
    } 
})