我正在使用Electron
(以前称为atom-shell)并希望拥有一个简约的框架窗口,以便从中可以看到三个OSX窗口按钮(关闭,最大化,最小化) HTML页面。
在定义BrowserWindow
以设置无框无框窗口时,我将电子选项frame
设置为false
。
我以为我可以用这样的东西处理关闭按钮:
<a btn href="#" id="close" onclick="window.top.close(); return false"></a>
没有运气,可悲的是。知道如何实现这个目标吗?
答案 0 :(得分:112)
您必须访问由主进程创建的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();
});
假设您的最小,最大,关闭按钮分别包含min-btn
,max-btn
和close-btn
的ID。
您可以在此处查看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-the-visual-studio-shell。你的问题和一些css一起被覆盖,以正确定位按钮。
答案 1 :(得分:1)
我已经声明了我的窗口:
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();
})
答案 2 :(得分:0)
用替代技术回答这个问题。
与 Electron 相比,您想要在 NW.js 中做的事情非常简单(总是如此)。
<a href="#" onclick="nw.Window.get().close()"></a>