CN115454430A - 图标库自动交付方法及其装置、设备、介质、产品 - Google Patents

Abstract

本申请涉及一种图标库自动交付方法及其装置、设备、介质、产品，所述方法包括：由设计客户端根据其中运行的界面编辑进程所触发的界面项目相对应的界面发布事件，生成图标交付通知；由服务器根据所述图标交付通知启动分支合并流程，在该流程中更新所述界面项目的版本号，将该版本号对应的版本更新分支接入所述界面项目的开发主干；触发开发客户端生成所述设计客户端为所述界面项目发布的新增图标的组件代码，根据所述组件代码生成开发环境的可引用图标，将所述可引用图标发布到图标仓库。本申请合并了图标设计到图标发布的整个业务流程，且与软件工程项目的开发主干衔接，全程可自动化实施，能明显提升软件工程的实施效率。

Description

图标库自动交付方法及其装置、设备、介质、产品

技术领域

本申请涉及软件工程技术，尤其涉及一种图标库自动交付方法及其装置、设备、介质、产品。

背景技术

软件界面的界面设计工具的设计稿中存在组件的概念，界面设计师在使用界面设计工具设计图形用户界面(UI，User Interface)的时候，会引用以前使用过的组件。传统设置中，不同需求的设计稿，设计师都会引用同一个图标库，所以图标库是通用的。

软件工程的前端开发人员在开发web项目时，需要按照设计稿中的UI进行设计，开发成符合web标准的网页。当设计稿中存在图标时，需要适应web页面对原图标进行格式转换，才能在项目中引入使用，这个对开发人员存在一定的时间成本。

一个软件工程项目会有多个开发人员参与，当不同开发人员碰到同一个图标的时候，因为不知道这个图标是否已经被导入到当前的界面项目中，所以常会有重复导入的情况；例如A开发人员导入了一个点赞的图标，命名为like，而B开发人员也碰到这个点赞的图标，不知道已存在的这个like图标就是点赞的图标，所以B又再引入了一次，命名为good；以此类推，前端项目中的图标会越来越多和难维护。

由此可见，软件开发工程中，设计端和开发端关于图标信息的同步技术存在天然障碍，会导致流程复杂、时间成本高、版本协同困难以及造成数据冗余等诸多问题。

发明内容

本申请的目的在于解决上述问题而提供一种图标库自动交付方法及其相应的装置、设备、非易失性可读存储介质，以及计算机程序产品。

根据本申请的一个方面，提供一种图标库自动交付方法，包括如下步骤：

由设计客户端根据其中运行的界面编辑进程所触发的界面项目相对应的界面发布事件，生成图标交付通知；

由服务器根据所述图标交付通知启动分支合并流程，在该流程中更新所述界面项目的版本号，将该版本号对应的版本更新分支接入所述界面项目的开发主干；

触发开发客户端生成所述设计客户端为所述界面项目发布的新增图标的组件代码，根据所述组件代码生成开发环境的可引用图标，将所述可引用图标发布到图标仓库。

可选的，由设计客户端根据其中运行的界面编辑进程所触发的界面项目相对应的界面发布事件，生成图标交付通知，包括：

在设计客户端中，随所述界面编辑进程的启动而加载发布监听模块；

由所述发布监听模块监听所述界面编辑进程所触发的界面发布事件，响应于所述界面发布事件，确定其相对应的界面项目的版本变更描述信息，向对应所述服务器的预设网络地址发送图标交付通知，该图标交付通知包含所述界面项目的特征信息和版本变更描述信息。

可选的，由服务器根据所述图标交付通知启动分支合并流程，在该流程中更新所述界面项目的版本号，将该版本号对应的版本更新分支接入所述界面项目的开发主干，包括：

所述服务器响应于所述图标交付通知，获取其相对应的界面项目的图标库描述文件的历史最新版本号；

所述服务器根据历史最新版本号确定当次版本号，创建当次版本号相对应的版本更新分支，生成相应的开发通知消息；

所述服务器响应于对应所述开发通知消息而提交的流程合并指令，将所述版本更新分支接入所述界面项目的开发主干。

可选的，触发开发客户端生成所述设计客户端为所述界面项目发布的新增图标的组件代码，根据所述组件代码生成开发环境的可引用图标，将所述可引用图标发布到图标仓库，包括：

由所述开发客户端获取所述设计客户端为所述界面项目发布的新增图标；

将所述新增图标转换为矢量格式文件，每个矢量格式文件以组件代码的形式描述相应的一个新增图标的矢量绘制信息；

根据所述矢量格式文件中的组件代码生成所述开发客户端中的开发环境的可引用图标；

将所述可引用图标存储于所述界面项目相对应的图标仓库，将该图标仓库与更新后的所述版本号相关联。

可选的，将所述新增图标转换为矢量格式文件之后，包括：

将矢量格式文件内组件代码中的颜色填充属性修改为允许多色填充。

可选的,所述界面编辑进程为界面设计软件运行所得的进程，所述开发环境为特定开发语言的开发工具软件运行后所提供的开发环境，所述界面编辑进程中的新增图标以第一图像格式封装，根据所述组件代码所生产的可引用图标以第二图像格式封装。

根据本申请的另一方面，提供一种图标库自动交付装置，包括：

设计发布模块，设置为由设计客户端根据其中运行的界面编辑进程所触发的界面项目相对应的界面发布事件，生成图标交付通知；

