一种用户界面的调节方法、装置及系统制造方法及图纸

本发明专利技术公开了一种用户界面的调节方法、装置及系统，可以实时监测用户界面对应的界面描述文件中界面元素对应的布局样式信息的变化情况，若检测到第一界面元素的布局样式信息发生变化，对视图结构中第一界面元素的布局样式信息进行更新，并基于更新后的视图结构中第一界面元素的布局样式信息调整第一界面元素在用户界面的显示状态。在此过程中，无需重新调试布局样式信息未发生变更的界面元素的显示状态，也无需重新编译界面描述文件，无需重新生成视图结构，所以可以快速的观看到布局样式信息发生变更的第一界面元素对应的调整后的显示状态，提高了开发效率。

A User Interface Adjustment Method, Device and System

【技术实现步骤摘要】
一种用户界面的调节方法、装置及系统
本申请涉及数据网络通信领域，更具体的说，是涉及一种用户界面的调节方法、装置及系统。
技术介绍
目前基于XML(ExtensibleMarkupLanguage，可扩展标记语言)文件对UI(UserInterface，用户界面)进行样式布局的具体过程如下：技术人员编写XML文件，XML文件为界面描述文件，界面描述文件用于描述用户界面中每个界面元素在用户界面中的布局样式信息，每个界面元素在用户界面中的布局样式信息即为每个界面元素在用户界面的显示状态。界面元素的类型有多种，例如，界面元素可以为窗口或对话框或菜单或滚动条或图片。界面元素的布局样式信息包括布局信息以及样式信息，其中，布局信息包括但不限于：界面元素在用户界面中的位置；样式信息包括但不限于：界面元素的尺寸、界面元素的背景颜色、界面元素包含的内容(例如字体)、界面元素包含的内容的颜色以及界面元素包含的内容在界面元素中的位置等界面元素的显示属性。界面描述文件还可以用于描述每个界面元素对应的类名、界面元素的名称、界面元素的类型、事件监听类名、界面元素对应的响应事件；界面自动生成器根据界面描述文件对用户界面中的每个界面元素进行布局，并增加界面元素的事件监听功能。在编写界面描述文件的过程中，可以采用CSS(CascadingStyleSheets，层叠样式表)属性编写界面元素的样式信息，采用Flex(Flexible，灵活)排版界面元素的布局信息。目前在用户界面开发过程中，若需要对用户界面的布局样式进行变更，需要变更界面描述文件中的布局样式信息。若需要查看样式信息和/或布局信息更新后用户界面的布局样式的变化情况，需要界面自动生成器根据更新后的界面描述文件对界面中的每个界面元素重新进行布局，并增加界面元素的事件监听功能。
技术实现思路
有鉴于此，本申请提供了一种用户界面的调节方法、装置及系统，以克服现有技术中由于界面描述文件变更时需要重新编译界面描述文件且重新生成视图结构，导致开发用户界面的效率低下的问题。为实现上述目的，本申请提供如下技术方案：一种用户界面的调节方法，包括：监测所述用户界面对应的界面描述文件中界面元素的布局样式信息的变化情况；一个用户界面包括至少一个界面元素，一个界面元素的布局样式信息用于表征该界面元素在所述用户界面的显示状态；若检测到所述界面描述文件中第一界面元素的布局样式信息发生变更，基于所述第一界面元素对应的变更后的第一布局样式信息，确定所述第一界面元素位于视图结构中的第一位置；其中，所述视图结构是基于所述界面描述文件得到的，所述视图结构包括多个节点，一个节点对应所述用户界面中一个界面元素，所述视图结构还包括各界面元素分别对应的原始布局样式信息；基于所述第一位置以及所述第一布局样式信息，更新所述视图结构；基于更新后的视图结构，调节所述用户界面中所述第一界面元素的显示状态。一种用户界面的调节装置，包括：监测模块，用于监测所述用户界面对应的界面描述文件中界面元素的布局样式信息的变化情况；一个用户界面包括至少一个界面元素，一个界面元素的布局样式信息用于表征该界面元素在所述用户界面的显示状态；确定模块，用于若检测到所述界面描述文件中第一界面元素的布局样式信息发生变更，基于所述第一界面元素对应的变更后的第一布局样式信息，确定所述第一界面元素位于视图结构中的第一位置；其中，所述视图结构是基于所述界面描述文件得到的，所述视图结构包括多个节点，一个节点对应所述用户界面中一个界面元素，所述视图结构还包括各界面元素分别对应的原始布局样式信息；更新模块，用于基于所述第一位置以及所述第一布局样式信息，更新所述视图结构；调节模块，用于基于更新后的视图结构，调节所述用户界面中所述第一界面元素的显示状态。一种电子设备，包括：存储器，用于存储程序；处理器，用于执行所述程序，所述程序具体用于：监测所述用户界面对应的界面描述文件中界面元素的布局样式信息的变化情况；一个用户界面包括至少一个界面元素，一个界面元素的布局样式信息用于表征该界面元素在所述用户界面的显示状态；若检测到所述界面描述文件中第一界面元素的布局样式信息发生变更，基于所述第一界面元素对应的变更后的第一布局样式信息，确定所述第一界面元素位于视图结构中的第一位置；其中，所述视图结构是基于所述界面描述文件得到的，所述视图结构包括多个节点，一个节点对应所述用户界面中一个界面元素，所述视图结构还包括各界面元素分别对应的原始布局样式信息；基于所述第一位置以及所述第一布局样式信息，更新所述视图结构；基于更新后的视图结构，调节所述用户界面中所述第一界面元素的显示状态。经由上述的技术方案可知，与现有技术相比，本申请公开了一种用户界面的调节方法，可以实时监测用户界面对应的界面描述文件中界面元素对应的布局样式信息的变化情况，若检测到第一界面元素的布局样式信息发生变化，对视图结构中第一界面元素的布局样式信息进行更新，并基于更新后的视图结构中第一界面元素的布局样式信息调整第一界面元素在用户界面的显示状态。在此过程中，无需重新调试布局样式信息未发生变更的界面元素的显示状态，也无需重新编译界面描述文件，无需重新生成视图结构，所以可以快速的观看到布局样式信息发生变更的第一界面元素对应的调整后的显示状态，提高了开发效率。附图说明为了更清楚地说明本申请实施例或现有技术中的技术方案，下面将对实施例或现有技术描述中所需要使用的附图作简单地介绍，显而易见地，下面描述中的附图仅仅是本申请的实施例，对于本领域普通技术人员来讲，在不付出创造性劳动的前提下，还可以根据提供的附图获得其他的附图。图1为本申请实施例提供的一种用户界面的调节方法流程图；图2a-2d示例了一种调节用户界面的过程示意图；图3a-3b示例了新增界面元素导致其他已有界面元素的布局样式信息发生变化时，得到更新后的视图结构的过程示意图；图4a-4b示例了第一界面元素为已有界面元素且位于视图结构中的原始位置未变更时，得到更新后的视图结构的过程示意图；图5a-5b示例了第一界面元素为已有界面元素且位于视图结构中的原始位置变更时，得到更新后的视图结构的过程示意图；图6a-6c示例了第一界面元素为待删除界面时，得到更新后的视图结构的过程示意图；图7示例了通过句柄监测界面元素对应的布局样式信息的变化情况的过程示意图；图8示例了通过电子设备的显示区域显示第一界面元素的布局样式信息及显示状态的示意图；图9示例了一种电子设备的第二区域为第一区域的局部区域示意图；图10a-10c示例了通过触按两个区域分别对应的按键，完成第一区域与第二区域的切换的过程示意图；图11为本申请实施例提供的一种用户界面的调节装置结构示意图；图12为本申请实施例提供的一种用户界面的调节设备硬件结构框图。具体实施方式为了引用和清楚起见，下文中使用的技术名词的说明、简写或缩写总结如下：用户界面(UserInterface，UI)：软件系统的重要组成部分，可以用来接收用户的输入信息并显示程序处理的结果。界面描述(ExtensibleMarkupLanguage，XML)文件：又称可扩展标记语言文件，可以用于描述用户界面中每个界面元素在用户界面中的布局样式信息，还可以用于描述每个界面元素对应的类名、本文档来自技高网...

