electron-vue 窗口拖拽及自定义边框,及关闭缩小放大化方法

时间:2021-07-17 08:27:09

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手机解锁效果&amp&semi;&amp&semi;自定义滚动条&amp&semi;&amp&semi;拖拽--Clone&amp&semi;&amp&semi;窗口拖拽(改变大小&sol;最小化&sol;最大化&sol;还原&sol;关闭)

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

  2. nw&period;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实现漂亮的窗口拖拽效果&lpar;可改变大小、最大化、最小化、关闭&rpar;

    转自<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. QT笔记之自定义窗口拖拽移动

    1.QT自定义标题栏,拖拽标题栏移动窗口(只能拖拽标题,其他位置无法拖拽) 方法一: 转载:http://blog.sina.com.cn/s/blog_4ba5b45e0102e83h.html . ...

随机推荐

  1. GO语言下载、安装、配置

    一.Go语言下载 go语言官方下载地址:https://golang.org/dl/ 找到适合你系统的版本下载,本人下载的是windows版本.也可以下载Source自己更深层次研究go语言. 二.G ...

  2. Query classification&semi; understanding user intent

    http://vervedevelopments.com/Blog/query-classification-understanding-user-intent.html What exactly i ...

  3. Design Tutorial&colon; Make It Nondeterministic

    Codeforces Round #270:C;http://codeforces.com/contest/472 题意:水题 题解:贪心即可. #include<iostream> #i ...

  4. 一、Cocos2dx在visualStudio或者vc&plus;&plus;中环境搭建(入门篇)

    本文由qinning199原创,转载请注明:http://www.cocos2dx.net/?p=106 0.概述 Cocos2dx-win32的项目能够被向导生成 向导支持vs2008,vs2010 ...

  5. DOM操作应用

    创建元素 document.createElement("li"); 添加节点 oUl.appendChild(oLi); 在某个元素之前插入一个节点 oUl.insertBefo ...

  6. 人生苦短 我用Python 第二周的第一天 (数据类型)

    数字:  整形  int  长整形(Python3里面把整形.长整形和到一起啦) 浮点型( float) 1.3 5.2 等等  科学技术发表示 1.3e-3=0.0013 e的代表10. bin是二 ...

  7. Python中append和extend的区别

    编者注:本文主要参考了<Python核心编程(第二版)> 网上有很多对这两个函数的区别讲解,但我觉得都讲的不是很清楚,记忆不深刻.这样解释清楚且容易记住. list.append(obje ...

  8. Intellij idea&colon; java&period;lang&period;ClassNotFoundException&colon;javax&period;el&period;ELResolver异常解决办法

    使用Intellij idea编译过程中遇到的问题及解决办法. 由于编译时候报javax.servlet不存在,我把tomcat下的servlet-api.jar放到了External Librari ...

  9. ACM-ICPC 2018 徐州赛区网络预赛 I Characters with Hash(模拟)

    https://nanti.jisuanke.com/t/31461 题意 一个hash规则,每个字母映射成一个两位数,求给的字符串最后的编码位数,要求去除最终结果的前导零 分析 按题意模拟就是了 # ...

  10. PostMessage实现多窗口之间的数据传递

    [本文参考自网络,参考地址:https://blog.csdn.net/lsyyoyo/article/details/38726419] 1.在公共的头文件中添加一个宏定义: #define WM_ ...