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//

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

摘要:随着前端技术的飞速发展,越来越多的技术领域开始被前端工程师踏足.从NodeJs问世至今,各种前端工具脚手架.服务端框架层出不穷,“全栈工程师”对于前端开发者来说,再也不只是说说而已.在NodeJs及其衍生技术高速发展的同时,Nw和Electron的问世,更是为前端发展提速不少,依稀记得哪位前辈说过,“能用Js改写的,终将用Js改写”,这不,客户端来了!使用Electron也有一段时间了,各种简单复杂的问题,也都或多或少的遇见过,下决心整理出一套客户端模板出来,一是加深一下自己的理解,二是供

公司开发的产品都是用c++写的,而且还都是几个人,老板想搞下创新,就是看看能否通过其它的方式来实现前后端分离.然后我就了解到了electron这个东西,之前学安卓的时候看到过flutter,不经意间看到了electron,但是没有仔细看,就知道是写工具的.所以最近突然想起来这个东西可以搞一搞.所以我打算以后经常分享一些自己学到的东西给大家.多的不说,上菜. 1.首先创建一个electron+vue的项目(开发工具 Vs Code),用vs打开打开之后的样子. 2.在渲染进程中创建一个js(Men

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

Electron+Vue开发跨平台桌面应用 xiangzhihong发布于 2019-12-23 虽然B/S是目前开发的主流,但是C/S仍然有很大的市场需求.受限于浏览器的沙盒限制,网页应用无法满足某些场景下的使用需求,而桌面应用可以读写本地文件.调用更多系统资源,再加上Web开发的低成本.高效率的优势,这种跨平台方式越来越受到开发者的喜爱. Electron是一个基于Chromium和 Node.js,使用 HTML.CSS和JavaScript来构建跨平台应用的跨平台开发框架,兼容 Mac.

(一)BOM:Browser Object Model(浏览器对象模型)页面上所有的变量都是window的属性 一.方法:1. open(,)打开一个新窗口(页面)一参为页面地址url,二参为打开方式如果url为空,默认打开一个空白页面如果打开方式为空,默认打开新窗口方式打开返回值:发挥新打开的窗口的window对象 2. close(,)关闭窗口,前边对象是谁关闭谁兼容:(1)火狐ff:默认无法关闭(2)Chorme:默认直接关闭(3)ie:询问用户可以关闭在本窗口中通过js方法打开的新窗口

import React from 'react'; class Baby extends React.Component { constructor (props) { super(props) this.state={ name:'小兵' } //第二种改变this指向的方法 this.changeName2= this.changeName2.bind(this); } // 方法根render同级 方法1 changeName1(){ console.log(this.state.nam

.现如今前端框架数不胜数,尤其是angular.vue吸引一大批前端开发者,在这个高新技术快速崛起的时代,自然少不了各种框架的结合使用.接下来是介绍electron+vue的结合使用. 2.Electron是什么?? 对于我来说Electron相当于一个浏览器的外壳,可以把网页程序嵌入到壳里面,可以运行在桌面上的一个程序,可以把网页打包成一个在桌面运行的程序,通俗来说就是软件,比如像QQ.优酷.网易音乐等等.功能的强大超出你的想象,可以构建跨平台桌面程序,本身支持node.js,可以使用node

#!/usr/bin/env python import sys from PyQt5.QtWidgets import (QApplication, QMainWindow, QMessageBox) from PyQt5.QtCore import Qt class Window(QMainWindow): def __init__(self, parent=None): super(Window, self).__init__(parent, Qt.Window) self.status

处理监控系统的时候遇到问题,在MainWidget中创建多个子Widget的时候,原意是想鼠标点击先让MainWidget截获处理后再分派给子Widget去处理,但调试后发现如果子Widget重新实现了事件方法,就直接处理掉事件了,没有进到MainWidget的处理方法中去,如果子Widget没有accept或ignore该事件,则该事件就会被传递给其父亲,在子Widget存在accept或ignore事件的时候,想要经过一下MainWidget的处理方法,就得用到事件处理器,因此网上找了一下,

摘要:上篇文章说到了如何新建工程,并启动一个最简单的Electron应用.“跑起来”了Electron,那就接着把Vue“跑起来”吧.有一点需要说明的是,webpack是贯穿这个系列始终的,我也是本着学习的态度,去介绍.总结一些常用到的配置及思路,有不恰当的地方,或者待优化的地方,欢迎留言.项目完整代码:https://github.com/luohao8023/electron-vue-template 下面开始~~~ 一.安装依赖 vue.webpack:不多说了 vue-loader:解析

原网址:https://www.cnblogs.com/lenya/archive/2010/11/12/3706971.html  (作者:Mark   Brown)         到目前为止,PB的数据窗口控件仍是PB众多控件中功能最强大,最复杂的控件.         数据窗口固有的行为         大家对数据窗口固有的行为都很熟悉.不知道你发现没有,几乎不可能覆盖数据窗口固有的行为.它有自己的一套!         事实确实如此,数据窗口控件确实有自己的固有行为.数据窗口控件是一个

Vue 可以独立完成前后端分离式web项目的JavaScript框架 三大主流框架之一: Angular React Vue 先进的前端设计模式:MVVM 可以完全脱离服务器端,以前端代码复用的方式渲染整个页面:组件化开发 特点: 单页面web应用 数据驱动 数据的双向绑定 虚拟DOM 1 vue初识 变量的定义与值的的输出 vue变量:被称为插值表达式 {{ vue变量 }} <div id='app'> <h1> {{ h1_msg }} </h1> <h2&

Electron 和 Vue 都是干啥的,就不做过多介绍了,可以去官网瞅瞅.下面总结 Electron+Vue 创建项目,Electron + Vue 创建项目实际上相当于:创建Vue项目 + Electron封装. 一.创建Vue项目 + Electron封装 1.创建Vue项目 通过 Vue脚手架工具 vue-cli 创建Vue项目:vue init webpack xxxxxx (注:项目名称中不能出现大写字母) vue init webpack electron-vue 等待Vue项目初

导航: (一)Electron跑起来(二)从零搭建Vue全家桶+webpack项目框架(三)Electron+Vue+Webpack,联合调试整个项目(四)Electron配置润色(五)预加载及自动更新(六)构建.发布整个项目(包括client和web)(未完待续) 摘要:到目前为止,我们的项目已经具备了PC客户端该有的一些基础功能和调试环境,但是总感觉缺了灵魂,那就是结合实际项目.实际业务的细节处理,缺着吧...这篇文章就介绍一下预加载和自动更新,文字功底有限,如有介绍的不清楚的地方,欢迎留言

# 1 最近一直在使用electron开发桌面应用,对于一个web开发者来说,html+javascript+css的开发体验让我非常舒服.之前我一直简单的以为electron只是张网页加个壳,和那些号称跨平台的运行在手机上的webapp是一个套路.直到我真的需要开发一个跨平台桌面应用的时候,我又认真的尝试了一下electron,我开始意识到:这才是我理想中的跨平台桌面应用开发的最终形态,它简直太优秀了. # 2 在使用electron期间,我顺便写了一个简单的todolist(便签)应用,用于

<script type="text/javascript" language="javascript"> //刷新框架各页面 function refresh() { window.frames["topPage"].window.location.href = window.frames["topPage"].window.location.href; window.frames["leftPage&

vue for 绑定事件 <div id="pro_list" v-for="item in pro_list"> <div class="pro"> <div><img src="../img/favicon.png"> <span>{{item.spin_times}}</span></div> <button @click=&quo

gitHub地址:https://github.com/lily1010/vue_learn/tree/master/lesson10 一 vue方法实现 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Vue方法与事件</title> <meta name="viewport" content="width

关于input[type='text']文本框value改变触发事件一些属性的区别oninput,onpropertychange,onchange和文本框的点击全选状态onclick="select();".做购物车页面时会要用到. input[type='text']文本框value改变触发事件一些属性的区别oninput,onpropertychange,onchange: 1.onchange事件与onpropertychange事件的区别:onchange事件在内容改变(两次