利用空余时间自己学习electron,再加上决定对vue多加深入学习,使用了electron-vue脚手架弄些小东西练习。
技术栈
electron,vue,vuex,vue-route,element-ui。
工具说明
原本目的是做一个备忘录,故起名为never-gorget。
目前实现情况,
- 实现了简单的记录功能。
- 实现了类似于眼保的功能。
- 缩小到托盘的功能,这个应该不算功能吧。。。
还有其他很多方面待完善,
功能简单介绍
备忘录
界面如下,
简单的三列布局,最左侧是任务的新增,中间是未完成的任务,最右侧是已经完成的任务。
眼保
其实就是个简单的计时器,当时间到了,弹出新的遮挡框(可以用esc键退出)。
计时器是使用web worker计算的,不过,这儿如果使用node的子线程去倒计时的话,又会有什么样的区别呢?
设置
设置的话,只有一个简单的最小化到托盘的功能。用到了electron中的Tray功能:
const Menu = electron.Menu;
const Tray = electron.Tray;
//系统托盘右键菜单
let trayMenuTemplate = [{//系统托盘图标目录
label: '退出',
click: function () {
app.quit();
}];
// 当前目录下的app.ico图标
let iconPath = path.join(__dirname, 'app.png');
appTray = new Tray(iconPath);
//图标的上下文菜单
const contextMenu = Menu.buildFromTemplate(trayMenuTemplate);
待更新
原本以为这些小工具没啥好弄的,也是有或多可玩的,而且弄完美的话,对我来说还是得花点时间。
现有的调整,
- 将inndexeddb替代原有的localstorage,因为浏览器对后者有大小的限制。
- 前一天未完成的任务可以自动转变为后一天需要完成的任务。
- 增加一些报表来显示对应的统计。
- 眼保可以修改黑屏时间。
- 等等。
新加的功能,
- 增加图灵机器人,可以简单的查询一些东西。
- app检测升级功能。
- 崩溃日志收集等等。
- 安装时选路径,进度等功能。
项目地址:https://github.com/2fps/never...
个人博客地址:https://www.zhuyuntao.cn/
欢迎指点,谢谢!
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用
。你还可以使用@
来通知其他用户。