Electron 无边框窗口最大化最小化关闭功能 目的 实现无边框窗口,并添加最大化最小化和关闭功能 前提 了解Electron 主进程和渲染进程的通讯 了解 BrowserWindow相关功能 操作流程 先在界面上放三个按钮 <!-- 窗口的右上角三个操作按钮 --> <section style="-webkit-app-region: no-drag"> <button type="button" id="maxbt&q…

界面如图所示: 要求:在“信息注册”栏,按下鼠标,然后鼠标在页面移动,在鼠标移动过程中,该窗口跟着鼠标移动,当鼠标松开的时候,窗口停止移动.点击“关闭”,该窗口隐藏. 实现思路: 1.页面结构分析:一个大盒子d-box来确定位置,里面放一个小盒子drop(存放“注册信息(可以拖拽”文字和span标签,span存放“关闭”,id为box_close),鼠标在drop中按下,移动时候d-box跟着移动. 2.实现分析: 2.1 获取鼠标在盒子中的位置.通过鼠标在页面中的位置-盒子在页面的位置实现 ①…

前端技术在最近几年迅猛发展,在任何开发领域我们都能看到前端的身影,从PC端到手机端,从APP到小程序,似乎前端已经无所不能,这就要求我们需要不断地去学习来提升自己!前段时间尤大通过直播介绍了一下Vue3.0开发的心路历程并放话今年发布,Deno v1.0 的发布,扬言要干掉Node,摸了摸日渐稀疏的头发,表示真心学不动了,但摸了摸干瘪但口袋表示扶我起来我还能学! 接下来我们要说到但是一个可以开发桌面级应用的框架Electron. 先简单介绍一下Electron,它是由GitHub团队开发,目前在…

一.调用PC端默认方式打开本地文件 在main.js里 // 打开系统本地文件或者网页链接 const {shell} = require('electron'); // Open a local file in the default app var path1 = "d:\\ProjectsSpace\\ElectronProjects\\ElectronTest2\\app\\html\\config\\record.txt"; shell.openItem(path1); //…

github地址 本地安装环境准备 安装node: * https://nodejs.org/en/download/ 配置webpack: npm install -g webpack(sudo权限) windows配置cnpm: npm install -g cnpm --registry=https://registry.npm.taobao.org 因为npm的默认仓库在国外,下载很慢,国内淘宝搞了个CNPM,每10分钟同步一次,完全够用了 当然也可以使用yarn下载 npm insta…

一.调用PC端默认方式打开本地文件 在main.js里 // 打开系统本地文件或者网页链接 const {shell} = require('electron'); // Open a local file in the default app var path1 = "d:\\ProjectsSpace\\ElectronProjects\\ElectronTest2\\app\\html\\config\\record.txt"; shell.openItem(path1); //…

首先戳我下载安装对应版本的node.js. 安装完成后,打开命令行输入node -v以及npm -v查看对应版本.能够正常显示说明安装成功. 写一个最简单的hello world的nodejs应用.nodejs的基础目录结构如图: ♦ node_modules文件夹用于存放开发或应用时的依赖 ♦ index.html:初始化的页面 ♦ main.js:生命周期控制 ♦ package.json:全局配置 如果有小伙伴不知道怎么写,可以参考https://github.com/electron/e…

在看张鑫旭博客得时候看到了electron这个东西,来了兴趣,就按照上面写的将已经做好得vue项目拿来试了试,出乎意料得顺利 electron简单说下electron,就是把 chrome内核和你的项目文件打包成一个程序,和移动端得混合应用有点类似.当然实现起来肯定没有说得这么简单得. 那么怎么做呢? 首先,你电脑上面要有git 和 node ,git可以不要,不过最好安装了,Node必须要. 第二步  使用git clone  https://github.com/electron/elect…

背景 在Electron打开新窗口的时候,提前加载一段JavaScript脚本,以此内置一些属性或接口给被打开的页面.之所以要以注入方式,而不是页面自己引用,原因是不想麻烦页面自行引用,不想修改旧有的业务逻辑. 方法一 一开始是想在打开BrowserWindow后,执行executeJavaScript方法来给相应的窗口注入脚本. 不过这个方法虽然可以在相应的窗口注入脚本,但是它的执行的顺序太后,无法在页面加载时加载到,就导致了如果页面的在加载时使用了注入接口,就会有调用不到问题. 所以这个方法…

一.前言 项目本来打算采用B/S架构去做的,浏览器网址方式打开还是让用户不方便: 二.使用electron集成桌面应用 本身项目是使用vue-cli开发的,在使用electron之前,需要将本身的项目打包好后打开index.html能显示网页.因为刚接触便直接拿官方demo进行打包了. 1.克隆官方demo:git clone https://github.com/electron/electron-quick-start 2.cd electron-quick-start->npm insta…