49

我正在使用Electron（以前的 atom-shell）并希望有一个简约的框架窗口，以便在 HTML 页面中可以看到三个 OSX 窗口按钮（关闭、最大化、最小化）。

我将 Electron 选项设置frame为false在定义BrowserWindow无铬、无框窗口时。

我想我可以用这样的方式处理关闭按钮：

<a btn href="#" id="close" onclick="window.top.close(); return false"></a>

不幸的是，没有运气。知道如何实现这一目标吗？

4

3 回答 3

143

您必须访问由主进程创建的 BrowserWindow 对象并在其上调用minimize、maximize和close方法。您可以使用该remote模块访问它。这是绑定所有三个按钮的示例：

  const remote = require('electron').remote;

  document.getElementById("min-btn").addEventListener("click", function (e) {
       var window = remote.getCurrentWindow();
       window.minimize(); 
  });

  document.getElementById("max-btn").addEventListener("click", function (e) {
       var window = remote.getCurrentWindow();
       if (!window.isMaximized()) {
           window.maximize();          
       } else {
           window.unmaximize();
       }
  });

  document.getElementById("close-btn").addEventListener("click", function (e) {
       var window = remote.getCurrentWindow();
       window.close();
  });

假设您的最小、最大、关闭按钮的 ID 分别为min-btn、max-btn和close-btn。

您可以在此处查看 BrowserWindow 的完整文档以及您可能需要的其他功能：http: //electron.atom.io/docs/v0.28.0/api/browser-window/。

它还可以帮助您查看我写的关于构建一个看起来像 Visual Studio 的无铬窗口的教程：http ://www.mylifeforthecode.com/making-the-electron-shell-as-pretty-as-视觉工作室外壳。您的问题与一些 css 一起涵盖以正确定位按钮。

于 2015-07-02T01:54:29.433 回答
3

我已经声明了我的窗口：

const electron = require('electron')
const path = require('path')
const BrowserWindow = electron.remote.BrowserWindow

const notifyBtn = document.getElementById('notifyBtn')

notifyBtn.addEventListener('click',function(event){

    const modalPath = path.join('file://', __dirname,'add.html')
    let win = new BrowserWindow({ webPreferences: {nodeIntegration: true}, frame: false, transparent: true, alwaysOnTop:true, width: 400, height: 200 })
    win.on('close',function(){win = null})
    win.loadURL(modalPath)
    win.show()

})

并关闭这个：

const electron = require('electron')
const path = require('path')
const remote = electron.remote

const closeBtn = document.getElementById('closeBtn')

closeBtn.addEventListener('click', function (event) {
    var window = remote.getCurrentWindow();
    window.close();
})
于 2019-12-19T16:17:41.223 回答
-1

用另一种技术来回答这个问题。

与 Electron 相比，您想要在NW.js中做的事情非常简单（通常情况如此）。

<a href="#" onclick="nw.Window.get().close()"></a>

除非您隐藏窗口框架，否则会自动设置最小/最大/恢复内容。在这种情况下，这是一个简单的演示 repo：

于 2021-07-11T20:23:26.507 回答