CN113296759A - 用户界面处理方法、用户界面处理系统、设备及存储介质 - Google Patents

Abstract

本公开提供了一种用户界面处理方法、用户界面处理系统、电子设备及计算机可读存储介质，属于计算机技术领域。该方法包括：响应于接收可视化编辑界面中的编辑操作，获取编辑后得到的目标用户界面的用户界面信息；解析所述用户界面信息中各个控件的标签信息，确定所述各个控件的类型；根据所述各个控件的类型与属性信息，生成所述各个控件对应的控件代码；基于所述控件代码，得到所述用户界面信息对应的可视化加载文件。本公开可以提高用户界面的开发和维护效率。

Description

用户界面处理方法、用户界面处理系统、设备及存储介质

技术领域

本公开涉及计算机技术领域，尤其涉及一种用户界面处理方法、用户界面处理系统、电子设备及计算机可读存储介质。

背景技术

用户界面是计算机系统和用户之间进行交互和信息交换的媒介，实现了信息的内部形式与用户可以接收形式之间的转换。基于用户界面，用户可以方便、有效对硬件进行操作，以达成双向交互。为了丰富软件功能，给用户提供丰富的交互体验，开发人员常常需要开发或维护多样化的交互界面。

在对用户界面进行开发或维护等处理时，现有技术通常是直接在当前业务模块中编写相应的用户界面代码，其中，各类控件的位置关系及大小等参数也是通过用户界面函数库中的参数进行调整。然而使用这种处理方法，在实现初期，需要耗费大量的时间对整个用户界面的布局以及控件进行编码；且当需要对其进行修改或维护时，往往是通过修改用户界面代码，重新运行，并根据呈现效果进行逐步调整的方式，开发效率较低且不利于维护。

需要说明的是，在上述背景技术部分公开的信息仅用于加强对本公开的背景的理解，因此可以包括不构成对本领域普通技术人员已知的现有技术的信息。

发明内容

本公开提供了一种用户界面处理方法、用户界面处理系统、电子设备及计算机可读存储介质，进而至少在一定程度上克服现有技术中用户界面处理方法效率低的问题。

本公开的其他特性和优点将通过下面的详细描述变得显然，或部分地通过本公开的实践而习得。

根据本公开的第一方面，提供一种用户界面处理方法，包括：响应于接收可视化编辑界面中的编辑操作，获取编辑后得到的目标用户界面的用户界面信息；解析所述用户界面信息中各个控件的标签信息，确定所述各个控件的类型；根据所述各个控件的类型与属性信息，生成所述各个控件对应的控件代码；基于所述控件代码，得到所述用户界面信息对应的可视化加载文件。

在本公开的一种示例性实施例中，所述获取编辑后得到的目标用户界面的用户界面信息，包括：将编辑后的所述目标用户界面保存为第一格式的用户界面信息；将按所述第一格式的用户界面信息转换为第二格式的用户界面信息；其中，所述第二格式为所述目标用户界面的开发工程所兼容的数据格式。

在本公开的一种示例性实施例中，所述解析所述用户界面信息中各个控件的标签信息，确定所述各个控件的类型，包括：将所述用户界面信息解析为树结构，遍历所述树结构，得到所述用户界面信息中每个控件所包含的一个或多个标签；通过将所述每个控件所包含的一个或多个标签与已知控件的标签组合进行匹配，确定所述每个控件的类型。

在本公开的一种示例性实施例中，所述控件代码包括第一部分代码与第二部分代码；所述根据所述各个控件的类型与属性信息，生成所述各个控件对应的控件代码，包括：根据所述每个控件的类型，生成所述每个控件对应的第一部分代码；根据所述每个控件的属性信息，生成所述每个控件对应的第二部分代码。

在本公开的一种示例性实施例中，所述基于所述控件代码，得到所述用户界面信息对应的可视化加载文件，包括：基于所述控件代码与所述用户界面信息中的美术资源信息，生成所述可视化加载文件。

在本公开的一种示例性实施例中，所述方法还包括：将所述可视化加载文件添加至所述目标用户界面的开发工程；在所述开发工程中加载所述可视化加载文件，以在所述可视化编辑界面中显示所述目标用户界面。

在本公开的一种示例性实施例中，所述方法还包括：获取针对所述目标用户界面的更新信息；根据所述更新信息修改所述控件代码，以更新所述可视化加载文件。

