使用 Electron 构建桌面应用（拖动控制篇）

使用 Electron 构建桌面应用（拖动控制篇）

当窗口被定义了大小，咱们也就是在自定义这个窗口，使得它不可拉伸没有框架，让它看起来就像一个真正的声效器浮在桌面上。

如今问题来了 – 要如何移动或者关闭一个没有标题栏的窗口。

很快我就会说到自定义窗口（和应用）的关闭动做，还会谈到如何在主进程和渲染器进程中通讯。不过如今让咱们先把目光聚焦到“拖拽效果”上。你能够在 app/css 目录下找到 index.css 文件：

 

html, body { ... -webkit-app-region: drag; ... } 

-webkit-app-region: drag;把整个 html 都变成了一个可拖拽的对象。如今问题来了，在可拖拽的对象上你怎么点击啊？！好的，可能你会想到把 html 中某个部分的这个属性值设置为no-drag;，那就容许该元素不可拖拽（但能够点击了）。让咱们想一想下面这段 index.css 片断：

 

.button-sound {
    ...
    -webkit-app-region: no-drag;
}