- 1、小猪外链里发表的文章仅代表作者本人的观点，与本网站立场无关。
2、小猪外链网资源分享仅为个人学习、交流之用，同时向原著作者表达敬意。
3、小猪外链网仅提供信息存储空间服务，小猪外链网信息均来源于用户自行发布，不承担任何法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，可以按照《小猪外链网文章侵权处理流程》进行处理，同时向原著作者表达敬意。
4、内容由网友自主上传，如有侵权、违规请联系邮箱616859395@qq.com进行处理。
拒绝伸手党，拿走请回复，尊重楼主，尊重你我他~
收藏文章
楼主
Electron是一种前端开发框架，在开发Electron应用时，我们往往希望用更好看的窗体代替系统原有的窗体，所以我们有很多的技术人员会选择用自定义窗口，下面南昌APP开发公司百恒科技小编来跟大家聊一下electron开发时如何实现自定义窗口。
实现思路
在electron的窗口中配置frame为false制作无边窗口
自己绘制toolbar
利用electron中的remote获取当前窗口的方法获取到当前窗口
将自己绘制的toolbar和窗口的方法进行对接
实现细节
仓库地址：https://github.com/wbjqiqi/electron-demos.git
在electron的窗口中配置frame为false
new BrowserWindow({ ... frame: false, ... });
自己绘制toolbar
蕞好放进公有组件里面，方便实现不同页面不同的toolbar
利用electron中的remote获取当前窗口的方法获取到当前窗口
获取当前窗口
import {remote} from 'electron'; remote.getCurrentWindow();
将自己绘制的toolbar和窗口的方法对接
放大/缩小/关闭/复原
const currentWindow = remote.getCurrentWindow(); currentWindow.maximize(); currentWindow.minimize(); currentWindow.close(); currentWindow.restore();
窗口的拖动与拉伸
通过样式解决
-webkit-app-region: drag;
注意：拖动的区域要预留一条边隙，否则无法拉伸与缩小，大约4px
以上是南昌APP开发公司百恒科技小编要跟大家聊到的关于electron开发时如何实现自定义窗口的内容，希望能够对大家有所帮助，想要了解更多关于这方面的内容，欢迎留言咨询百恒科技，百恒科技专注于南昌APP开发、南昌网站建设开发等互联网服务16年。
相关文章推荐 ： 常用的正则表达式代码
全站外链： TEC传感器 | 猫掌外链
免 责 声 明
网站建设、网站推广、APP开发、小程序开发
推荐文章
网站公告
近期本站被人为恶意注册及发布垃圾帖，每一个发帖都会经过审核，一经发现违法或垃圾帖的用户，帖子将被删除或封号，请大家共同维护互联网环境，共创美好互联网未来。
详细的发帖规则请阅读：
《小猪外链网发帖规则》
《小猪外链网最新金币规则》
注:本站严禁发布灰色违禁违法内容,如发现立刻永久封号,如开通会员的概不退款。