流程处理模块，设置为由服务器根据所述图标交付通知启动分支合并流程，在该流程中更新所述界面项目的版本号，将该版本号对应的版本更新分支接入所述界面项目的开发主干；

开发更新模块，设置为触发开发客户端生成所述设计客户端为所述界面项目发布的新增图标的组件代码，根据所述组件代码生成开发环境的可引用图标，将所述可引用图标发布到图标仓库。

可选的，所述设计发布模块，包括：监听启动单元，设置为在设计客户端中，随所述界面编辑进程的启动而加载发布监听模块；监听执行单元，设置为由所述发布监听模块监听所述界面编辑进程所触发的界面发布事件，响应于所述界面发布事件，确定其相对应的界面项目的版本变更描述信息，向对应所述服务器的预设网络地址发送图标交付通知，该图标交付通知包含所述界面项目的特征信息和版本变更描述信息。

可选的，所述流程处理模，包括：版本获取单元，设置为所述服务器响应于所述图标交付通知，获取其相对应的界面项目的图标库描述文件的历史最新版本号；分支创建单元，设置为所述服务器根据历史最新版本号确定当次版本号，创建当次版本号相对应的版本更新分支，生成相应的开发通知消息；流程接入单元，设置为所述服务器响应于对应所述开发通知消息而提交的流程合并指令，将所述版本更新分支接入所述界面项目的开发主干。

可选的，所述开发更新模，包括：图标获取单元，设置为由所述开发客户端获取所述设计客户端为所述界面项目发布的新增图标；格式转换单元，设置为将所述新增图标转换为矢量格式文件，每个矢量格式文件以组件代码的形式描述相应的一个新增图标的矢量绘制信息；图标生成单元，设置为根据所述矢量格式文件中的组件代码生成所述开发客户端中的开发环境的可引用图标；图标发布单元，设置为将所述可引用图标存储于所述界面项目相对应的图标仓库，将该图标仓库与更新后的所述版本号相关联。

可选的，后于所述图标转换单元，包括：属性配置单元，设置为将矢量格式文件内组件代码中的颜色填充属性修改为允许多色填充。

可选的,所述界面编辑进程为界面设计软件运行所得的进程，所述开发环境为特定开发语言的开发工具软件运行后所提供的开发环境，所述界面编辑进程中的新增图标以第一图像格式封装，根据所述组件代码所生产的可引用图标以第二图像格式封装。

根据本申请的另一方面，提供一种图标库自动交付设备，包括中央处理器和存储器，所述中央处理器用于调用运行存储于所述存储器中的计算机程序以执行本申请所述的图标库自动交付方法的步骤。

根据本申请的另一方面，提供一种非易失性可读存储介质，其以计算机可读指令的形式存储有依据所述的图标库自动交付方法所实现的计算机程序，所述计算机程序被计算机调用运行时，执行该方法所包括的步骤。

根据本申请的另一方面，提供一种计算机程序产品，包括计算机程序/指令，所述计算机程序/指令被处理器执行时实现本申请任意一种实施例中所述方法的步骤。

相对于现有技术，本申请合并了图标设计到图标发布的整个业务流程，且与软件工程项目的开发主干衔接，全程可自动化实施，确保更新后的图标可以在分布式开发环境中进行有效协同，避免造成图标数据冗余、版本重复、处理耗时复杂等问题的出现，能明显提升软件工程的实施效率。

附图说明

为了更清楚地说明本申请实施例中的技术方案，下面将对实施例描述中所需要使用的附图作简单地介绍，显而易见地，下面描述中的附图仅仅是本申请的一些实施例，对于本领域普通技术人员来讲，在不付出创造性劳动的前提下，还可以根据这些附图获得其他的附图。

图1为本申请的示例性运行环境相对应的网络架构示意图；

图2为本申请的图标库自动交付方法的一种实施例的流程示意图；

图3为本申请实施例中服务器响应图标交付通知而执行流程合并过程的流程示意图；

图4为本申请实施例中开发客户端实施图标转换过程的流程示意图；

图5为本申请的图标库自动交付装置的原理框图；

图6为本申请所采用的一种图标库自动交付设备的结构示意图。

具体实施方式

下面详细描述本申请的实施例，所述实施例的示例在附图中示出，其中自始至终相同或类似的标号表示相同或类似的元件或具有相同或类似功能的元件。下面通过参考附图描述的实施例是示例性的，仅用于解释本申请，而不能解释为对本申请的限制。

本技术领域技术人员可以理解，除非特意声明，这里使用的单数形式“一”、“一个”、“所述”和“该”也可包括复数形式。应该进一步理解的是，本申请的说明书中使用的措辞“包括”是指存在所述特征、整数、步骤、操作、元件和/或组件，但是并不排除存在或添加一个或多个其他特征、整数、步骤、操作、元件、组件和/或它们的组。应该理解，当我们称元件被“连接”或“耦接”到另一元件时，它可以直接连接或耦接到其他元件，或者也可以存在中间元件。此外，这里使用的“连接”或“耦接”可以包括无线连接或无线耦接。这里使用的措辞“和/或”包括一个或更多个相关联的列出项的全部或任一单元和全部组合。

