一种用户界面处理方法、装置及设备制造方法及图纸

本实施例提供了一种用户界面处理方法、装置及设备，本实施例构建UI组件库的各组件是相互独立的，具体按照预设命名规则，获取各组件的组件标识关联的样式信息，从而据此确定当前界面显示的该组件的组件样式，并在使用任意一个组件时，直接利用其组件标识调用关联的事件信息并执行，不需要导入预设的整个UI组件库，需要哪个组件，调用哪个组件的样式信息、事件信息，降低了代码量，减少了代码冗余，提高了UI组件库构建或更新效率，且实现了组件的复用性，使得组件能够使用到多个地方，并不局限于当前界面。

【技术实现步骤摘要】
一种用户界面处理方法、装置及设备
本申请主要涉及前端
，更具体地说是涉及一种用户界面处理方法、装置及设备。
技术介绍
随着互联网技术的快速发展，智能手机、iPad、笔记本电脑等终端设备成为人们生活、工作或娱乐中必不可少的设备，用户在使用过程中通常都会在终端设备中安装用来办公、购物、游戏、浏览器等多个应用程序。其中，应用程序主要是通过UI(UserInterface，用户界面)以及操作呈现给用户，且不同应用程序的UI布局通常是不同的，同一应用程序在不同平台的终端设备呈现的UI布局往往也会有很大差异，以及同一应用程序在同一终端设备上呈现的UI布局也会不断更新变化。因此，在实际应用中，通常会依赖前端框架，针对不同的UI布局构建一个配套的UI组件库，过程繁琐、成本高；且终端设备通常需要导入多个UI组件库，才能获取当前界面各组件所需的组件信息，往往会出现代码冗余的问题。
技术实现思路
有鉴于此，本实施例提供了一种用户界面处理方法、装置及设备，实现了组件的相互独立，使其具有复用性，且由于无需导入整个UI组件库，解决了代码冗余问题。为了实现上述目的，本实施例公开了以下技术方案：本实施例提供了一种用户界面处理方法，所述方法包括：获取多个组件的组件标识；按照预设命名规则，提取各组件标识关联的样式信息；利用所述样式信息，确定终端当前界面包含的各组件的组件样式，并在输出所述当前界面时显示各组件的组件样式；接收到针对所述当前界面的任一组件的操作指令；响应所述操作指令，调用并执行所述任一组件的组件标识关联的事件信息。可选的，所述方法还包括：获取多个组件的超文本标记语言HTML文件信息；所述获取多个组件的组件标识，包括：利用多个组件的HTML文件信息包含的数据属性，得到相应组件的组件标识。可选的，所述方法还包括：从所述HTML文件信息中提取相应的样式信息及事件信息；建立相应组件标识与所述样式信息和所述事件信息之间的调用关系。可选的，所述方法还包括：获取预设的多个样式信息；接收用户针对各组件选定的样式信息，确定各组件的组件标识与相应样式信息之间的调用关系。可选的，所述多个样式信息包括系统预设样式信息、用户自定义样式信息。可选的，所述多个样式信息设置在公共变量文件中；接收到针对任一样式信息的修改指令；响应所述修改指令，修改所述公共变量文件中的相应样式信息。可选的，所述方法还包括：接收针对当前界面导入的新组件的组件信息，所述组件信息包括所述新组件的组件标识，及对应的样式信息和事件信息；利用所述新组件的组件信息，在所述终端当前界面显示所述新组件的组件样式。本实施例还提供了一种用户界面处理装置，所述装置包括：组件标识获取模块，用于获取多个组件的组件标识；样式信息提取模块，用于按照预设命名规则，提取各组件标识关联的样式信息；组件样式显示模块，用于利用所述样式信息，确定终端当前界面包含的各组件的组件样式，并在输出所述当前界面时显示各组件的组件样式；操作指令接收模块，用于接收到针对所述当前界面的任一组件的操作指令；组件事件调用模块，用于响应所述操作指令，调用并执行所述任一组件的组件标识关联的事件信息。可选的，所述装置还包括：HTML文件信息获取模块，用于获取多个组件的HTML文件信息；信息提取模块，用于从所述HTML文件信息中提取相应的样式信息及事件信息；调用关系建立模块，用于建立相应组件标识与所述样式信息和所述事件信息之间的调用关系；所述样式信息提取模块具体用于利用多个组件的HTML文件信息包含的数据属性，得到相应组件的组件标识。本实施例还提供了一种用户界面处理设备，所述设备包括：通信接口；存储器，用于存储实现如上所述的用户界面处理方法的多个指令；处理器，用于加载并执行所述多个指令，实现如上所述的用户界面处理方法的各个步骤。由此可见，与现有技术相比，本实施例提供了一种用户界面处理方法、装置及设备，本实施例构建UI组件库的各组件是相互独立的，具体按照预设命名规则，获取各组件的组件标识关联的样式信息，从而据此确定当前界面显示的该组件的组件样式，并在使用任意一个组件时，直接利用其组件标识调用关联的事件信息并执行，不需要导入预设的整个UI组件库，需要哪个组件，调用哪个组件的样式信息、事件信息，降低了代码量，减少了代码冗余，提高了UI组件库构建或更新效率，且实现了组件的复用性，使得组件能够使用到多个地方，并不局限于当前界面。附图说明为了更清楚地说明本专利技术实施例或现有技术中的技术方案，下面将对实施例或现有技术描述中所需要使用的附图作简单地介绍，显而易见地，下面描述中的附图仅仅是本专利技术的实施例，对于本领域普通技术人员来讲，在不付出创造性劳动的前提下，还可以根据提供的附图获得其他的附图。图1为本申请实施例提供的一种用户界面处理方法的流程图；图2为本申请实施例提供的另一种用户界面处理方法的流程图；图3为本申请实施例提供的一种用户界面处理装置的结构示意图；图4为本申请实施例提供的另一种用户界面处理装置的结构示意图；图5为本申请实施例提供的又一种用户界面处理装置的结构示意图；图6为本申请实施例提供的一种用户界面处理设备的硬件结构示意图。具体实施方式下面将结合本实施例中的附图，对本实施例中的技术方案进行清楚、完整地描述，显然，所描述的实施例仅仅是本公开的一部分实施例，而不是全部的实施例。基于本专利技术中的实施例，本领域普通技术人员在没有做出创造性劳动前提下所获得的所有其他实施例，都属于本公开保护的范围。如图1所示，为本申请实施例提供的一种用户界面处理方法的流程图，该方法可以包括：步骤S101，获取多个组件的组件标识；在本实施例中，多个组件可以包括UI(UserInterface，用户界面)构建中的常用组件，也可以基于当前平台的前端框架确定，还可以根据用户自定义设计确定出的组件等等，本实施例对该多个组件包含的组件数量以及类型不做限定。对于各组件的组件标识可以是用于区分各组件的标识，比如HTML(HyperTextMarkupLanguage，超文本标记语言)date-*属性，即date-*属性嵌入自定义数据，如data-mod-id等，其往往不具有唯一性，可以重复使用。因此，本实施例可以将HTMLdate-*属性作为相应组件的组件标识，确定该组件标识与组件之间的关联关系。其中，HTML中的id属性在页面中通常只能用于某个html标签，本实施例这种在数据中添加属性的方式可以使用在多个相同组件上，所以，本实施例确定的组件标识往往不会使用HTML中的id属性。以按钮组件为例进行说明，其HTML文件信息可以是：<buttonclass＝"ui-buttonmini"data-mod-id＝"button"data-mod-rule＝"normal">按钮</button>。按照本实施例上文描述的确定组件标识的方式，按钮这一组件的案件标识可以是button。步骤S102，按照预设命名规则，提取各组件标识关联的样式信息；步骤S103，利用该样式信息，确定终端当前界面包含的各组件的组件样式，并在输出所述当前界面时显示各组件的组件样式；在本实施例中，可以按照一定命名规则，建立各组件的组件样式及交互事件与相应组件标识之本文档来自技高网...