根据本公开的第二方面，提供一种用户界面处理系统，包括：可视化编辑模块，用于响应于接收可视化编辑界面中的编辑操作，获取编辑后得到的目标用户界面的用户界面信息；用户界面解析模块，用于解析所述用户界面信息中各个控件的标签信息，确定所述各个控件的类型；控件代码生成模块，用于根据所述各个控件的类型与属性信息，生成所述各个控件对应的控件代码；加载文件生成模块，用于基于所述控件代码，得到所述用户界面信息对应的可视化加载文件。

在本公开的一种示例性实施例中，可视化编辑模块，包括：第一保存单元，用于将编辑后的所述目标用户界面保存为第一格式的用户界面信息；第二保存单元，用于将按所述第一格式的用户界面信息转换为第二格式的用户界面信息；其中，所述第二格式为所述目标用户界面的开发工程所兼容的数据格式。

在本公开的一种示例性实施例中，用户界面解析模块，包括：遍历单元，用于将所述用户界面信息解析为树结构，遍历所述树结构，得到所述用户界面信息中每个控件所包含的一个或多个标签；匹配单元，用于通过将所述每个控件所包含的一个或多个标签与已知控件的标签组合进行匹配，确定所述每个控件的类型。

在本公开的一种示例性实施例中，所述控件代码包括第一部分代码与第二部分代码；控件代码生成模块，包括：第一代码生成单元，用于根据所述每个控件的类型，生成所述每个控件对应的第一部分代码；第二代码生成单元，用于根据所述每个控件的属性信息，生成所述每个控件对应的第二部分代码。

在本公开的一种示例性实施例中，加载文件生成模块，包括：文件生成单元，用于基于所述控件代码与所述用户界面信息中的美术资源信息，生成所述可视化加载文件。

在本公开的一种示例性实施例中，用户界面处理系统还包括：加载文件添加模块，用于将所述可视化加载文件添加至所述目标用户界面的开发工程；以及在所述开发工程中加载所述可视化加载文件，以在所述可视化编辑界面中显示所述目标用户界面。

在本公开的一种示例性实施例中，用户界面处理系统还包括：更新信息获取模块，用于获取针对所述目标用户界面的更新信息；更新模块，用于根据所述更新信息修改所述控件代码，以更新所述可视化加载文件。

根据本公开的第三方面，提供一种电子设备，包括：处理器；以及存储器，用于存储所述处理器的可执行指令；其中，所述处理器配置为经由执行所述可执行指令来执行上述任意一项所述的方法。

根据本公开的第四方面，提供一种计算机可读存储介质，其上存储有计算机程序，所述计算机程序被处理器执行时实现上述任意一项所述的方法。

本公开的示例性实施例具有以下有益效果：

响应于接收可视化编辑界面中的编辑操作，获取编辑后得到的目标用户界面的用户界面信息；解析用户界面信息中各个控件的标签信息，确定各个控件的类型；根据各个控件的类型与属性信息，生成各个控件对应的控件代码；基于控件代码，得到用户界面信息对应的可视化加载文件。一方面，本示例性实施例提出一种新的用户界面处理方法，可以通过可视化编辑界面对目标用户界面进行设计，并基于用户界面信息生成控件代码，最后根据该控件代码生成系统可以加载的可视化加载文件，实现开发新的用户界面或更新已有的用户界面，其中，用户界面的开发过程可视化程度高，便于开发人员对用户界面直观且便捷的操作，提高了用户界面的开发效率；另一方面，相比于现有技术，本示例性实施例无需编写大量的用户界面代码并反复试验运行，来检查用户界面的显示效果，仅在可视化编辑界面中进行对应的编辑操作，即能够生成目标用户界面中对应的控件代码以及可视化加载文件，不仅能够实时审阅编辑后的显示效果，还能够提高用户界面的维护效率。

应当理解的是，以上的一般描述和后文的细节描述仅是示例性和解释性的，并不能限制本公开。

附图说明

此处的附图被并入说明书中并构成本说明书的一部分，示出了符合本公开的实施例，并与说明书一起用于解释本公开的原理。显而易见地，下面描述中的附图仅仅是本公开的一些实施例，对于本领域普通技术人员来讲，在不付出创造性劳动的前提下，还可以根据这些附图获得其他的附图。

图1示意性示出本示例性实施例中一种用户界面处理方法的流程图；

图2示意性示出本示例性实施例中一种可视化编辑界面的示意图；

图3示意性示出本示例性实施例中一种用户界面处理方法的子流程图；