本技术领域技术人员可以理解，除非另外定义，这里使用的所有术语(包括技术术语和科学术语)，具有与本申请所属领域中的普通技术人员的一般理解相同的意义。还应该理解的是，诸如通用字典中定义的那些术语，应该被理解为具有与现有技术的上下文中的意义一致的意义，并且除非像这里一样被特定定义，否则不会用理想化或过于正式的含义来解释。

本技术领域技术人员可以理解，这里所使用的“客户端”、“终端”、“终端设备”既包括无线信号接收器的设备，其仅具备无发射能力的无线信号接收器的设备，又包括接收和发射硬件的设备，其具有能够在双向通信链路上，进行双向通信的接收和发射硬件的设备。这种设备可以包括：蜂窝或其他诸如个人计算机、平板电脑之类的通信设备，其具有单线路显示器或多线路显示器或没有多线路显示器的蜂窝或其他通信设备；PCS(PersonalCommunications Service，个人通信系统)，其可以组合语音、数据处理、传真和/或数据通信能力；PDA(Personal Digital Assistant，个人数字助理)，其可以包括射频接收器、寻呼机、互联网/内联网访问、网络浏览器、记事本、日历和/或GPS(Global PositioningSystem，全球定位系统)接收器；常规膝上型和/或掌上型计算机或其他设备，其具有和/或包括射频接收器的常规膝上型和/或掌上型计算机或其他设备。这里所使用的“客户端”、“终端”、“终端设备”可以是便携式、可运输、安装在交通工具(航空、海运和/或陆地)中的，或者适合于和/或配置为在本地运行，和/或以分布形式，运行在地球和/或空间的任何其他位置运行。这里所使用的“客户端”、“终端”、“终端设备”还可以是通信终端、上网终端、音乐/视频播放终端，例如可以是PDA、MID(Mobile Internet Device，移动互联网设备)和/或具有音乐/视频播放功能的移动电话，也可以是智能电视、机顶盒等设备。

本申请所称的“服务器”、“客户端”、“服务节点”等名称所指向的硬件，本质上是具备个人计算机等效能力的电子设备，为具有中央处理器(包括运算器和控制器)、存储器、输入设备以及输出设备等冯诺依曼原理所揭示的必要构件的硬件装置，计算机程序存储于其存储器中，中央处理器将存储在外存中的程序调入内存中运行，执行程序中的指令，与输入输出设备交互，借此完成特定的功能。

需要指出的是，本申请所称的“服务器”这一概念，同理也可扩展到适用于服务器机群的情况。依据本领域技术人员所理解的网络部署原理，所述各服务器应是逻辑上的划分，在物理空间上，这些服务器既可以是互相独立但可通过接口调用的，也可以是集成到一台物理计算机或一套计算机机群的。本领域技术人员应当理解这一变通，而不应以此约束本申请的网络部署方式的实施方式。

本申请所涉及的各种数据，除非明文指定，既可远程存储于服务器，也可存储于本地终端设备，只要其适于被本申请的技术方案所调用即可。

本领域技术人员对此应当知晓：本申请的各种方法，虽然基于相同的概念而进行描述而使其彼此间呈现共通性，但是，除非特别说明，否则这些方法都是可以独立执行的。同理，对于本申请所揭示的各个实施例而言，均基于同一发明构思而提出，因此，对于相同表述的概念，以及尽管概念表述不同但仅是为了方便而适当变换的概念，应被等同理解。

本申请即将揭示的各个实施例，除非明文指出彼此之间的相互排斥关系，否则，各个实施例所涉的相关技术特征可以交叉结合而灵活构造出新的实施例，只要这种结合不背离本申请的创造精神且可满足现有技术中的需求或解决现有技术中的某方面的不足即可。对此变通，本领域技术人员应当知晓。

请参阅图1，图1是本申请的图标库自动交付方法的示例性运行环境相对应的网络架构，其中包括设计客户端81、开发客户端82以及服务器80。所述设计客户端81用于安装运行界面编辑进程，例如Photoshop、Figma、AI等设计工具软件；所述开发客户端82用于安装和运行网页脚本代码(如JavaScript之类)相对应的开发工具软件以便提供相应的开发环境；所述服务器80可于实施界面项目相对应的软件工程的集中管理，可以是诸如GitLab之类的项目仓库托管服务平台。

本申请的图标库自动交付方法的各个实施例可以在图1所示的网络架构中通过各个客户端和服务器的配合实现，在一些特殊的实施例中，可以采用同一计算机设备来同时构建为所述的服务器和各个客户端，由此使得本申请的图标库自动交付方法可以在同一台设备中实现。

请参阅图2，根据本申请提供的一种图标库自动交付方法，在其一个实施例中，包括如下步骤：

步骤S1100、由设计客户端根据其中运行的界面编辑进程所触发的界面项目相对应的界面发布事件，生成图标交付通知；

以所述设计客户端安装Figma软件运行后构建出的界面编辑进程为例，可以对该界面编辑进程中的界面发布事件实施监听。一个实施例中，为了实现对Figma软件中的界面发布事件的监听，可以预先实现一个功能插件，将该功能插件发布到Figma对应的插件市场中供设计用户下载安装，该功能插件被安装后，便随Figma的界面编辑进程的启动而加载到设计客户端中运行，从而开始对Figma中界面项目编辑界面中的发布控件的操作行为实施监听，在设计用户触发所述发布控件时，便生成相应的界面发布事件，便可由该功能插件进行响应。

