MFC子窗口任务栏显示图标很简单， 只需要在子窗口的初期化函数OnInitDialog()中添加ModifyStyleEx(WS_EX_TOOLWINDOW, WS_EX_APPWINDOW); 主窗口在系统托盘中显示图标以及恢复窗口是参考某位大神的代码...（一） 原理 1、最小化的原理：首先要将窗口隐藏，然后在右下角绘制图标。 ...2、恢复的原理：将窗口显示，再将托盘中的图片删除。... ShowWindow(SW_HIDE); //隐藏主窗口 } 2、恢复界面函数，在头文件中定义消息响应函数 afx_msg LRESULT OnShowTask... { this->ShowWindow(SW_SHOW);//简单的显示主窗口完事儿
('parent.html') child.loadFile('child.html') 子窗口将总是显示在父窗口的顶部，如果父窗口关闭，子窗口自动关闭。...可以跨过子窗口操作父窗口的内容。 在Mac OS X下，移动父窗口，子窗口会随着父窗口移动，但在Windows下子窗口不会移动 模态窗口 模态窗口是禁用父窗口的子窗口，无法跨过子窗口操作父窗口的内容。...('parent.html') child.loadFile('child.html') 模态窗口在Mac OS X下子窗口自动顶部居中对齐，并且没有标题栏，只能通过调用子窗口的close()方法关闭模态子窗口...；在Windows下，模态子窗口仍然会显示菜单和标题栏。...child.close() 在Mac OS X下，模态子窗口显示后，父窗口仍然可以拖动，但无法关闭；在Windows下，模态子窗口显示后父窗口无法拖动。
虽然Discord的Electron架构并不是开源的，但Electron的JS代码是保存在应用本地，所以我是可以提取查看到的。...由于Electron内置的JS代码在渲染时可以在任意的Electron APP中执行，所以一般我测试Electron的RCE时，习惯首先在渲染时用Electron内置的JS代码来测试。...但是，由于目标应用不同的Electron版本使用或BrowserWindow选项设置，Discord这里Electron运行启动时，我实际测试的PoC总是不稳定，所以我把测试重点放在了预加载脚本上。...中导航（navigating）到另一URL中的顶层窗口。...为了进行导航绕过测试，我创建了一个简单的Electron应用，然后发现，顶部导航（top navigation）中的”will-navigate” 事件并不会从iframe中跳出，具体来说，如果顶部导航的所属域和
electron-vchat客户端聊天实例是基于electron+vue+vuex+Node+vue-router等技术开发的仿制微信pc桌面聊天项目。...electron主进程创建窗口 通过electron提供的BrowserWindow对象创建窗体，electron-vue构建项目后，主进程入口页面是src/main/index.js import...frame: false, resizable: true, // 窗口创建的时候是否显示....electron实现自定义顶部最大/小化、关闭按钮、无外框窗口 electron 中配置 frame: false 后，就能去除原窗体顶部，原先的顶部操作栏就没有了，需要自定义配置。...execFile方法执行exe文件，exe调用同级目录下的微信截图dll，调出截图工具 // 可编辑div contenteditable中粘贴发送图片 submitPasteImage{ let that
传统的 Web APP 的开发基本上不会涉及到菜单，但是在 Electron 里面它提供了对于菜单全面的控制，你可以通过 Menu、MenuItem 模块来创建应用所需的自定义菜单。...这三种菜单的含义分别是： 应用菜单：应用菜单通常位于应用程序的顶部，提供了用户可能用到的各种操作，如程序的快捷方式、常用的文件夹及系统命令等。 上下文菜单：在应用里面点击右键看到的菜单。...菜单模板： 菜单的 template 是一个对象数组，每个对象会定义一个独立的菜单，它会显示在应用菜单的 Bar 位置，显示的文字通过 label 属性进行定义。...需要注意的是：上下文菜单，需要在渲染进程中进行实现。在渲染进程中是需要通过remote模块调用主进程中的模块。...contextMenu.popup({ window: remote.getCurrentWindow() }); }, false); Dock菜单 最后，我们一起看看 Dock 菜单，Dock 的菜单实现也是在主进程中
图3.1 我们的应用程序的线框显示，用户可以在左侧窗格中输入文本，或者从用户的文件系统的文件中加载文本。 在这一章中，我们为我们的应用奠定了基础。...在index.html,我们添加清单3.3中的标记来创建图3.5中的浏览器窗口。 ? 图3.5 开始我们第一个未样式化的Electron应用 列表3.3 我们应用的标记：....正如我们在第1章和第2章中讨论的，我们的应用程序总是跟上Chrome的最新版本，所以我们可以放心地使用Flexbox布局模式，而不用担心跨浏览器兼容性。 使用Flexbox创建页面布局：....优雅地显示浏览器窗口 如果你仔细观察你的应用程序的启动，您将注意到，在Electron加载index.html并在窗口中呈现DOM之前，窗口完全为空。...如果我们隐藏窗口直到内容被加载呢?然后，当UI准备好时，我们显示窗口，并避免短暂地暴露一个空窗口。
在顶部有一系列按钮，允许用户从文件系统加载文本文件，并将结果写入剪贴板或文件系统。 在应用程序的第一阶段，我们构建了以下的界面。在图3.1。...在index.html,我们添加清单3.3中的标记来创建图3.5中的浏览器窗口。 [figure35.png] 图3.5 开始我们第一个未样式化的Electron应用 列表3.3 我们应用的标记：....正如我们在第1章和第2章中讨论的，我们的应用程序总是跟上Chrome的最新版本，所以我们可以放心地使用Flexbox布局模式，而不用担心跨浏览器兼容性。 使用Flexbox创建页面布局：....优雅地显示浏览器窗口 如果你仔细观察你的应用程序的启动，您将注意到，在Electron加载index.html并在窗口中呈现DOM之前，窗口完全为空。...如果我们隐藏窗口直到内容被加载呢?然后，当UI准备好时，我们显示窗口，并避免短暂地暴露一个空窗口。
SubFrames 中开启 Node.js 这是一个实验性质的选项，决定是否允许在子页面(iframe)或子窗口(child window)中集成Node.js； 预先加载的脚本会被注入到每一个iframe...，在虚拟机里又装了虚拟机一个道理，而最终的物理机被称为顶级浏览上下文 在 Electron 之前的测试中，我们只用到了一个窗口，我们一直称之为主窗口，但从逻辑角度来说，没有子窗口的存在，也就没有什么主窗口之说...大家有些时候在使用应用程序的时候，点击某个功能会跳出来一个新的窗口，这个就叫做子窗口 举个例子，我们在电脑版微信中查看公众号文章时，点击文章，会出现一个新的窗口来显示文章内容，而不是在原本的窗口呢，这样原本的窗口可以继续聊天等...在之前的一些版本中，似乎子窗口会继承父窗口的一些配置，但后来主要是为了生命周期等，简单来说，我把父窗口关了，子窗口也会被关闭或其他设置 该参数要在父窗口初始化是配置，而不是子窗口 0x03 测试 iframe...nodeIntegrationInSubFrames: true 时子窗口是否能够读取父窗口的 Preload 中的内容 获取失败，看起来官方文档中描述的 child window 并不是官方文档其他部分中的
，突然在当前窗口之外跳出来一个窗口，那就是一个新窗口创建了 在 Electron 中，一个新窗口创建背后都意味着存在对应的管理操作，这种管理可能可以让窗口赋予非凡的权限，例如执行 Node.js 创建新窗口分为两种...在之前的章节中，我们尝试过使用 BrowserWindow、BaseWindow 在主进程中创建窗口，同时我们尝试过在渲染进程中通过 window.open 创建新的窗口 除此之外还有两个特例，就是...渲染进程创建新窗口在之前的文章中出现过绕过安全限制的情况(iframe + window.open) ，但 window.open 不仅仅是绕过安全限制那么简单，其实在 Electron 中 window.open...根据 web 技术中对 window.open 的描述，也和之前 web 嵌入章节一样，如果父窗口和子窗口同源，则可以通过对象关系进行访问，不同源则不行 当然，在 features 中也有 noopener...同源情况下，子窗口获取父窗口上下文测试 同源情况下的访问是双向的，与之前 iframe 、object 之类的没有区别 非同源情况下，按照正常来说，父窗口访问子窗口应该还是一样的 结果并不是我们想的那样
唯一客服系统PC客户端，利用Electron打包实现 可以避免浏览器被误关闭，支持缩小在右下角系统托盘中，支持通知栏和声音访客新消息提醒 一个Electron应用程序的package.json文件。...7.0.2" } } electron：Electron框架本身的依赖项。...electron-builder：用于构建和打包Electron应用程序的工具。 electron-packager：用于将Electron应用程序打包为可执行文件的工具。...electron-winstaller：用于将Electron应用程序打包为Windows安装程序的工具。...= new Tray(path.join(__dirname, 'favicon.ico')) //点击托盘图标显示窗口 tray.on('click', () => { win.show
如果在对话框的属性数组中激活多重选择，用户可以选择 多个文件。为了一致性，Electron总是返回一个数组。 ? 图4.3 选择文件后，文件的完整路径将被记录到终端窗口中的控制台。...在macOS中，我们能够从窗口顶部从表格的形式显示对话框，而不是显示在窗口前面(清单4.6)。...，Electron现在将Open File对话框显示为一个工作表，该工作表从传递给方法的窗口下拉，如图4.8所示。...我们在主进程和渲染进程的顶部都使用了Node的内置requrie函数 当我们需要一个模块时，我们究竟要导入什么?在Node中，我们显式地声明应该从模块导出什么功能，如清单4.8所示。...在macOS中，我们可以通过在dialog. showopendialog()中提供对该窗口的引用作为第一个参数，使对话框从其中一个窗口作为工作表下拉。
使用说明 搜索 按下快捷键（默认为 F1）或者点击编辑器顶部菜单栏中的 扩展 -> Quick Finder -> 搜索 即可打开搜索栏。 在搜索栏中输入关键词就会得到符合条件的文件列表。...设置 点击编辑器顶部菜单栏中的 扩展 -> Quick Finder -> 设置 即可打开扩展的设置面板。 设置面板 在设置面板中你可以更换打开搜索栏的快捷键，也可以自定义一个自己喜欢的快捷键。...编辑器的窗口 首先，编辑器提供的窗口实际上也是使用 Electron 创建的，只不过编辑器内部对窗口进行了二次封装，并建立了自己的开发规范。...Electron 窗口 如果直接使用 Electron 创建窗口，我们可以把扩展的页面完成当做一个 Web 前端项目来做，写起来舒服多了。...实际上，由于扩展只进行信息采集（名称，扩展名），并不读取文件内容，处理起来还是非常快的。项目里 8000+ 的文件也就是一下子的功夫，可以说是无感。
背景说明： 窗口指的就是我们在电脑端经常使用的软件时候显示Logo，标题和操作最小化，最大化，关闭按钮的标题栏及标题栏下面显示内容的整个窗口，这往往在Web前端中接触的不是那么多，但要开发一款体验不错的...窗口距离屏幕左侧的距离 y 窗口距离屏幕顶部的距离 center 窗口是否居中显示 movable 窗口是否可移动 控制窗口尺寸： width 窗口宽度（像素），默认800...，在窗口对象上新增frame属性且设置值为false，如下图： 在Vue的App.vue中通过html标签来绘制我们的标题栏，绘制后的结果如下图所示： 为标题栏的按钮增加事件： 按钮事件和调用函数的定义均与...Vue一致，我们需要考虑的是如何与Electron联通来调用对应的API： 调整窗口对象中的如下所示属性，切记启用remote： 在App.vue中导入electron对象： const { remote...我们需要在主进程关闭展示窗口，并由我们在渲染进程中控制： 总结： 本篇主要介绍了对于Electron开发GUI应用是对于窗口上的标题栏的自定义，简单的做了一些演示，后续还有一块就完成了整个窗口部分的内容
有可能是根据分辨率来显示的) 最大宽度: 605px 顶部头像区域高度: 140px 底部选项区域高度: 40px 搜索框高度: 30px 头像直径/高度: 50px 右键菜单宽度: 180px 下载安装...将主窗口 show:false 暂时不让显示 之后再创建一个main.js 让他来创建我们要做的窗口!...useContentSize: true, //使用web网页size, 这意味着实际窗口的size应该包括窗口框架的size，稍微会大一点，默认 frame: false..., //去掉顶部 transparent: true, //透明窗口 type: 'toolbar', //工具栏窗口 webPreferences...版权声明 本文只学习electron使用 不做任何商业用途,文章中使用的腾讯qq相关图片和相关Logo都作为学习使用,如果侵犯了腾讯的相关权益,请联系作者删除!
3 差异 在本章节中，我们将会讨论在Windows与macOS平台上使用electron开发时所遇到的实在难崩的坑，并提供相应的解决方案。...早期使用rimraf ，发现rimraf包在文件路径中存在子文件夹时，对于路径的识别就无法跨平台，体验非常难受。 目前的话，转向了通过del-cli 来完成该步骤，该包能够满足跨平台需求。...3.2 窗口操作 在mac中，关闭窗口并不一定代表关闭应用程序。当最后一个窗口被关闭时，应用程序将保持运行状态。...该问题的处理方案并不麻烦。...其中templateIcon用于在macOS中显示模版图标，而baseIcon用于在Windows中显示图标。
electron . 如果它打开一个标题为MyGame的空白应用程序窗口，说明你已完成。 现在我们需要将 Cocos 导出的项目提供给 BrowserWindow。...打开你的 Cocos Creator 项目，选择你希望将其导出到 Electron 项目中的某处，在 Electron 项目的根文件夹中创建一个名为cocosExport的子文件夹。...现在，你需要将一些文件复制到你的 Electron 项目中。 首先，在 Electron 项目的根文件夹中创建一个名为 Greenworks 的文件夹。...在 lib 文件夹中，将文件 greenworks-win64.node 替换为你在上一步中构建的文件。...接下来，我们需要告诉 Electron 浏览器窗口的 HTML 可以与本机节点进程通信。本质上使 electron.js 可用。
一个 Electron 应用总是有且只有一个主进程。...我们在渲染进程中创建的 dialog 对象其实并不在我们的渲染进程中，它只是让主进程创建了一个 dialog 对象，并返回了这个相对应的远程对象给了渲染进程。...就像在浏览器中使用一样，这种存储相当于在应用程序中永久存储了一部分数据。有时你并不需要这样的存储，只需要在当前应用程序的生命周期内进行一些数据的共享。...可以通过指定titleBarStyle选项来再将工具栏按钮显示出来，将其设置为hidden表示返回一个隐藏标题栏的全尺寸内容窗口，在左上角仍然有标准的窗口控制按钮。...，而不借助客户端的界面资源，一般菜单分为两种： 应用程序菜单：位于应用程序顶部，在全局范围内都能使用 上下文菜单：可自定义任意页面显示，自定义调用，如右键菜单 Electron为我们提供了Menu模块用于创建本机应用程序菜单和上下文菜单
实现桌面程序 核心环境 整个项目完全使用 typescript 实现，electron 中运行主进程和渲染进程，使用的 api 有所不同，所以在 core 中每个目录组织也是按照使用的 api 来安排.../windows.ts 接下来到了 electron 的 windows 窗口，open 方法在 doOpen 中执行窗口配置初始化，最终调用 openInBrowserWindow -> 执行 doOpenInBrowserWindow.../main.ts main.ts 在启动应用后就创建了一个主进程 main process，它可以通过 electron 中的一些模块直接与原生 GUI 交互。...窗口是通过 main 文件里的主进程调用叫 BrowserWindow 的模块创建的。 主进程与渲染进程之间的通信 在 electron 中，主进程与渲染进程有很多通信的方法。...子进程通常缓存查找数据，并且仅仅将数据截取和发送给主进程.这有利于在通过 IPC 发送查找数据之前减小查找时的运行开销，这样做很有价值.因此，发送查找数据，我们应当异步通知所有子进程来截取任何待查找的数据
模块BrowserWindow BrowserWindow模块是用于创建和管理图形用户界面的窗口。它提供了一种在桌面应用程序中创建原生窗口的方式，类似于浏览器中的窗口。...closed: 当窗口关闭时触发此事件。 close: 在关闭窗口之前触发此事件。可以在此事件的处理程序中执行清理操作或阻止窗口关闭。 show: 当窗口被显示时触发此事件。...但是，这样写代码会有一个问题：我们创建完窗口，就会立即显示出来，加载index.html 紧随其后，但是这中间会有个时间间隔，会出现一瞬间的白屏现象，我了解决这个问题，我们可以在创建窗口的时候，不让窗口显示...webContents 属性 当我们在 Electron 中创建一个窗口时，窗口中的网页内容由 WebContents 对象表示。...，它的角色和功能比较类似于我们在浏览器中的 BOM 对象，用于控制窗口中加载的网页内容和与之进行交互。
在设计窗体时，这两个属性特别有用，如果用户认为改变窗口的大小并不容易，应确保窗口看起来显示的不是那么乱，并编写很多代码来实现这个效果，许多程序解决这个问题都是禁止给窗口重新设置大小 这显然是解决问题的最简单的方法...，这个属性迫使控件将其自身定位在父窗体或父控件中某个相对或绝对位置，这个属性有四个可以开启或关闭的值 * Top–表示控件中与父窗体（父控件）相关的顶部应该保持固定...或移动其位置，确保总是位于屏幕的底部。...虽然Anchor属性也可以实现这一点，但是Dock属性使得能够在父窗体中让子窗体可以再上方（或旁边）互相堆叠，如果某个子窗体改变了大小，其它停驻在它旁边的子窗体也会随之改变。...和Anchor属性不同的是，可以将Dock属性设置为一个单值： *Top–迫使控件位于父窗体（或控件）的顶部，如果有同一个父窗体的其它子控件也被设置为停驻在顶部的话，那么控件将在彼此上方互相堆叠
领取专属 10元无门槛券
手把手带您无忧上云
云服务器
即时通信 IM
ICP备案
对象存储
实时音视频