图4示意性示出本示例性实施例中一种通过解析器解析用户界面信息的示意图；

图5示意性示出本示例性实施例中另一种用户界面处理方法的流程图；

图6示意性示出本示例性实施例中一种用户界面处理系统的结构框图；

图7示意性示出本示例性实施例中一种用于实现上述方法的电子设备。

具体实施方式

现在将参考附图更全面地描述示例实施方式。然而，示例实施方式能够以多种形式实施，且不应被理解为限于在此阐述的范例；相反，提供这些实施方式使得本公开将更加全面和完整，并将示例实施方式的构思全面地传达给本领域的技术人员。所描述的特征、结构或特性可以以任何合适的方式结合在一个或更多实施方式中。

在相关技术的一种用户界面处理方法中，开发人员可以通过可视化用户界面的设计工具进行界面设计，然后基于设计结果生成用户界面文件，将其转译成对应的用户界面代码，再导入业务模块中，以连接用户界面与其对应的处理逻辑。

然而，通过这种方式转译生成的代码，可读性较低，当后期需要对交互逻辑进行修改时，需要重复上述编译过程，并覆盖之前的开发内容。在活动业务变更周期短，修改内容少，或者需求变化快的场景中，会严重影响用户界面开发和维护的效率。

基于上述问题，本公开的示例性实施例首先提供了一种用户界面处理方法，本实施例方法的应用场景可以是：针对新软件的用户界面进行开发，或者对已开发的用户界面进行修改、调整或更新等应用场景。

下面结合附图1对本示例性实施例做进一步说明，如图1所示，用户界面处理方法可以包括以下步骤S110～S140：

步骤S110，响应于接收可视化编辑界面中的编辑操作，获取编辑后得到的目标用户界面的用户界面信息。

其中，可视化编辑界面是指可以以可视化的显示方式进行用户界面设计的界面，例如通过可视化用户界面设计工具，如PowerUI Designer(界面设计工具)，所展示出的图形用户界面。根据可视化用户界面设计工具的不同，所呈现的图形用户界面可能具有差异，但均可以通过用户的交互操作对用户界面进行布局和设计操作。目标用户界面是指开发人员所想要编辑的目标界面，也即实际想要得到的用户界面，根据用户或开发软件需求的不同，目标用户界面所包含的内容具有差异，例如游戏软件的用户界面可以包括游戏角色的图像或相关的文本，直播软件的用户界面可以包括直播的视频源或聊天室等内容。用户可以通过在可视化编辑界面中对一个或多个控件进行移动、点击、拖动等操作实现对控件的位置移动、尺寸调整等编辑操作，从而确定目标用户界面。其中，控件即为可视化编辑界面中可以进行操作的元素，例如显示文本、文本框、图像、超链接或按钮等，如图2示出了一种直播场景中用户参与粉丝团界面的可视化编辑界面，其中包括“打榜”、“成立粉丝团”、“粉丝团玩法说明＞”、“PushButton(按钮控件)”等多个控件，开发人员可以在该可视化编辑界面中，通过拖动任一控件，实现移动或修改控件的位置。

用户界面信息是指用户在可视化编辑界面中对目标用户界面进行编辑得到的文件信息，如图2所示的可视化编辑界面的文件名，通常为后缀为“.ui”的用户界面文件，也可以是将得到的用户界面文件进行格式转换得到的文件，例如将后缀为“.ui”的用户界面文件转换为XML(Extensible Markup Language，可扩展标记语言)格式的文件等。在本示例性实施例中，当用户(如用户界面开发人员)在可视化编辑界面中对控件进行编辑，确定目标用户界面后，即可以对应生成目标用户界面的用户界面信息。

在一示例性实施例中，上述步骤S110可以包括以下步骤：

将编辑后的目标用户界面保存为第一格式的用户界面信息；

将按第一格式的用户界面信息转换为第二格式的用户界面信息；

其中，第二格式为目标用户界面的开发工程所兼容的数据格式。

其中，第一格式的用户界面信息是指根据用户在可视化编辑界面中对目标用户界面的编辑操作生成的原始格式的文件，可以是指后缀为“.ui”的用户界面文件。在实际应用中，为了便于后续对用户界面信息进行解析，可以对其格式进行转换，将第一格式的用户界面信息转换为开发工程所兼容的第二格式，如转换为XML格式的用户界面信息。

步骤S120，解析用户界面信息中各个控件的标签信息，确定各个控件的类型。

