electron分为两个进程,main和renderer进程
在main主进程中,
index.js就是主进程的进程js
在renderer渲染进程中
renderer进程下目录及作用
assets:放置静态资源,如图片,视频,静态配置
common:放置静态js,如页面需要的公共功能
commponents:放置vue页面
router:放置页面路由
store: 放置公共模块,如vuex
1.BrowserWindow,创建窗口
function createWindow() {
mainWindow = new BrowserWindow({ //创建接口
width: Integer -窗口宽度,单位像素. 默认是 800
height: Integer - 窗口高度,单位像素. 默认是 600.
x: Integer - 窗口相对于屏幕的左偏移位置.默认居中.
y: Integer - 窗口相对于屏幕的顶部偏移位置.默认居中.
useContentSize:Boolean - width和 height使用web网页size, 这意味着实际窗口的size应该包括窗口框架的size,稍微会大一点,默认为 false
center:Boolean - 窗口屏幕居中.
minWidth:Integer - 窗口最小宽度,默认为 0
minHeight:Integer - 窗口最小高度,默认为 0
maxWidth:Integer - 窗口最大宽度,默认无限制.
maxHeight:Integer - 窗口最大高度,默认无限制.
resizable:Boolean - 是否可以改变窗口size,默认为 true
movable:Boolean - 窗口是否可以拖动. 在 Linux 上无效. 默认为 true
minimizable:Boolean - 窗口是否可以最小化. 在 Linux 上无效. 默认为 true
maximizable:Boolean - 窗口是否可以最大化. 在 Linux 上无效. 默认为 true
closable:Boolean - 窗口是否可以关闭. 在 Linux 上无效. 默认为 true
alwaysOnTop:Boolean - 窗口是否总是显示在其他窗口之前. 在 Linux 上无效. 默认为 false
fullscreen:Boolean - 窗口是否可以全屏幕. 当明确设置值为 false,全屏化按钮将会隐藏,在 macOS 将禁用. 默认 false
fullscreenable:Boolean - 在 macOS 上,全屏化按钮是否可用,默认为 true
skipTaskbar:Boolean - 是否在任务栏中显示窗口. 默认是false
kiosk:Boolean - kiosk 方式. 默认为 false
title:String - 窗口默认title. 默认 "Electron"
icon:NativeImage - 窗口图标, 如果不设置,窗口将使用可用的默认图标.
show:Boolean - 窗口创建的时候是否显示. 默认为 true
frame:Boolean - 指定 false来创建一个 Frameless Window. 默认为 true
acceptFirstMouse:Boolean - 是否允许单击web view来激活窗口 . 默认为 false
disableAutoHideCursor:Boolean - 当 typing 时是否隐藏鼠标.默认 false
autoHideMenuBar:Boolean - 除非点击 Alt,否则隐藏菜单栏.默认为 false
enableLargerThanScreen:Boolean - 是否允许改变窗口大小大于屏幕. 默认是 false
backgroundColor:String -窗口的 background color 值为十六进制,如 #66CD00(支持透明度). 默认为在 Linux 和 Windows 上为 #000(黑色) , Mac上为 #FFF(或透明).
hasShadow:Boolean - 窗口是否有阴影. 只在 macOS 上有效. 默认为 true
darkTheme:Boolean - 为窗口使用 dark 主题, 只在一些拥有 GTK+3 桌面环境上有效. 默认为 false
transparent:Boolean - 窗口 透明. 默认为 false
type:String - 窗口type, 默认普通窗口.
titleBarStyle:String - 窗口标题栏样式.
webPreferences:Object - 设置界面特性.
});
mainWindow.loadURL(winURL); //加载窗口url,来自renderer进程的页面
app.on("ready", createWindow); //app准备好时创建窗口
可根据需求设置以上属性。
2.app方法模块
//当window-all-closed触发时,退出app
app.on('window-all-closed', () => {
if (process.platform !== 'darwin') {
app.quit()
}
})
//当electron初始化完成,调取新窗口打开页面
app.on('ready', createWindow)
will-finish-launching:在应用完成基本启动进程之后触发
ready:当electron完成初始化后触发
window-all-closed:所有窗口都关闭的时候触发,在windows和linux里,所有窗口都退出的时候通常是应用退出的时候
before-quit:应用退出前触发
will-quit:即将退出应用时触发
quit:应用退出时触发
win.maxmize::应用最大化
win.minmize: 应用最小化
hide: 当窗口隐藏时
close:窗口关闭