原子电子-用javascript关闭窗口

Question

我正在使用电子（以前是atom-shell），并希望有一个极简主义的框架窗口，以便三个OSX窗口按钮（关闭，最大化，最小化）从超文本标记语言页面内可见。

在定义浏览器窗口时，我将Electron选项frame设置为false，使其具有无铬无框窗口。

我想我可以用这样的东西来处理关闭按钮：

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

不幸的是，运气不好。知道如何实现这一点吗？




Answer 1

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

在NW中，您想做的事情非常简单。js，与电子相比（总是这样）。

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

“最小值/最大值/还原”内容是自动设置的，除非您隐藏窗口框架。在这种情况下，下面是一个简单的回购演示：

• https://github.com/nwutils/frameless-example

Answer 2

我已经声明我的窗口：

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();
})

Answer 3

您必须访问由主进程创建的BrowserWindow对象，并在此基础上调用最小化、最大化和关闭方法。您可以使用远程模块访问它。下面是绑定所有三个按钮的示例：

  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();
  }); 

假设min、max、关闭按钮的id分别为min-btn、max-btn和近距离btn。

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

这也可能有助于您了解我编写的一个教程，该html" target="_blank">教程介绍了如何构建一个类似Visual Studio的无铬窗口：http://www.mylifeforthecode.com/making-the-electron-shell-as-pretty-as-the-visual-studio-shell.您的问题将与一些css一起讨论，以正确定位按钮。