本示例性实施例可以构建一解析器，如UI_PARSER(自定义名称)解析器，用于对步骤S110中生成的用户界面信息进行解析。具体的，可以对用户界面信息中的各个控件的标签信息进行解析，该标签信息是指用于反映控件属性的信息，例如控件的类型、位置、尺寸、内容等，不同的控件，对应的标签信息不同，例如图像控件的标签信息可以包括图像信息、图像尺寸等，文本控件的标签信息可以包括文本尺寸、文本字体、文本样式等等。不同的类型的控件可以具有不同的控件代码，因此，本示例性实施例可以通过对各个控件标签信息的解析，先确定出各个控件的类型，即目标用户界面中具体包括了哪些类型的控件。

步骤S130，根据各个控件的类型与属性信息，生成各个控件对应的控件代码。

其中，属性信息即为控件具体标签信息的标签值，例如图像控件包含图像尺寸、图像信息等标签信息，具体的尺寸大小，以及具体的图像内容即为属性信息。在本示例性实施例中，可以预先对各个控件的属性进行自定义配置，以获取配置信息，也可以从特定配置信息数据库中获取各个控件的属性信息等等，进一步的，根据控件类型以及属性信息，可以确定用户界面中包括什么样的控件，具体如何呈现，呈现内容以及效果如何，例如在目标用户界面中，图像控件以什么内容的图像，什么尺寸的大小，在界面的哪一位置呈现等。本示例性实施例可以根据各个控件的类型和属性信息，生成各个控件对应的控件代码，计算机可以根据该控件代码实现对应控件的功能逻辑。

在一示例性实施例中，上述步骤S120可以包括：

将用户界面信息解析为树结构，遍历树结构，得到用户界面信息中每个控件所包含的一个或多个标签；

通过将每个控件所包含的一个或多个标签与已知控件的标签组合进行匹配，确定每个控件的类型。

在本示例性实施例中，获取用户界面信息后，可以对其进行解析。用户界面信息可以是XML格式的用户界面配置文件，对用户界面信息的树结构进行遍历，即为对XML格式的用户界面配置文件树中的各个节点进行遍历，得到目标用户界面中每个控件所包含的一个或多个标签。在本示例性实施例中，在对文件树进行遍历时，还可以检查中各个控件的标签序列的完整性，例如检查标签是否被修改过，或者是否包含乱码数据等情况，以确保对用户界面信息进行解析的准确性。进一步，可以通过对每个控件的一个或多个标签与已知控件的标签组合进行匹配，对标签信息进行分析，从而确定每个控件的类型，即确定出目标用户界面中包含哪些控件。具体的，由于用户界面信息中控件的标签信息通常以字符或字符串的方式表示，因此，本示例性实施例可以通过字符串及正则表达式的匹配关系，来表示已知控件的标签组合，通过将每个控件所包含的一个或多个标签与对应的正则表达式进行匹配，确定出每个控件的类型。

进一步的，在一示例性实施例中，上述控件代码可以包括第一部分代码与第二部分代码；上述步骤S130可以包括以下步骤：

根据每个控件的类型，生成每个控件对应的第一部分代码；

根据每个控件的属性信息，生成每个控件对应的第二部分代码。

其中，第一部分代码即为控件类型代码，第二部分代码即为控件属性代码，系统根据第一部分代码可以确定是什么类型的控件，例如是图像控件、文本框控件还是按钮控件等等，根据第二部分代码可以确定控件如何显示或具有何种对应的功能，例如图像控件中的图像信息，以及图像尺寸等等。

步骤S140，基于控件代码，得到用户界面信息对应的可视化加载文件。

最后，根据步骤S130生成的各个控件的控件代码，可以生成用户界面信息对应的可视化加载文件，该可视化加载文件即对用户界面信息进行解析后得到的文件，计算机通过装载该可视化加载文件，可以实现其中各个控件的交互逻辑和数据显示内容。

在一示例性实施例中，上述步骤S140可以包括以下步骤：

基于控件代码与用户界面信息中的美术资源信息，生成可视化加载文件。

其中，美术资源信息是指控件在用户界面显示时所包括的特效、背景、贴图等美术显示效果的资源信息。实际应用中，系统加载可视化加载文件可以确定目标用户显示界面，其中，可视化加载文件中除了包括能够反映各个控件的类型以及显示信息的代码以外，还可以包括上述美术资源信息，以丰富目标用户界面中视图层的显示效果。因此，本示例性实施例可以基于控件代码与用户界面信息中的美术资源信息，共同生成可视化加载文件。

