1.窗口的最小化按钮和关闭按钮以及标题栏自定义,不使用 electron 自身携带的原生标题栏

在src文件夹下main下index.js文件添加

mainWindow = new BrowserWindow({
height: 670,
useContentSize: true,
width: 1080,
minWidth:1080,
minHeight:670,
frame: false,//添加后自定义标题//自定义边框

resizable: false,//可否缩放

movable: false//可否移动

webPreferences: {webSecurity: false}
})

2.设置不可移动以后 单独在组件中在设置某个区域可移动窗口拖拽,添加样式即可style="-webkit-app-region: drag;">

3.electron 自带方法

在src文件夹下main下index.js文件添加

import { app, BrowserWindow, ipcMain } from 'electron'

ipcMain.on('min', e=> mainWindow.minimize());
ipcMain.on('max', e=> mainWindow.maximize());
ipcMain.on('close', e=> mainWindow.close());

//自定义边框以后使用
//vue组件中 const { ipcRenderer } = require("electron");
<span @click="close">×</span>
方法:close() { ipcRenderer.send('close'); },//关闭窗口

electron-vue 窗口拖拽及自定义边框,及关闭缩小放大化方法的更多相关文章

  1. iPhone手机解锁效果&&自定义滚动条&&拖拽--Clone&&窗口拖拽(改变大小/最小化/最大化/还原/关闭)

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  2. nw.js FrameLess Window下的窗口拖拽与窗口大小控制

    nw.js FrameLess Window下的窗口拖拽与窗口大小控制 很多时候,我们觉得系统的Frame框很难看,于是想自定义. 自定义Frame的第一步是在package.config文件中将fr ...

  3. QT 窗口拖拽移动实现

    我们知道,要实现窗口移动可以直接鼠标点住窗口的标题栏实现拖拽移动,这是窗口默认的行为,在QT中的事件响应函数为moveEvent. 但是现实中经常需要鼠标点住窗口客户区域实现窗口的拖拽移动,代码实现如 ...

  4. 基于Vue实现拖拽效果

    参考地址:基于Vue实现拖拽效果 参考链接中讲的比较详细,我只使用了其中自定义指令的方法.整体代码如下: <template> <!-- 卡片 --> <div clas ...

  5. Vue 可拖拽组件 Vue Smooth DnD 详解和应用演示

    本文发布自 https://www.cnblogs.com/wenruo/p/15061907.html 转载请注明出处. 简介和 Demo 展示 最近需要有个拖拽列表的需求,发现一个简单好用的 Vu ...

  6. JS实现漂亮的窗口拖拽效果(可改变大小、最大化、最小化、关闭)

    转自<JS实现漂亮的窗口拖拽效果(可改变大小.最大化.最小化.关闭)>:http://www.jb51.net/article/73157.htm   这篇文章主要介绍了JS实现漂亮的窗口 ...

  7. Unity3D UGUI窗口拖拽

    在开发UGUI时 我们时常需要做一个窗口拖拽的功能 先上代码 using UnityEngine; using UnityEngine.EventSystems; public class DragW ...

  8. vue自由拖拽、缩放组件

    github地址:https://github.com/kirillmurashov/vue-drag-resize 安装: npm i -s vue-drag-resize 使用: <temp ...

  9. vue内容拖拽放大缩小

    <!doctype html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

随机推荐

  1. day38 17-Spring的Bean的属性注入:注解方式

    这个类已经可以由Spring控制反转了,那么属性呢?属性分为普通属性和对象属性两部分. JSR是一个组织,和W3C一样是定义一些标准的.它里面也定义了一歌注解,Spring对这个注解也是支持的.其实这 ...

  2. ubuntu上安装notepadpp

    Notepad++是一套非常有特色的自由软件的纯文字编辑器(许可证:GPL).有完整的中文化接口及支持多国语言编写的功能(UTF8 技术).它的功能比 Windows 中的 Notepad(记事本)强 ...

  3. 廖雪峰Python总结3

    1.模块简介 为了编写可维护的代码,我们把很多函数分组,分别放到不同的文件中,这样每个文件包含的代码相对来说就比较少.一个.py文件就称之为一个模块(Module). 使用模块的好处: 提高了代码的可 ...

  4. SQLServer —— EXISTS子查询

    一.删除数据库 use master go if exists (select * from sysdatabases where name = 'Demo') drop database Demo ...

  5. SPSS操作:轻松实现1:1倾向性评分匹配(PSM)

    SPSS操作:轻松实现1:1倾向性评分匹配(PSM) 谈起临床研究,如何设立一个靠谱的对照,有时候成为整个研究成败的关键.对照设立的一个非常重要的原则就是可比性,简单说就是对照组除了研究因素外,其他的 ...

  6. 【JZOJ4858】【GDOI2017模拟11.4】Walk

    题目描述 在比特镇一共有n 个街区,编号依次为1 到n,它们之间通过若干条单向道路连接. 比特镇的交通系统极具特色,除了m 条单向道路之外,每个街区还有一个编码vali,不同街区可能拥有相同的编码.如 ...

  7. Directx教程(29) 简单的光照模型(8)

    原文:Directx教程(29) 简单的光照模型(8)      现在我们新建一个工程myTutorialD3D_23,在这个工程中,对前面一章的代码进行一些整理: 1.我们在顶点属性中增加材质的的漫 ...

  8. 《第一行代码》之——1.Android简介

    Android简介 Android系统架构 (图片源自维基百科) Android大致分为四层架构,五块区域. Linux内核层 Android系统基于Linux2.6,这一层为Android设备的各种 ...

  9. Chef 安装

    http://www.tuicool.com/articles/RnAVn2 三个角色: chef server, chef workstation, chef nodes(chef clients) ...

  10. linux下清除tomcat缓存

    进入tomcat/bin目录下,执行命令:./shutdown.sh 然后执行命令:ps -aux ,查看tomcat是否真的关闭了 如果没有关闭则执行命令:kill -9 #pid来彻底关闭tomc ...