electron demo 简介

Reference framework: https://github.com/niuyueyang/electron

  • Create borderless
//src/main/index.js
//在 new BrowserWindow中,设置frame:false
mainWindow = new BrowserWindow({
    height: 563,
    useContentSize: true,
    width: 1000,
    frame: false,
  })
  • Set public maximum, minimum, closing assembly
//在components文件夹下面,新建公共组件common.vue
<template>
  <div>
    <section style="-webkit-app-region: no-drag">
      <button type="button" id="maxbt" @click="max">最大</button>
      <button type="button" id="minbt" @click="min">最小</button>
      <button type="button" id="closebt" @click="closes">关闭</button>
    </section>
  </div>
</template>

<script>
    var ipc = require('electron').ipcRenderer;
    export default {
        name: "common",
        methods:{
          max(){
            ipc.send('window-max');
          },
          min(){
            ipc.send('window-min');
          },
          closes(){
            ipc.send('window-close');
          }
        }
    }
</script>

//src/main/index.js
const electron = require('electron')
const ipc = electron.ipcMain

//登录窗口最小化
ipc.on('window-min',function(){
  mainWindow.minimize();
})
//登录窗口最大化
ipc.on('window-max',function(){
  if(mainWindow.isMaximized()){
    mainWindow.restore();
  }else{
    mainWindow.maximize();
  }
})
ipc.on('window-close',function(){
  mainWindow.close();
})
  • Settings icon
//src/main/index.js
var ico = path.join(__dirname, 'img', 'logo.png');
mainWindow = new BrowserWindow({
        width: 1024, 
        height: 640,
        transparent: false,
        frame: true,
        icon: ico, //图标
        resizable : true //固定大小
    });

Guess you like

Origin blog.csdn.net/qq_33332184/article/details/89815004