所述功能插件响应于所述界面编辑进程的界面发布事件，便生成相应的图标交付通知，在该图标交付通知中可以包含所述界面项目相对应的特征信息，以便确定相应的界面项目，还可以包含设计用户预先设定的版本变更描述信息，以便在后续业务流程中为相关用户提供说明信息，因而，所述版本变更描述信息中可以包含被更新的图标的指定信息。所述功能插件生成所述的图标交付通知之后，将其发布至负责实施界面项目开发流程管理的所述服务器。

设计用户在所述界面编辑进程中完成的设计数据，例如其所设计的一个界面中的新增图标，可以集中存储在云端数据库中，在触发所述界面发布事件之后，将其同步到所述云端数据库，以便其他设计用户或者开发用户可以进行对应调用。

一个实施例中，在所生成的所述图标交付通知中，还可以包含当前完成设计的界面的资源描述信息，包括设计文稿、图标信息等，以便服务器按需向其他业务环节传参，例如向本申请的开发客户端传递图标信息以供确定出其中的新增图标及其相对应的资源信息，以提升整体协作效率。

一个实施例中，所述功能插件允许设计用户自行配置所述服务器的网络地址，以便将所生成的图标交付通知发送到所述网络地址，以送达所述服务器。

步骤S1200、由服务器根据所述图标交付通知启动分支合并流程，在该流程中更新所述界面项目的版本号，将该版本号对应的版本更新分支接入所述界面项目的开发主干；

所述服务器负责实施所述界面项目的软件工程管理，其借助分布式版本控制系统(GIT)来实施软件工程管理，对应所述界面项目，以流水线的形象概念描述不同开发业务流程，通常包含开发主干(Master)和多个开发分支，GIT负责对各个分支和主干的分合关系进行维护，以便生成各种版本相对应的软件产品。

设计客户端中的设计用户为界面项目完成的设计，可以视为其中的一个开发分支，可称为版本更新分支。因而，当设计用户完成设计，在设计客户端触发界面发布事件并产生图标交付通知送达所述服务器后，所述服务器便可启动分支合并流程，其目的在于将设计客户端的作业成果合并到界面项目相对应的开发主干中。

一个实施例中，所述服务器根据所述图标交付通知直接或间接启动相应的分支合并流程，首先，获取所述界面项目相对应的图标仓库的历史最新版本号；然后创建版本更新分支的实例；进而，修改版本更新分支对应的描述文件，将其中的版本号按照预设更新规则进行修改，例如自动累加1，获得当次版本号，设置为该描述文件中的版本号；继而，将该版本更新分支提交合并到开发主干中，实现将版本更新分支并入开发主干，完成分支合并流程。

服务器完全分支合并后，可以确保界面项目的图标仓库的版本信息的统一更新，使不同设计客户端和开发客户端可以据此保持不同版本的图标仓库的协同使用，不易造成数据重复和冗余。

一个实施例中，本步骤可以构造为安装于所述服务器的一个插件，实现对其中的软件工程管理服务的功能扩展。

步骤S1300、触发开发客户端生成所述设计客户端为所述界面项目发布的新增图标的组件代码，根据所述组件代码生成开发环境的可引用图标，将所述可引用图标发布到图标仓库。

当服务器完成分支合并流程的执行后，可以触发一个或多个开发客户端实施图标仓库的更新。所述图标仓库可以是在所述开发客户端预先创建的本地目录，用于存储可引用图标，所述可引用图标可以是将所述设计客户端中的界面编辑进程所生成的原始图标转换而得的。

所述开发客户端通常用于安装运行网页开发环境，以便通过该开发环境编写相应的页面代码例如JavaScript的脚本代码，因此，开发客户端适应编写页面代码的需要，可以通过安装运行一个图标生成模块来同步到设计用户发布的最新版本的图标，其中包括所述设计客户端发布的新增图标。一个实施例中，所述图标生成模块可以实现为独立的应用程序，也可以实现为用于构造所述开发环境的开发语言工具软件的插件。

所述图标生成模块受服务器触发而开始更新图标仓库，为此，一个实施例中，根据预先获得的云端数据库(也可以是其他指定位置例如所述设计客户端的数据库)的地址，即用于存储所述界面项目相对应的网络地址，开始下载所述设计客户端已经发布的图标，其中包括新增图标。所述新增图标可以是设计客户端新建的图标，也可以是设计客户端在历史图标的基础上编辑修改而生成的图标。另一实施例中，可以由所述服务器根据所述图标交付通知中的资源描述信息，向开发客户端传参，使开发客户端只针对资源描述信息中记载的发生更新(包括新增或修改)的图标进行下载，以便针对这些图标更新图标仓库。

从云端数据库获得的所述新增图标，通常以界面编辑进程所兼容的第一格式进行封装，开发客户端中的开发环境可能兼容以第二格式封装的图标，因而，图标生成模块可以负责将所述新增图标从第一格式转换为第二格式。

一种实施例中，第二格式可以是可缩放矢量图片格式(SVG，Scalable VectorGraphics)，该格式的图标本质上是矢量图片，通过标记语言描述几何形状，在标记语言被解析时生成相应的矢量图标，具有占用空间低且缩放不失真等优点，适于网页脚本代码中引用。不难理解，所述标记语言实际上构成了描述可缩放矢量图片的组件代码。