【技术保护点】
1.一种用户界面处理方法，其特征在于，所述方法包括：获取多个组件的组件标识；按照预设命名规则，提取各组件标识关联的样式信息；利用所述样式信息，确定终端当前界面包含的各组件的组件样式，并在输出所述当前界面时显示各组件的组件样式；接收到针对所述当前界面的任一组件的操作指令；响应所述操作指令，调用并执行所述任一组件的组件标识关联的事件信息。

【技术特征摘要】
1.一种用户界面处理方法，其特征在于，所述方法包括：获取多个组件的组件标识；按照预设命名规则，提取各组件标识关联的样式信息；利用所述样式信息，确定终端当前界面包含的各组件的组件样式，并在输出所述当前界面时显示各组件的组件样式；接收到针对所述当前界面的任一组件的操作指令；响应所述操作指令，调用并执行所述任一组件的组件标识关联的事件信息。2.根据权利要求1所述的方法，其特征在于，所述方法还包括：获取多个组件的超文本标记语言HTML文件信息；所述获取多个组件的组件标识，包括：利用多个组件的HTML文件信息包含的数据属性，得到相应组件的组件标识。3.根据权利要求2所述的方法，其特征在于，所述方法还包括：从所述HTML文件信息中提取相应的样式信息及事件信息；建立相应组件标识与所述样式信息和所述事件信息之间的调用关系。4.根据权利要求1所述的方法，其特征在于，所述方法还包括：获取预设的多个样式信息；接收用户针对各组件选定的样式信息，确定各组件的组件标识与相应样式信息之间的调用关系。5.根据权利要求4所述的方法，其特征在于，所述多个样式信息包括系统预设样式信息、用户自定义样式信息。6.根据权利要求1所述的方法，其特征在于，所述多个样式信息设置在公共变量文件中；接收到针对任一样式信息的修改指令；响应所述修改指令，修改所述公共变量文件中的相应样式信息。7.根据权利要求3所述的方法，其特征在于，所述方法还包括：接收针对当前...

【专利技术属性】
技术研发人员：张丹，吕云毅，赵莹，
申请(专利权)人：郑州悉知信息科技股份有限公司，
类型：发明
国别省市：河南,41