基于上述说明，在本示例性实施例中，响应于接收可视化编辑界面中的编辑操作，获取编辑后得到的目标用户界面的用户界面信息；解析用户界面信息中各个控件的标签信息，确定各个控件的类型；根据各个控件的类型与属性信息，生成各个控件对应的控件代码；基于控件代码，得到用户界面信息对应的可视化加载文件。一方面，本示例性实施例提出一种新的用户界面处理方法，可以通过可视化编辑界面对目标用户界面进行设计，并基于用户界面信息生成控件代码，最后根据该控件代码生成系统可以加载的可视化加载文件，实现开发新的用户界面或更新已有的用户界面，其中，用户界面的开发过程可视化程度高，便于开发人员对用户界面直观且便捷的操作，提高了用户界面的开发效率；另一方面，相比于现有技术，本示例性实施例无需编写大量的用户界面代码并反复试验运行，来检查用户界面的显示效果，仅在可视化编辑界面中进行对应的编辑操作，即能够生成目标用户界面中对应的控件代码以及可视化加载文件，不仅能够实时审阅编辑后的显示效果，还能够提高用户界面的维护效率。

在一示例性实施例中，如图3所示，上述用户界面处理方法还可以包括以下步骤：

步骤S310，将可视化加载文件添加至目标用户界面的开发工程；

步骤S320，在开发工程中加载可视化加载文件，以在可视化编辑界面中显示目标用户界面。

其中，可视化加载文件是指对应目标用户界面能够在可视化编辑界面中进行加载的文件。在本示例性实施例中，系统可以建立用户界面文件的加载模块，用于在活动工程中对解析后的用户界面信息，即可视化加载文件，进行加载，将其真正独立成业务功能中的视图层部分，随后通过查找函数定位视图层基类，使用其对象的引用来编写界面交互的逻辑和显示数据的更新。

目标用户界面的开发工程可以是指开发人员根据需要搭建的用户界面开发工程，例如VCUAPU(Visualization to create the UI and Parsing the UI，一种包含UI解析器的可视化开发界面工程架构)工程架构。在将可视化加载文件添加至目标用户界面的开发工程的主控之后，可以通过工程业务的主逻辑来调用可视化图形编辑器创建的用户界面信息。最后，即可以实现对目标用户界面进行显示。

在一示例性实施例中，上述用户界面处理方法还可以包括以下步骤：

获取针对目标用户界面的更新信息；

根据更新信息修改控件代码，以更新可视化加载文件。

考虑到除了用户界面的开发之外，实际应用中，还会涉及对用户界面的修改操作，因此，本示例性实施例还可以在用户界面开发完成，显示目标用户界面之后，获取针对该目标用户界面的更新信息，该更新信息可以是对其中部分控件的修改、添加或删除等调整操作等，本公开对此不做具体限定。进一步，可以根据该更新信息修改对应的控件代码，实现可视化加载文件的更新，从而修改目标用户界面的显示，修改过程便捷，可视化程度高，有利于提高开发人员对用户界面的修改和维护效率。

图4示出了本示例性实施例中通过UI_PARSER解析器410进行用户界面处理的过程示意图，具体可以包括：

步骤S411，获取用户界面信息的树结构；

步骤S412，解析上述树结构并进行遍历；

步骤S413，创建目标用户界面的控件项，即确定出每个类型的控件以及对应的属性信息；

步骤S414，应用对应的用户界面的控件的属性信息；

步骤S415，加载解析后的可视化加载文件。

对应的，上述步骤S411可以对应用户界面信息420中所包含的Visual interface(可视化界面数据)421获取；步骤S412的执行可以对应用户界面信息420中的can be readXml(可以被读取的Xml数据)422；步骤S413～S415的执行可以对应于用户界面420中的Widget UI(用户界面小控件数据)423。

图5示出了本示例性实施例中另一种用户界面处理方法的流程图，具体可以包括以下步骤：

步骤S510：获取在可视化编辑界面中编辑目标用户界面所得到的用户界面信息；

步骤S520，解析用户界面信息中各个控件的标签信息，确定各个控件的类型；

步骤S530，根据各个控件的类型与属性信息，生成各个控件对应的控件代码；

步骤S540，基于控件代码与用户界面信息中的美术资源信息，生成可视化加载文件；

