electron

ready:当Electron完成时被触发

window-all-closed:所有窗口被关闭时触发

before-quit:在窗口关闭之前触发

will-quit:在所有窗口都已经关闭并且应用程序将要退出

quit:退出之前

webview

did-start-loading: webview加载之前

did-stop-loading:webview加载完成之前

insertCSSa

window.open

render.js

function openNewWindow (){
 suwindow =  window.open('popup_page.html','popup');
}
function closeWindow (){
 suwindow.close(); 
}

render.js

window.addEventListener('message',()=>{})

window.addEventListener('message',(msg)=>{
     console.log(msg);
})

父窗口index.html

<button οnclick='openNewWindow'>弹出子窗口</button>
<button οnclick='closeWindow'>关闭子窗口</button>
<script src='./render.js'></script>

子窗口popup_page.html

window.opener.postMessage()，括号里面可以传字符串或者对象

<button οnclick='sendMessage'>向父窗口传递信息</button>
<script>
fuction sendMessage(){
   window.opener.postMessage({
   type:1,
   message:'信息'
   })
}
</script>

BrowserWindow

边框：frame:false

const mainWindow = new BrowserWindow({
    width: 800,
    height: 600,
    frame: false, //无边框
    webPreferences: {
      preload: path.join(__dirname, "preload.js"),
      nodeIntegration: true,
      webviewTag: true,
    },
  });

防止页面加载闪烁

mainWindow.once("ready-to-show", () => {
   mainWindow.show();
});

父子窗口

  const mainWindow = new BrowserWindow({
    width: 800,
    height: 600,
    frame: false, //无边框
    webPreferences: {
      preload: path.join(__dirname, "preload.js"),
      nodeIntegration: true,
      webviewTag: true,
    },
  });
 const child = new BrowserWindow({ parent: mainWindow });
 child.show();

模态窗口 :子窗口不关闭无法点击父窗口 设置modal:true

设置位置 x,y

const child = new BrowserWindow({ parent: mainWindow, modal: true ,x:0,y:0});
child.show();

BrowserView

const view = new BrowserView();
  mainWindow.setBrowserView(view);
  view.setBounds({
    x: 0,
    y: 10,
    width: 800,
    height400,
  });

dialog

渲染进程 render.js

const { dialog } = require("electron").remote;

function openDialog() {
  dialog.showOpenDialogSync({
    title: "请选择喜欢的文件",
    filters: [{ name: "Custom File Type", extensions: ["js", "html", "json"] }],
  });
}
function saveDialog() {
  dialog.showOpenDialogSync({
    title: "请选择保存的文件",
    filters: [
      { name: "Custom File Type", extensions: ["js", "html", "json"] },
      (result) => {
        console.log(result);
      },
    ],
  });
}

主进程和渲染进程通信

main.js

//send-message-from-render、send-message-to-render事件名是自定义的，要求主进程和渲染进程事件名一致
const { BrowserWindow,ipcMain } = require("electron");
ipcMain.on("send-message-from-render", (event, arg) => {
  console.log("接收到的数据", arg);
  event.reply("send-message-to-render", "返回给渲染进程");
});

mainWindow.webContents.send(
  "send-message-to-render",
  "主进程主动向渲染进程发送信息"
);

render.js

const { ipcRenderer } = require("electron");
function sendmessage() {
  ipcRenderer.send("send-message-from-render", "渲染进程发送的数据");
}
ipcRenderer.on("send-message-to-render", (event, arg) => {
  console.log("渲染进程接收到的数据", arg);
});

Menu

 setTimeout(() => {
    const template = [{ label: "菜单一" }, { label: "菜单二" }];
    const menu = Menu.buldFromTemplate(template);
    Menu.setApplicationMenu(menu);
    menu.popup();
  }, 1000);                                         

Api网络

render.js

function access() {
  const { net } = require("electron").remote;
  const request = net.request("http://baidu.com");
  request.on("response", (response) => {
    console.log(response.statusCode);
  });
  response.on("data", (chunk) => {
    console.log("接收到数据", chunk.toString());
  });
  response.on("end", () => {
    console.log("数据完成");
  });
  request.end();
}