【技术保护点】
1.一种用户界面的调节方法，其特征在于，包括：监测所述用户界面对应的界面描述文件中界面元素的布局样式信息的变化情况；一个用户界面包括至少一个界面元素，一个界面元素的布局样式信息用于表征该界面元素在所述用户界面的显示状态；若检测到所述界面描述文件中第一界面元素的布局样式信息发生变更，基于所述第一界面元素对应的变更后的第一布局样式信息，确定所述第一界面元素位于视图结构中的第一位置；其中，所述视图结构是基于所述界面描述文件得到的，所述视图结构包括多个节点，一个节点对应所述用户界面中一个界面元素，所述视图结构还包括各界面元素分别对应的原始布局样式信息；基于所述第一位置以及所述第一布局样式信息，更新所述视图结构；基于更新后的视图结构，调节所述用户界面中所述第一界面元素的显示状态。

【技术特征摘要】
1.一种用户界面的调节方法，其特征在于，包括：监测所述用户界面对应的界面描述文件中界面元素的布局样式信息的变化情况；一个用户界面包括至少一个界面元素，一个界面元素的布局样式信息用于表征该界面元素在所述用户界面的显示状态；若检测到所述界面描述文件中第一界面元素的布局样式信息发生变更，基于所述第一界面元素对应的变更后的第一布局样式信息，确定所述第一界面元素位于视图结构中的第一位置；其中，所述视图结构是基于所述界面描述文件得到的，所述视图结构包括多个节点，一个节点对应所述用户界面中一个界面元素，所述视图结构还包括各界面元素分别对应的原始布局样式信息；基于所述第一位置以及所述第一布局样式信息，更新所述视图结构；基于更新后的视图结构，调节所述用户界面中所述第一界面元素的显示状态。2.根据权利要求1所述用户界面的调节方法，其特征在于，所述基于所述第一位置以及所述第一布局样式信息，更新所述视图结构，包括：若所述第一界面元素为所述用户界面中新增界面元素，将所述第一界面元素添加至所述视图结构中所述第一位置处，以及在所述视图结构中增加所述第一界面元素对应的第一布局样式信息，以得到更新后的视图结构；若所述第一界面元素为所述用户界面中已有界面元素，且所述第一界面元素位于所述视图结构中的原始位置为所述第一位置，将所述第一界面元素对应的原始布局样式信息更新为所述第一布局样式信息，以得到更新后的视图结构；若所述第一界面元素为所述用户界面中已有界面元素，且所述第一界面元素位于所述视图结构中的位置发生变更，将所述第一界面元素在所述视图结构中的原始位置变更为所述第一位置；将所述第一界面元素对应的原始布局样式信息更新为所述第一布局样式信息，以得到更新后的视图结构；若所述第一界面元素为所述用户界面中待删除的界面元素，删除所述视图结构中所述第一位置的所述第一界面元素，以及删除所述第一界面元素对应的原始布局样式信息，以得到更新后的视图结构。3.根据权利要求1所述用户界面的调节方法，其特征在于，所述视图结构还包括各节点之间的父子关系。4.根据权利要求3所述用户界面的调节方法，其特征在于，一个界面元素的布局样式信息包括布局信息以及样式信息；一个界面元素的布局信息表征该界面元素在所述用户界面中的位置，一个界面元素的样式信息表征该界面元素在所述用户界面的显示属性；所述第一布局样式信息包括第一布局信息以及第一样式信息；所述基于所述第一界面元素对应的变更后的第一布局样式信息，确定所述第一界面元素位于所述视图结构中的第一位置，包括：基于所述第一布局信息，获得所述第一界面元素与至少一个第二界面元素的父子关系；所述第二界面元素为所述用户界面中已有界面元素且该第二界面元素在所述视图结构中的第二位置未发生变更；基于所述第一界面元素与所述至少一个第二界面元素的父子关系，以及所述至少一个第二界面元素在所述视图结构中的第二位置，获得所述第一界面元素位于所述视图结构中的所述第一位置。5.根据权利要求4所述用户界面的调节方法，其特征在于，所述基于所述第一位置以及所述第一布局样式信息，更新所述视图结构，包括：基于更新后的视图结构中所述第一位置以及所述第一布局信息，调节所述第一界面元素位于所述用户界面的位置信息；基于更新后的视图结构中所述第一样式信...

【专利技术属性】
技术研发人员：熊浩，
申请(专利权)人：北京奇艺世纪科技有限公司，
类型：发明
国别省市：北京,11