步骤S550，将可视化加载文件添加至目标用户界面的开发工程；

步骤S560，在开发工程中加载可视化加载文件，以在可视化编辑界面中显示目标用户界面；

步骤S570，获取针对目标用户界面的更新信息；

步骤S580，根据更新信息修改控件代码，以更新可视化加载文件。

本示例性实施例可以通过用户在可视化编辑界面中的编辑操作，快速开发新的用户界面，还可以通过步骤S570～S580，对已有的用户界面进行辩解修改，用户界面处理过程简单、方便，具有较高的处理效率。

本公开的示例性实施例还提供了一种用户界面处理系统。参照图6，该系统600可以包括，可视化编辑模块610，用于响应于接收可视化编辑界面中的编辑操作，获取编辑后得到的目标用户界面的用户界面信息；用户界面解析模块620，用于解析用户界面信息中各个控件的标签信息，确定各个控件的类型；控件代码生成模块630，用于根据各个控件的类型与属性信息，生成各个控件对应的控件代码；加载文件生成模块640，用于基于控件代码，得到用户界面信息对应的可视化加载文件。

在本公开的一种示例性实施例中，可视化编辑模块，包括：第一保存单元，用于将编辑后的目标用户界面保存为第一格式的用户界面信息；第二保存单元，用于将按第一格式的用户界面信息转换为第二格式的用户界面信息；其中，第二格式为目标用户界面的开发工程所兼容的数据格式。

在本公开的一种示例性实施例中，用户界面解析模块，包括：遍历单元，用于将用户界面信息解析为树结构，遍历树结构，得到用户界面信息中每个控件所包含的一个或多个标签；匹配单元，用于通过将每个控件所包含的一个或多个标签与已知控件的标签组合进行匹配，确定每个控件的类型。

在本公开的一种示例性实施例中，控件代码包括第一部分代码与第二部分代码；控件代码生成模块，包括：第一代码生成单元，用于根据每个控件的类型，生成每个控件对应的第一部分代码；第二代码生成单元，用于根据每个控件的属性信息，生成每个控件对应的第二部分代码。

在本公开的一种示例性实施例中，加载文件生成模块，包括：文件生成单元，用于基于控件代码与用户界面信息中的美术资源信息，生成可视化加载文件。

在本公开的一种示例性实施例中，用户界面处理系统还包括：加载文件添加模块，用于将可视化加载文件添加至目标用户界面的开发工程；以及在开发工程中加载可视化加载文件，以在可视化编辑界面中显示目标用户界面。

在本公开的一种示例性实施例中，用户界面处理系统还包括：更新信息获取模块，用于获取针对目标用户界面的更新信息；更新模块，用于根据更新信息修改控件代码，以更新可视化加载文件。

上述系统中各模块/单元的具体细节在方法部分的实施例中已经详细说明，未披露的细节内容可以参见方法部分的实施例内容，因此此处不再赘述。

本公开的示例性实施例还提供了一种能够实现上述方法的电子设备。

所属技术领域的技术人员能够理解，本公开的各个方面可以实现为系统、方法或程序产品。因此，本公开的各个方面可以具体实现为以下形式，即：完全的硬件实施方式、完全的软件实施方式(包括固件、微代码等)，或硬件和软件方面结合的实施方式，这里可以统称为“电路”、“模块”或“系统”。

下面参照图7来描述根据本公开的这种示例性实施例的电子设备700。图7显示的电子设备700仅仅是一个示例，不应对本公开实施例的功能和使用范围带来任何限制。

如图7所示，电子设备700以通用计算设备的形式表现。电子设备700的组件可以包括但不限于：上述至少一个处理单元710、上述至少一个存储单元720、连接不同系统组件(包括存储单元720和处理单元710)的总线730、显示单元740。

其中，存储单元存储有程序代码，程序代码可以被处理单元710执行，使得处理单元710执行本说明书上述“示例性方法”部分中描述的根据本公开各种示例性实施方式的步骤。例如，处理单元710可以执行图1、图3、图4或图5所示的步骤。

存储单元720可以包括易失性存储单元形式的可读介质，例如随机存取存储单元(RAM)721和/或高速缓存存储单元722，还可以进一步包括只读存储单元(ROM)723。

存储单元720还可以包括具有一组(至少一个)程序模块725的程序/实用工具724，这样的程序模块725包括但不限于：操作系统、一个或者多个应用程序、其它程序模块以及程序数据，这些示例中的每一个或某种组合中可能包括网络环境的实现。

