electron 桌面程序 项目（Electron实现桌面日历）

electron 桌面程序 项目（Electron实现桌面日历）main.js修改：三、实现Electron功能参考前面文章《Electron桌面应用程序从创建项目、启动项目到打包程序的详细过程》；二、实现日历内容可自己实现日历功能或者网上搜索示例，然后嵌套进Electron里面；如果需要本例效果，可到链接“https://pan.baidu.com/s/1HFfTyo8YvlhqOxgDXk_VEQ”下载（提取码“m4it”）；

示例简介

本文介绍使用Electron来实现桌面日历示例，该桌面日历可切换年份和月份的数据，可显示假期的数据等不同功能；

开发环境：node12.14.1 electron10.1.5

示例效果：

实现过程

一、新建项目

参考前面文章《Electron桌面应用程序从创建项目、启动项目到打包程序的详细过程》；

二、实现日历内容

可自己实现日历功能或者网上搜索示例，然后嵌套进Electron里面；如果需要本例效果，可到链接“https://pan.baidu.com/s/1HFfTyo8YvlhqOxgDXk_VEQ”下载（提取码“m4it”）；

三、实现Electron功能

main.js修改：

1、设置外框：

Menu.setApplicationMenu(null)隐藏菜单栏；

frame: false设置无边框；

mainWindow.setAlwaysOnTop(true 'screen-saver' 2)边框置顶；

2、窗口定位：

x: width y: 50：width等于屏幕宽度减去窗口的宽度，所以最终效果定位于屏幕的右上角；

3、设置透明效果：

transparent: true，devTools: false：一般设置这两个即可，但如果嵌套的网页有背景色，也需要去掉才能有效果；

index.html修改：

由于隐藏了菜单和无边框，导致没办法直接关闭，所以在页面上增加右键菜单，并包括“关闭窗口”功能，代码如下：

总结

该实例到此就已经介绍完毕，大家可在此基础上增加更多优化的功能。