模态窗口是指禁用父窗口的子窗口,也就是说,处于模态子窗口下,无法使用父窗口,直到模态窗口关闭。
在mac系统和windows系统下,模态窗口有以下几点区别:
1.模态窗口在mac系统下会隐藏窗口的标题栏,只能通过close方法关闭模态子窗口;在windows下模态子窗口仍然会显示菜单和标题栏。
2.在mac系统下,模态子窗口显示后,父窗口仍然可以拖动,但无法关闭;在windows下,模态子窗口显示后,父窗口无法拖动。
模态窗口主要应用于桌面应用的对话框显示,如设置对话框、打开对话框。
在创建子窗口的时候加一个属性modal,modal设为true,就可以把子窗口设置为模态窗口。
例子如下:
const {app,BrowserWindow} = require('electron')
function createWindow(){
//创建父窗口
parentWin = new BrowserWindow({
width:800,
height:600,
webPreferences: {
nodeIntegration: true
}
})
//创建子窗口
childWin = new BrowserWindow({
parent:parentWin,
modal:true,
width:300,
height:300,
webPreferences: {
nodeIntegration: true
}
})
//父窗口加载页面
parentWin.loadFile('index.html')
//子窗口加载页面
childWin.loadFile('index.html')
}
app.allowRendererProcessReuse = true
app.on('ready',createWindow)
function createWindow(){
//创建父窗口
parentWin = new BrowserWindow({
width:800,
height:600,
webPreferences: {
nodeIntegration: true
}
})
//创建子窗口
childWin = new BrowserWindow({
parent:parentWin,
modal:true,
width:300,
height:300,
webPreferences: {
nodeIntegration: true
}
})
//父窗口加载页面
parentWin.loadFile('index.html')
//子窗口加载页面
childWin.loadFile('index.html')
}
app.allowRendererProcessReuse = true
app.on('ready',createWindow)