自定义标题栏

在开发中，我们常常希望将windows自带的窗口操作（最小化，最大化，关闭）的这几个功能自定义UI,毕竟自带的多少有点丑,不然也不会上electron了。

要实现自定义标题栏，那么我们就需要隐藏windows的窗口操作，即创建无边框

 win = new BrowserWindow({
    width: 800,
    height: 600,
    frame: false,  // 开启无边框模式
    })

前端封装一个Menubar操作组件, 有关主进程的操作可以使用上节预加载模块暴露的方法

javascript

const handleClose = ()=> {
  window.electronAPI.setWindowClose()
}

设置css3属性

css

-webkit-app-region: drag; // 设置可拖动

css

 -webkit-app-region: no-drag; // 设置不可拖动

自定义标题栏 ​