总线730可以为表示几类总线结构中的一种或多种，包括存储单元总线或者存储单元控制器、外围总线、图形加速端口、处理单元或者使用多种总线结构中的任意总线结构的局域总线。

电子设备700也可以与一个或多个外部设备800(例如键盘、指向设备、蓝牙设备等)通信，还可与一个或者多个使得用户能与该电子设备700交互的设备通信，和/或与使得该电子设备700能与一个或多个其它计算设备进行通信的任何设备(例如路由器、调制解调器等等)通信。这种通信可以通过输入/输出(I/O)接口750进行。并且，电子设备700还可以通过网络适配器760与一个或者多个网络(例如局域网(LAN)，广域网(WAN)和/或公共网络，例如因特网)通信。如图所示，网络适配器760通过总线730与电子设备700的其它模块通信。应当明白，尽管图中未示出，可以结合电子设备700使用其它硬件和/或软件模块，包括但不限于：微代码、设备驱动器、冗余处理单元、外部磁盘驱动阵列、RAID系统、磁带驱动器以及数据备份存储系统等。

通过以上的实施方式的描述，本领域的技术人员易于理解，这里描述的示例实施方式可以通过软件实现，也可以通过软件结合必要的硬件的方式来实现。因此，根据本公开实施方式的技术方案可以以软件产品的形式体现出来，该软件产品可以存储在一个非易失性存储介质(可以是CD-ROM，U盘，移动硬盘等)中或网络上，包括若干指令以使得一台计算设备(可以是个人计算机、服务器、终端装置、或者网络设备等)执行根据本公开示例性实施例的方法。

本公开的示例性实施例还提供了一种计算机可读存储介质，其上存储有能够实现本说明书上述方法的程序产品。在一些可能的实施方式中，本公开的各个方面还可以实现为一种程序产品的形式，其包括程序代码，当程序产品在终端设备上运行时，程序代码用于使终端设备执行本说明书上述“示例性方法”部分中描述的根据本公开各种示例性实施方式的步骤。

本公开的示例性实施例还提供了一种用于实现上述方法的程序产品，其可以采用便携式紧凑盘只读存储器(CD-ROM)并包括程序代码，并可以在终端设备，例如个人电脑上运行。然而，本公开的程序产品不限于此，在本文件中，可读存储介质可以是任何包含或存储程序的有形介质，该程序可以被指令执行系统、装置或者器件使用或者与其结合使用。

程序产品可以采用一个或多个可读介质的任意组合。可读介质可以是可读信号介质或者可读存储介质。可读存储介质例如可以为但不限于电、磁、光、电磁、红外线、或半导体的系统、装置或器件，或者任意以上的组合。可读存储介质的更具体的例子(非穷举的列表)包括：具有一个或多个导线的电连接、便携式盘、硬盘、随机存取存储器(RAM)、只读存储器(ROM)、可擦式可编程只读存储器(EPROM或闪存)、光纤、便携式紧凑盘只读存储器(CD-ROM)、光存储器件、磁存储器件、或者上述的任意合适的组合。

计算机可读信号介质可以包括在基带中或者作为载波一部分传播的数据信号，其中承载了可读程序代码。这种传播的数据信号可以采用多种形式，包括但不限于电磁信号、光信号或上述的任意合适的组合。可读信号介质还可以是可读存储介质以外的任何可读介质，该可读介质可以发送、传播或者传输用于由指令执行系统、装置或者器件使用或者与其结合使用的程序。

可读介质上包含的程序代码可以用任何适当的介质传输，包括但不限于无线、有线、光缆、RF等等，或者上述的任意合适的组合。

可以以一种或多种程序设计语言的任意组合来编写用于执行本公开操作的程序代码，程序设计语言包括面向对象的程序设计语言—诸如Java、C++等，还包括常规的过程式程序设计语言—诸如“C”语言或类似的程序设计语言。程序代码可以完全地在用户计算设备上执行、部分地在用户设备上执行、作为一个独立的软件包执行、部分在用户计算设备上部分在远程计算设备上执行、或者完全在远程计算设备或服务器上执行。在涉及远程计算设备的情形中，远程计算设备可以通过任意种类的网络，包括局域网(LAN)或广域网(WAN)，连接到用户计算设备，或者，可以连接到外部计算设备(例如利用因特网服务提供商来通过因特网连接)。