图标生成模块将每个新增图标均对应地转换为其相应的组件代码，并且将每个新增图标相对应的组件代码转换为所述开始环境可以引用的组件例如React组件，相应的，也根据所述组件代码生成适于本地存储的可引用图标，以便开发用户可以通过查看可引用图标而实现对其调用，而开发人员需要引用相应的可引用图标时，在相应的网页的脚本代码中使用其对应的React组件即可实现可引用图标在网页中的引用。

图标生成模块为每个新增图标生成的各个可引用图标，可以存储到开发客户端中预设的专用于存储图标仓库的目录中，从而实现对图标仓库的更新。一个实施例中，所述图标仓库也可以是一个云端部署的存储位置，由此，单个开发客户端实施格式转换后，后续其他开发客户端均可统一使用该图标仓库中的可引用图标。

一个实施例中，当图标仓库更新后，可以关联更新其对应的版本号为最新的版本号，由此，开发用户可以通过指定图标仓库的版本号，来更新其所引用的图标资源。

另一实施例中，可以将所述新增图标的组件代码、React组件以及可引用图标进行关联存储，建立一一对应映射关系，以方便高效存取。

根据以上实施例可知，本申请合并了图标设计到图标发布的整个业务流程，且与软件工程项目的开发主干衔接，全程可自动化实施，确保更新后的图标可以在分布式开发环境中进行有效协同，避免造成图标数据冗余、版本重复、处理耗时复杂等问题的出现，能明显提升软件工程的实施效率。

在本申请任意实施例的基础上，由设计客户端根据其中运行的界面编辑进程所触发的界面项目相对应的界面发布事件，生成图标交付通知，包括：

步骤S1110、在设计客户端中，随所述界面编辑进程的启动而加载发布监听模块；

如前所述，将负责对界面编辑进程的界面发布事件实施监听的功能实现为一个功能插件，将该功能插件预先安装到界面编辑进程相对应的界面设计工具软件中，当该软件运行时，便启动所述的界面编辑进程，由该进程加载所述功能插件，由该功能插件构造出相应的发布监听模块，由该发布监听模块实施监听过程。

步骤S1120、由所述发布监听模块监听所述界面编辑进程所触发的界面发布事件，响应于所述界面发布事件，确定其相对应的界面项目的版本变更描述信息，向对应所述服务器的预设网络地址发送图标交付通知，该图标交付通知包含所述界面项目的特征信息和版本变更描述信息。

所述发布监听模块实施监听的过程中，当设计用户完成一个界面项目的设计之后，可以通过触控界面编辑进程的图形用户界面中的发布控件来发布相应的设计文稿，由此，便会触发相应的界面发布事件，被所述发布监听模块所接收并响应。

本实施例中，所述发布监听模块响应于所述界面发布事件，为其构造相应的图标交付通知。所述图标交付通知中，包含所述界面项目的特征信息，例如其项目ID或项目名称等，以方便服务器唯一性确定该界面项目；还可以包括版本变更描述信息，所述版本变更描述信息中可以是由发布监听模块请求设计用户提供的，也可以是根据该界面项目在发布前后的变动信息生成的，其中可以包含界面项目所引用的图标的资源描述信息，所述资源描述信息中可以包含新增图标的文件名称，以方便后续各个业务环节快速确定相应的新增图标。

根据本实施例不难理解，通过发布监听模块可以快速地获知设计客户端的作业成果，然后通过图标交付通知快速发送到服务器，以便驱动图标同步业务流程，免除人工介入，提升图标数据同步的效率。

在本申请任意实施例的基础上，请参阅图3，由服务器根据所述图标交付通知启动分支合并流程，在该流程中更新所述界面项目的版本号，将该版本号对应的版本更新分支接入所述界面项目的开发主干，包括：

步骤S1210、所述服务器响应于所述图标交付通知，获取其相对应的界面项目的图标库描述文件的历史最新版本号；

所述服务器在接收到所述图标交付通知后，可以即行响应，据此，可先根据所述图标交付通知中指定的界面项目，获取该界面项目相对应的图标库描述文件的版本号，该版本号表示图标库描述文件的历史最新版本号，即最后一次设置的版本号，通常记载在所述图标库描述文件中。

步骤S1220、所述服务器根据历史最新版本号确定当次版本号，创建当次版本号相对应的版本更新分支，生成相应的开发通知消息；

所述服务器对应所述界面项目预设为版本号更新规则，例如每次版本迭代为版本号加1，据此，服务器便可在历史最新版本号的基础上通过累加而确定当次版本号，然后创建当次版本号在GIT中相对应的版本更新分支，本质上是创建一条流水线，也即开发分支。为完善审核程序，可以对应该版本更新分支生成相应的开发通知消息，通过邮件、即时通信软件等发送给开发用户，以便待开发用户确认后实施流程合并。

步骤S1230、所述服务器响应于对应所述开发通知消息而提交的流程合并指令，将所述版本更新分支接入所述界面项目的开发主干。

开发用户接收到所述的开发通知消息后，可以实施审核，当其确认相应的版本更新分支应被允许之后，向服务器提交相应的流程合并指令，服务器响应于该流程合并指令，便通过GIT固有的业务逻辑，将所述版本更新分支接入所述界面项目的开发主干，从而完成流程合并。

根据以上实施例可知，本实施例进一步实现图标更新业务流程与GIT软件工程管理服务的高效衔接，通过该服务确保图标版本的同步协调，确保图标的更新有条不紊，避免出现版本错乱造成图标数据冗余等不良现象。

