전자 메뉴가있는 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)); 
} 

표시된 단일 메뉴 항목을 표시합니다 열 때 " 여보세요". 그것을 클릭하면 콘솔에 기록됩니다.

electron-prebuilt을 사용하는 경우 항상 왼쪽 상단에 "전자"라고 말합니다. 전자 사전 빌드를 통해 실행되지 않는 독립 실행 형 응용 프로그램으로 응용 프로그램을 컴파일하면 응용 프로그램 이름이 표시됩니다.

@nonhomer가 지적했듯이이 API는 앱 모듈의 준비 이벤트 후에 호출되어야합니다.

일렉트론을 개발할 때 기본 전자 장치 앱이 기본 메뉴를 제공한다고 덧붙여 야합니다 (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() 
    } 
})