此外，上述附图仅是根据本公开示例性实施例的方法所包括的处理的示意性说明，而不是限制目的。易于理解，上述附图所示的处理并不表明或限制这些处理的时间顺序。另外，也易于理解，这些处理可以是例如在多个模块中同步或异步执行的。

应当注意，尽管在上文详细描述中提及了用于动作执行的设备的若干模块或者单元，但是这种划分并非强制性的。实际上，根据本公开的示例性实施例，上文描述的两个或更多模块或者单元的特征和功能可以在一个模块或者单元中具体化。反之，上文描述的一个模块或者单元的特征和功能可以进一步划分为由多个模块或者单元来具体化。

本领域技术人员在考虑说明书及实践这里公开的发明后，将容易想到本公开的其他实施例。本申请旨在涵盖本公开的任何变型、用途或者适应性变化，这些变型、用途或者适应性变化遵循本公开的一般性原理并包括本公开未公开的本技术领域中的公知常识或惯用技术手段。说明书和实施例仅被视为示例性的，本公开的真正范围和精神由权利要求指出。

应当理解的是，本公开并不局限于上面已经描述并在附图中示出的精确结构，并且可以在不脱离其范围进行各种修改和改变。本公开的范围仅由所附的权利要求来限定。

Claims (10)

1.一种用户界面处理方法，其特征在于，包括：

响应于接收可视化编辑界面中的编辑操作，获取编辑后得到的目标用户界面的用户界面信息；

解析所述用户界面信息中各个控件的标签信息，确定所述各个控件的类型；

根据所述各个控件的类型与属性信息，生成所述各个控件对应的控件代码；

基于所述控件代码，得到所述用户界面信息对应的可视化加载文件。

2.根据权利要求1所述的方法，其特征在于，所述获取编辑后得到的目标用户界面的用户界面信息，包括：

将编辑后的所述目标用户界面保存为第一格式的用户界面信息；

将按所述第一格式的用户界面信息转换为第二格式的用户界面信息；

其中，所述第二格式为所述目标用户界面的开发工程所兼容的数据格式。

3.根据权利要求1所述的方法，其特征在于，所述解析所述用户界面信息中各个控件的标签信息，确定所述各个控件的类型，包括：

将所述用户界面信息解析为树结构，遍历所述树结构，得到所述用户界面信息中每个控件所包含的一个或多个标签；

通过将所述每个控件所包含的一个或多个标签与已知控件的标签组合进行匹配，确定所述每个控件的类型。

4.根据权利要求3所述的方法，其特征在于，所述控件代码包括第一部分代码与第二部分代码；所述根据所述各个控件的类型与属性信息，生成所述各个控件对应的控件代码，包括：

根据所述每个控件的类型，生成所述每个控件对应的第一部分代码；

根据所述每个控件的属性信息，生成所述每个控件对应的第二部分代码。

5.根据权利要求1所述的方法，其特征在于，所述基于所述控件代码，得到所述用户界面信息对应的可视化加载文件，包括：

基于所述控件代码与所述用户界面信息中的美术资源信息，生成所述可视化加载文件。

6.根据权利要求1所述的方法，其特征在于，所述方法还包括：

将所述可视化加载文件添加至所述目标用户界面的开发工程；

在所述开发工程中加载所述可视化加载文件，以在所述可视化编辑界面中显示所述目标用户界面。

7.根据权利要求1所述的方法，其特征在于，所述方法还包括：

获取针对所述目标用户界面的更新信息；

根据所述更新信息修改所述控件代码，以更新所述可视化加载文件。

8.一种用户界面处理系统，其特征在于，包括：

可视化编辑模块，用于响应于接收可视化编辑界面中的编辑操作，获取编辑后得到的目标用户界面的用户界面信息；

用户界面解析模块，用于解析所述用户界面信息中各个控件的标签信息，确定所述各个控件的类型；

控件代码生成模块，用于根据所述各个控件的类型与属性信息，生成所述各个控件对应的控件代码；

加载文件生成模块，用于基于所述控件代码，得到所述用户界面信息对应的可视化加载文件。

9.一种电子设备，其特征在于，包括：

处理器；以及

存储器，用于存储所述处理器的可执行指令；

其中，所述处理器配置为经由执行所述可执行指令来执行权利要求1-7任一项所述的方法。

10.一种计算机可读存储介质，其上存储有计算机程序，其特征在于，所述计算机程序被处理器执行时实现权利要求1-7任一项所述的方法。

Images