在本申请任意实施例的基础上，请参阅图4，触发开发客户端生成所述设计客户端为所述界面项目发布的新增图标的组件代码，根据所述组件代码生成开发环境的可引用图标，将所述可引用图标发布到图标仓库，包括：

步骤S1310、由所述开发客户端获取所述设计客户端为所述界面项目发布的新增图标；

当所述开发客户端中的图标生成模块受所述服务器触发之后，便从界面项目相对应的云端数据库中下载该界面项目的新增图标。一个实施例中，由服务器向开发客户端发送所述图标交付通知中携带的资源描述信息，其中包含新增图标的指定信息，然后生成进一步的转换通知消息发送给所述开发客户端的图标生成模块，由该图标生成模块根据转换通知消息中携带的资源描述信息，向所述云端数据库下载该资源描述信息所指定的新增图标。

步骤S1320、将所述新增图标转换为矢量格式文件，每个矢量格式文件以组件代码的形式描述相应的一个新增图标的矢量绘制信息；

一种实施例中，发布到所述云端数据库的新增图标可以是所述界面编辑进程所默认的第一格式封装的图像文件，所述第一格式可以是PSD、Fig、Sketch、GIF之类后缀相对应的文件。

图标生成模块被实现为将所述第一格式封装的图像文件转换为第二格式封装的矢量格式文件，其矢量格式可以如前所述为SVG格式或其他方便由网页的脚本语言(例如JavaScript)引用的格式。SVG是一种图形文件格式，它的英文全称为Scalable VectorGraphics，意思为可缩放的矢量图形。它是基于XML(Extensible Markup Language)，由World Wide Web Consortium(W3C)联盟进行开发的。严格来说是一种开放标准的矢量图形语言，可让用户设计出激动人心的、高分辨率的Web图形页面。根据SVG格式的规范，用户可以直接用组件代码来描绘图像，可以用任何文字处理工具打开SVG图像，通过改变部分组件代码来使图像具有交互功能，并可以随时插入到HTML中通过浏览器来观看。

由此可知，每个新增图标均会被转换为一个对应的矢量格式文件，每个矢量格式文件均以组件代码的形式使用标记语言描述其相应的新增图标的矢量绘制信息，通过对所述标记语言实施解析，便可呈现相应的新增图标的图像。

步骤S1330、根据所述矢量格式文件中的组件代码生成所述开发客户端中的开发环境的可引用图标；

为了方便提供给开发用户查看和引用，可以在开发客户端中，根据每个矢量格式文件中的组件代码，解析生成相应的可引用图标，该可引用图标用于呈现相应的矢量格式文件被解析显示后的图像效果，后续，开发用户在开发环境中编写代码时，如需插入所述的新增图标，便可查看可引用图标，选定相应的可引用图标，以代码引用的形式将其对应的组件代码插入至脚本代码中。由此可见，可引用图标的生成，为开发用户提供了新增图标的可视化索引路径。

一个实施例中，还可以对应每个可引用图标将所述矢量格式文件转换为所述开发环境的可调用组件，例如JavaScript开发环境中的React组件，如此，后续通过React组件的名称实施对相应的组件代码的调用即可。

步骤S1340、将所述可引用图标存储于所述界面项目相对应的图标仓库，将该图标仓库与更新后的所述版本号相关联。

在开发客户端的本地存储空间中，一般会预先设定一个目录用于存储所述界面项目相对应的图标仓库，在该图标仓库中存储各个新增图标相对应的可引用图标，并且关联设置图标仓库相对应的当次版本号，确保其存储最新图标资源。因而，当图标生成模块生成各个新增图标相对应的可引用图标后，便可将其存储到本地的图标仓库中，实现图标仓库的更新。

一个实施例中，所述的图标仓库也可以是云端共享的一个存储路径相对应的图标仓库，由此，单个开发用户在其开发客户端执行图标转换操作并发布后，其他开发用户便可直接调用。

另一实施例中，可将所述图标仓库的目录名称设置为当次版本号，实现为图标仓库标注最新版本号，后续开发用户在编写脚本代码时，在代码中指定版本号，便可确保图标数据引用的正确性，避免出错。

再一实施例中，对于所述设计用户发布的新增图标的原始文件、所述新增图标相对应的组件代码所在的矢量格式文件，以及所述新增图标相对应的可引用图标的格式文件等，均可采用相同的文件名命名，以方便通过同一文件名对不同格式的文件实施调用。

根据以上实施例不难理解，本申请通过在开发客户端实施图标转换，将设计用户的设计文稿中的新增图标及时转换为适于嵌入网页的脚本代码的矢量格式文件，并据此生成相应的可引用图标，方便开发用户在网页的开发环境中直接查阅和引用，既免除了人工实施格式转换的繁琐，又能提升图标资源调用效率，还能通过版本号协调不同版本的图标的使用，有效图标更新导致引用错乱的问题，大幅提升软件工程开发效率。

在本申请任意实施例的基础上，将所述新增图标转换为矢量格式文件之后，包括：将矢量格式文件内组件代码中的颜色填充属性修改为允许多色填充。

由于所述矢量格式文件是以组件代码的形式描述的，因而，可以通过修改其中的个别属性来实现对不同新增图标的统一修改定义。本实施例中，示例而言，可以通过修改所述矢量格式文件内组件代码中的颜色填充属性，使其从一种属性值修改为另一属性值，来实现对所有新增图标的矢量格式文件的统一修改定义。

