当前位置: article > 正文

Electron 应用开发实践指南实战篇：需求概述

作者：IT小白 | 2024-08-06 06:02:35

踩

electron 应用开发实践指南

Electron 应用开发实践指南 - muwoo - 掘金小册

窗口是 Electron 应用程序的首要表现形式和展示形式，无边框窗口是指没有明显边框、标题栏或外框的窗口。它们通常具有以下特点：

这种设计风格通常出现在现代化的用户界面和应用程序中，以提供更清晰、更简洁的外观，并且在某些情况下可能有助于提升用户体验。

Rubick 有两类无边框窗口，一种是主程序的默认搜索窗口：

另外一种是有自定义控件栏（最大化、最小化、关闭），嵌入式的 windows 窗口：

这两类窗口的实现中，都有各自的问题，默认情况下，无边框窗口是不可拖拽的。而若你有自定义标题栏，或者嵌入式的windows 窗口控件需求时，又需要自行实现控件栏。后面的《实战篇：定义窗口的拖拽和缩放》
章节我们将会详细介绍。

作为一款提升效率的工具，其最重要的功能之一是快速检索当前系统中安装的应用，并立即启动这些应用。市面上确实有很多 App 能够满足这一需求，例如：

Raycast：

Alfred：

uTools：

但是，这些软件要么不支持多平台，要么是商业化产品需要付费。所以，如果你希望了解如何自行打造一个支持应用检索和快速启动的跨平台桌面应用程序，建议你继续阅读后面的《实战篇：实现应用快速检索》
章节。

作为一个桌面端效率工具箱而言，为了适配各种场景和工作的需要，不得不实现非常多的功能来满足使用需求。比如我们需要一个 远程调试&网络抓包 的工具，然后我们基于此开发了一款桌面端工具：

这也是 Rubick 最早的雏形。随后，我们发现当页面发布线上的时候，没有办法在微信环境内对线上页面进行调试，所以开发了一个基于 winner 的远程调试功能。

但随着该 Rubick 在内部不断推广和使用，所需功能也越来越多。我们需要需求管理、性能评估、埋点检测等工具。这些工具的增加一方面导致 Rubick 体积暴增，一方面又导致了用户需要不断更新软件，导致用户体验非常差。

其次，我们在推广给测试、UI 同学使用的时候，发现他们其实并不关注前面的页面调试、性能测评等功能，可能只是用到其中某一项，所以整个项目对他们来说就显得很臃肿。

因此，插件化体系设计是解决这些问题的最优解，让每个需求功能都独立成一个个插件，只需要安装需要的插件，插件可以单独迭代和发布。

如果你对插件化体系的实现原理和常用的插件开发比较感兴趣，可以阅读我们后续的《实战篇：如何支持工具插件化》
篇进行详细阅读。

相信很多小伙伴听说过或体验过一些划词翻译的桌面端应用，这个功能在辅助阅读外文文档遇到生疏的语句或单词的时候，非常有用。

另外，如果你有用过 picgo
这样的软件，那你可能体验过右击菜单增强的特性：当鼠标选中图片，右击触发系统菜单的时候，会弹出系统右击菜单，并可以通过菜单面板选项进行直接上传。关于如何将你的应用选项注入到系统右击菜单项目中，我们会在《实战：Electron 应用注入到系统右键菜单》
章节详细介绍。

但是系统菜单内容毕竟太多、太杂了，而且我们无法自定义一些常用的功能。所以，我们要实现的超级面板就是一个支持快速唤起、划词翻译、文件自动匹配插件的系统菜单增强的超级“菜单”：

在《实战篇：实现超级面板》的章节中，我们将会一起从零实现一个属于自己的“超级菜单”来提升自己的工作效率。

桌面端 App 在运行期间会产生大量的数据，这些数据大多是存储在本地环境的，所以我们需要设计与实现一套客户端环境下的本地数据库的存储策略。

另外，如果你有多个电脑设备，你可能会经常碰到设备之前数据传输的问题。其实这个场景我们经常碰到，比如微信、钉钉、QQ 这些聊天类软件，它们自带了多端数据同步的能力：当我们在手机上进行聊天时产生了大量数据，在当我们登录电脑设备时，这些数据又可以被同步到电脑终端上。

而我们的应用场景也很类似，我们的 Rubick 工具箱装载了大量的插件，如果我们工作的电脑 A 使用了这些插件并产生了一些数据，当我们再切到电脑 B 上使用插件的时候，我们是希望这些数据是能够同步的。因此，我们需要设计一套多端数据同步的能力：《实战篇：本地数据库和多端数据同步》
。

作为一款桌面端软件，我们也会实现一些通用和基础的功能。比如:

截图

屏幕取色

声明：本文内容由网友自发贡献，不代表【wpsshop博客】立场，版权归原作者所有，本站不承担相应法律责任。如您发现有侵权的内容，请联系我们。转载请注明出处：https://www.wpsshop.cn/w/IT小白/article/detail/936086