以SVG格式文件为例，可以修改其中的Path标签的Fill属性，该属性用于设置填充颜色的方案，将其设置为Fill＝“CurrentColor”，便可使其所生成的图标呈现为多色图标。

由此可见，将新增图标转换为矢量格式文件后，方便对其进行统一的修改，典型地可以统一修改其颜色填充类型，来使根据这些矢量格式文件生成的图标具有更丰富的配色方案。

在本申请任意实施例的基础上，所述界面编辑进程为界面设计软件运行所得的进程，所述开发环境为特定开发语言的开发工具软件运行后所提供的开发环境，所述界面编辑进程中的新增图标以第一图像格式封装，根据所述组件代码所生产的可引用图标以第二图像格式封装。

请参阅图5，根据本申请的一个方面提供的一种图标库自动交付装置，包括设计发布模块1100、流程处理模块1200，以及开发更新模块1300，其中：所述设计发布模块1100，设置为由设计客户端根据其中运行的界面编辑进程所触发的界面项目相对应的界面发布事件，生成图标交付通知；所述流程处理模块1200，设置为由服务器根据所述图标交付通知启动分支合并流程，在该流程中更新所述界面项目的版本号，将该版本号对应的版本更新分支接入所述界面项目的开发主干；所述开发更新模块1300，设置为触发开发客户端生成所述设计客户端为所述界面项目发布的新增图标的组件代码，根据所述组件代码生成开发环境的可引用图标，将所述可引用图标发布到图标仓库。

在本申请任意实施例的基础上，所述设计发布模块1100，包括：监听启动单元，设置为在设计客户端中，随所述界面编辑进程的启动而加载发布监听模块；监听执行单元，设置为由所述发布监听模块监听所述界面编辑进程所触发的界面发布事件，响应于所述界面发布事件，确定其相对应的界面项目的版本变更描述信息，向对应所述服务器的预设网络地址发送图标交付通知，该图标交付通知包含所述界面项目的特征信息和版本变更描述信息。

在本申请任意实施例的基础上，所述流程处理模块1200，包括：版本获取单元，设置为所述服务器响应于所述图标交付通知，获取其相对应的界面项目的图标库描述文件的历史最新版本号；分支创建单元，设置为所述服务器根据历史最新版本号确定当次版本号，创建当次版本号相对应的版本更新分支，生成相应的开发通知消息；流程接入单元，设置为所述服务器响应于对应所述开发通知消息而提交的流程合并指令，将所述版本更新分支接入所述界面项目的开发主干。

在本申请任意实施例的基础上，所述开发更新模块1300，包括：图标获取单元，设置为由所述开发客户端获取所述设计客户端为所述界面项目发布的新增图标；格式转换单元，设置为将所述新增图标转换为矢量格式文件，每个矢量格式文件以组件代码的形式描述相应的一个新增图标的矢量绘制信息；图标生成单元，设置为根据所述矢量格式文件中的组件代码生成所述开发客户端中的开发环境的可引用图标；图标发布单元，设置为将所述可引用图标存储于所述界面项目相对应的图标仓库，将该图标仓库与更新后的所述版本号相关联。

在本申请任意实施例的基础上，后于所述图标转换单元，包括：属性配置单元，设置为将矢量格式文件内组件代码中的颜色填充属性修改为允许多色填充。

在本申请任意实施例的基础上，所述界面编辑进程为界面设计软件运行所得的进程，所述开发环境为特定开发语言的开发工具软件运行后所提供的开发环境，所述界面编辑进程中的新增图标以第一图像格式封装，根据所述组件代码所生产的可引用图标以第二图像格式封装。

本申请的另一实施例还提供一种图标库自动交付设备。如图6所示，图标库自动交付设备的内部结构示意图。该图标库自动交付设备包括通过系统总线连接的处理器、计算机可读存储介质、存储器和网络接口。其中，该图标库自动交付设备的计算机可读的非易失性可读存储介质，存储有操作系统、数据库和计算机可读指令，数据库中可存储有信息序列，该计算机可读指令被处理器执行时，可使得处理器实现一种图标库自动交付方法。

该图标库自动交付设备的处理器用于提供计算和控制能力，支撑整个图标库自动交付设备的运行，因此在一个实施例中在同一台交付设置中可同时实现所述图标库自动交付方法中的设计客户端、开发客户端以及服务器。该图标库自动交付设备的存储器中可存储有计算机可读指令，该计算机可读指令被处理器执行时，可使得处理器执行本申请的图标库自动交付方法。该图标库自动交付设备的网络接口用于与终端连接通信。

本领域技术人员可以理解，图6中示出的结构，仅仅是与本申请方案相关的部分结构的框图，并不构成对本申请方案所应用于其上的图标库自动交付设备的限定，具体的图标库自动交付设备可以包括比图中所示更多或更少的部件，或者组合某些部件，或者具有不同的部件布置。

本实施方式中处理器用于执行图5中的各个模块的具体功能，存储器存储有执行上述模块或子模块所需的程序代码和各类数据。网络接口用于实现用户终端或服务器之间的数据传输。本实施方式中的非易失性可读存储介质中存储有本申请的图标库自动交付装置中执行所有模块所需的程序代码及数据，服务器能够调用服务器的程序代码及数据执行所有模块的功能。

本申请还提供一种存储有计算机可读指令的非易失性可读存储介质，计算机可读指令被一个或多个处理器执行时，使得一个或多个处理器执行本申请任一实施例的图标库自动交付方法的步骤。

本申请还提供一种计算机程序产品，包括计算机程序/指令，该计算机程序/指令被一个或多个处理器执行时实现本申请任一实施例所述方法的步骤。

本领域普通技术人员可以理解，实现本申请上述实施例方法中的全部或部分流程，是可以通过计算机程序来指令相关的硬件来完成，该计算机程序可存储于一非易失性可读存储介质中，该程序在执行时，可包括如上述各方法的实施例的流程。其中，前述的存储介质可为磁碟、光盘、只读存储记忆体(Read-Only Memory，ROM)等计算机可读存储介质，或随机存储记忆体(Random Access Memory，RAM)等。

综上所述，本申请合并了图标设计到图标发布的整个业务流程，且与软件工程项目的开发主干衔接，全程可自动化实施，能明显提升软件工程的实施效率。

Claims (10)

1.一种图标库自动交付方法，其特征在于，包括：

由设计客户端根据其中运行的界面编辑进程所触发的界面项目相对应的界面发布事件，生成图标交付通知；

由服务器根据所述图标交付通知启动分支合并流程，在该流程中更新所述界面项目的版本号，将该版本号对应的版本更新分支接入所述界面项目的开发主干；

触发开发客户端生成所述设计客户端为所述界面项目发布的新增图标的组件代码，根据所述组件代码生成开发环境的可引用图标，将所述可引用图标发布到图标仓库。

2.根据权利要求1所述的图标库自动交付方法，其特征在于，由设计客户端根据其中运行的界面编辑进程所触发的界面项目相对应的界面发布事件，生成图标交付通知，包括：

在设计客户端中，随所述界面编辑进程的启动而加载发布监听模块；

由所述发布监听模块监听所述界面编辑进程所触发的界面发布事件，响应于所述界面发布事件，确定其相对应的界面项目的版本变更描述信息，向对应所述服务器的预设网络地址发送图标交付通知，该图标交付通知包含所述界面项目的特征信息和版本变更描述信息。

3.根据权利要求1所述的图标库自动交付方法，其特征在于，由服务器根据所述图标交付通知启动分支合并流程，在该流程中更新所述界面项目的版本号，将该版本号对应的版本更新分支接入所述界面项目的开发主干，包括：

所述服务器响应于所述图标交付通知，获取其相对应的界面项目的图标库描述文件的历史最新版本号；

所述服务器根据历史最新版本号确定当次版本号，创建当次版本号相对应的版本更新分支，生成相应的开发通知消息；

所述服务器响应于对应所述开发通知消息而提交的流程合并指令，将所述版本更新分支接入所述界面项目的开发主干。

4.根据权利要求3所述的图标库自动交付方法，其特征在于，触发开发客户端生成所述设计客户端为所述界面项目发布的新增图标的组件代码，根据所述组件代码生成开发环境的可引用图标，将所述可引用图标发布到图标仓库，包括：

由所述开发客户端获取所述设计客户端为所述界面项目发布的新增图标；

将所述新增图标转换为矢量格式文件，每个矢量格式文件以组件代码的形式描述相应的一个新增图标的矢量绘制信息；

根据所述矢量格式文件中的组件代码生成所述开发客户端中的开发环境的可引用图标；

将所述可引用图标存储于所述界面项目相对应的图标仓库，将该图标仓库与更新后的所述版本号相关联。

5.根据权利要求4所述的图标库自动交付方法，其特征在于，将所述新增图标转换为矢量格式文件之后，包括：

将矢量格式文件内组件代码中的颜色填充属性修改为允许多色填充。

6.根据权利要求1至5中任意一项所述的图标库自动交付方法，其特征在于：所述界面编辑进程为界面设计软件运行所得的进程，所述开发环境为特定开发语言的开发工具软件运行后所提供的开发环境，所述界面编辑进程中的新增图标以第一图像格式封装，根据所述组件代码所生产的可引用图标以第二图像格式封装。

7.一种图标库自动交付装置，其特征在于，包括：

设计发布模块，设置为由设计客户端根据其中运行的界面编辑进程所触发的界面项目相对应的界面发布事件，生成图标交付通知；

流程处理模块，设置为由服务器根据所述图标交付通知启动分支合并流程，在该流程中更新所述界面项目的版本号，将该版本号对应的版本更新分支接入所述界面项目的开发主干；

开发更新模块，设置为触发开发客户端生成所述设计客户端为所述界面项目发布的新增图标的组件代码，根据所述组件代码生成开发环境的可引用图标，将所述可引用图标发布到图标仓库。

8.一种图标库自动交付设备，包括中央处理器和存储器，其特征在于，所述中央处理器用于调用运行存储于所述存储器中的计算机程序以执行如权利要求1至6中任意一项所述的方法的步骤。

9.一种非易失性可读存储介质，其特征在于，其以计算机可读指令的形式存储有依据权利要求1至6中任意一项所述的方法所实现的计算机程序，所述计算机程序被计算机调用运行时，执行相应的方法所包括的步骤。

10.一种计算机程序产品，其特征在于，其包括计算机程序/指令，所述计算机程序/指令被处理器调用时执行权利要求1至6中任意一项所述的方法的步骤。

Images