本发明涉及ui交互界面生成的技术领域,特别是一种自动生成ui界面的方法及系统。
背景技术:
现有技术中的ui界面生成仅支持界面的预设性生成(输入一个json生成一个界面),本发明支持动态生成界面,无需预先配置;现有技术中仅支持预设的ui组件,本发明不受预设组件限制支持自定义拓展ui组件;现有技术的通用性低,只支持预设模式下使用,本发明不受预设环境限制,可通用于任意平台、开发引擎等;现有技术没有完备的ui交互处理系统,不支持处理自定义的事件,只支持预设事件的处理,更多的为换肤功能,本发明聚焦ui交互的全流程,满足各类ui交互需要,适用于各类ui使用环境;所以现有技术对生成界面的局限性高,通常只针对某一功能界面,拓展困难,无法广泛使用。
技术实现要素:
为克服上述问题,本发明的目的是提供一种基于json生成统一的通用ui数据结构,然后通过ui数据解析生成ui界面的自动生成ui界面的方法。
本发明采用以下方案实现:一种自动生成ui界面的方法,所述方法包括以下步骤:
步骤s1、输入ui面板创建数据,将拆分好的组件ui数据中提取界面生成所需的数据,再根据数据类型选择解析器或拓展处理器进行界面的生成并注册到ui交互;
步骤s2、判断是否需要进行数据转换,是,则通过数据处理进行数据转换,否,则对数据进行分发;
步骤s3、等待ui界面用户交互,对ui数据进行处理操作;
步骤s4、判断是否出发ui界面关闭的事件,是则停止,否,则继续等待ui界面用户交互。
进一步的,根据权利要求1所述的一种自动生成ui界面的方法,其特征在于:所述步骤s1进一步包括以下步骤:
步骤s11、输入ui数据与注册事件;
步骤s12、解析ui数据中的数据类型;
步骤s13、判断是否包含该ui数据类型的解析器,是,则转发ui数据到解析器中,否,则判断是否包含该ui数据的拓展处理器,是,则转发ui数据到拓展处理器,否,则返回创建失败异常,停止;
步骤s14、创建数据处理控制器,将注册事件转发到ui事件处理;
步骤s15、将数据处理器转发到解析器或拓展处理器中进行ui创建处理,基于ui数据生成界面;
步骤s16、添加事件监听到ui事件处理中,返回ui根节点;
步骤s17、记录ui根节点与其他缓存到数据处理控制器中;
步骤s18、完成ui界面创建返回数据处理控制器,停止。
进一步的,所述步骤s2中的数据处理进一步包括以下步骤:
步骤s21、输入数据,判断数据的输入类型;
步骤s22、判断数据是否是json数据,是,则将json数据识别为json实例类型;否,则判断是否为json文件路径,是,则读取文件中的json数据,否,则停止;
步骤s23、创建一个新的ui数据,将json数据中的基础数据填充到ui数据中的对应字段值中;
步骤s24、无匹配字段的数据填充到ui数据的拓展字段队列中,判断是否是根节点数据,是,则记录为根节点ui数据;否,则添加到父节点ui数据的子数据中;
步骤s25、判断json数据是否包含子数据,是,则返回创建一个新的ui数据,否,则返回创建的根节点ui数据,停止。
进一步的,所述步骤s2中的数据分发进一步具体包括以下步骤:
步骤s26、输入ui面板创建数据,判断输入数据类型;
步骤s27、判断是否为json数据,是,则将json数据转为ui数据;否,则判断是否为json文件路径,是,则读取文件并将读取的json数据转为ui数据,否,则判断是否为ui数据类型,是,则解析ui数据,否,则停止;
步骤s28、解析ui数据,将ui数据与注册事件传递给ui创建处理中,ui创建处理返回ui控制器,对ui控制器进行记录;
步骤s29、判断是否为根节点数据,是,则记录控制器为面板控制器;否,则将控制器添加到父节点控制器的子控制器集合中;
进一步的,所述步骤s3进一步具体包括以下步骤:
步骤s31、ui交互界面用户进行交互,判断是否为数据保存事件,是,则判断数据处理控制器中是否记录了数据保存的触发事件,是,则获取ui面板的数据,并迭代获取所有子控件的数据,生成完整数据,执行记录的数据保存触发事件,传递生成的完成数据,停止;否,则判定为无效事件;
步骤s32、判断是否为数据保存事件,否,则判断是否为数据还原事件,是,则将创建时的初始数据应用到ui界面中,否,则判断是否为数据变更事件;
步骤s33、判断数据处理控制器中是否记录了数据变更的触发事件,是,则执行记录的数据变更触发事件,传递还原后的数据;否,则停止;
步骤s34、判断是否为数据变更事件,是,则判断是否有注册该变更数据的监听事件;否,则判断是否注册的拓展事件;
步骤s35、判断是否注册的拓展事件,是,则,执行注册的拓展事件,传递当前触发数据;否,则判定为无效事件;
步骤s36、判断是否有注册该变更数据的监听事件,是,则执行注册的该变更数据的监听事件传递变更数据,否,则判断数据处理控制器中是否记录了数据变更的触发事件;
步骤s37、判断数据处理控制器中是否记录了数据变更的触发事件,是,则获取ui面板的数据,并迭代获取所有子控件的数据,生成完整数据,执行记录的数据变更触发事件,传递生成的完整数据,停止;否,则停止。
本发明还提供了一种自动生成ui界面的系统,包括数据分发模块、数据处理模块、ui创建模块和ui交互事件模块;所述ui创建模块,即输入ui面板创建数据,将拆分好的组件ui数据中提取界面生成所需的数据,再根据数据类型选择解析器或拓展处理器进行界面的生成并注册到ui交互;所述数据分发模块和数据处理模块,即判断是否需要进行数据转换,是,则通过数据处理模块进行数据转换,否,则经数据分发模块对数据进行分发;所述ui交互事件模块,即等待ui界面用户交互,对ui数据进行处理操作;判断是否出发ui界面关闭的事件,是则停止,否,则继续等待ui界面用户交互。
进一步的,所述ui创建模块进一步具体包括:输入单元、解析单元、解析器单元、创建单元、转发单元、添加单元、记录单元和返回单元;所述输入单元,即输入ui数据与注册事件;所述解析单元,即解析ui数据中的数据类型;所述解析器单元,即判断是否包含该ui数据类型的解析器,是,则转发ui数据到解析器中,否,则判断是否包含该ui数据的拓展处理器,是,则转发ui数据到拓展处理器,否,则返回创建失败异常,停止;所述创建单元,即创建数据处理控制器,将注册事件转发到ui事件处理;所述转发单元,即将数据处理器转发到解析器或拓展处理器中进行ui创建处理,基于ui数据生成界面;所述添加单元,即添加事件监听到ui事件处理中,返回ui根节点;所述记录单元,即记录ui根节点与其他缓存到数据处理控制器中;所述返回单元,即完成ui界面创建返回数据处理控制器,停止。
进一步的,所述数据处理模块进一步包括:判断类型单元、数据判断单元、填充单元、根节点单元和子数据单元;所述判断类型单元,即输入数据,判断数据的输入类型;所述数据判断单元,即判断数据是否是json数据,是,则将json数据识别为json实例类型;否,则判断是否为json文件路径,是,则读取文件中的json数据,否,则停止;所述填充单元,即创建一个新的ui数据,将json数据中的基础数据填充到ui数据中的对应字段值中;所述根节点单元,即无匹配字段的数据填充到ui数据的拓展字段队列中,判断是否是根节点数据,是,则记录为根节点ui数据;否,则添加到父节点ui数据的子数据中;所述子数据单元,即判断json数据是否包含子数据,是,则返回创建一个新的ui数据,否,则返回创建的根节点ui数据,停止。
本发明的有益效果在于:本发明通过将json数据转换为统一的通用ui数据,通过ui数据实现ui界面的自动生成,并通过ui交互事件模块实现完备的ui交互流程;本发明通过json数据或动态构建的通用ui数据生成界面,减少了ui生产和开发消耗,缩短了ui开发周期,加快了开发进度;且使用本发明生产的ui界面具有统一的风格,更少的界面文件与代码,更易维护,后期维护成本更低;本发明中的ui交互事件模块提供了基础事件,且支持自定义事件的拓展,可以满足各类应用场景的需要。
附图说明
图1是本发明的方法流程示意图。
图2是本发明的系统原理框图。
图3为ui创建模块的流程框图。
图4为数据处理模块的流程框图。
图5为数据分发模块的流程框图。
图6为ui交互事件模块的流程框图。
具体实施方式
下面结合附图对本发明做进一步说明。
请参阅图1所示,本发明的一种自动生成ui界面的方法,所述方法包括以下步骤:
下面通过一具体实施例对本发明做进一步说明:
请参阅图5所示,数据分发模块;
该模块为本发明的主入口,通过提取传入的ui面板创建数据中的有效数据,调用数据处理模块转换为有效的ui数据,进而将ui数据与其它注册事件分发并传递给ui创建模块,实现ui的创建过程。
有效数据定义:传入的数据中可能包含为空的数据、无法识别的数据,我们将其进行过滤,其余的数据视为有效数据。
请参阅图4所示,数据处理模块;
该模块为数据分发模块提供数据转换的能力,实现将json数据或json文件路径转换为统一的ui数据。
请参阅图3所示,ui创建模块;
该模块为核心ui生成过程,将拆分好的组件ui数据中提取界面生成所需的数据,进而根据数据类型选择解析器或拓展处理器进行界面的生成并注册事件到ui交互事件模块。
拆分好的组件ui数据定义:在数据分发模块,会将一个完整的ui数据拆分成多个子组件ui数据进行分发,每个子组件ui数据对应一个生成控件。
所需数据定义:ui组件生成中需要使用的拓展参数数据,比如界面宽高等界面配置数据、数值改变按钮点击等ui交互的触发事件。
数据类型定义:每个ui数据中包含一个type字段来描述对应组件类型,每个组件中包含一个type字段与它进行对应匹配。
请参阅图6所示,ui交互事件模块;
该模块实现创建的ui界面提供ui交互能力实现数据保存事件、数据还原事件、数据变更事件、拓展事件等事件的处理过程,完成整个ui交互的需要。
事件的注册与触发流程定义:生成的ui界面中我们会对每个可交互的ui控件(按钮、输入框、选项等)进行事件的注册,比如当按钮注册的事件为数据保存事件时,按钮被点击将触发数据保存事件。
总之,本发明基于json生成统一的通用ui数据结构,然后通过ui数据解析生成ui界面。当收到ui交互指令时时触发处理事件,实现完备的ui交互系统。
请参阅图2所示,本发明还提供了一种自动生成ui界面的系统,包括数据分发模块、数据处理模块、ui创建模块和ui交互事件模块;所述ui创建模块,即输入ui面板创建数据,将拆分好的组件ui数据中提取界面生成所需的数据,再根据数据类型选择解析器或拓展处理器进行界面的生成并注册到ui交互;所述数据分发模块和数据处理模块,即判断是否需要进行数据转换,是,则通过数据处理模块进行数据转换,否,则经数据分发模块对数据进行分发;所述ui交互事件模块,即等待ui界面用户交互,对ui数据进行处理操作;判断是否出发ui界面关闭的事件,是则停止,否,则继续等待ui界面用户交互。
请参阅图3所示,所述ui创建模块进一步具体包括:输入单元、解析单元、解析器单元、创建单元、转发单元、添加单元、记录单元和返回单元;所述输入单元,即输入ui数据与注册事件;所述解析单元,即解析ui数据中的数据类型;所述解析器单元,即判断是否包含该ui数据类型的解析器,是,则转发ui数据到解析器中,否,则判断是否包含该ui数据的拓展处理器,是,则转发ui数据到拓展处理器,否,则返回创建失败异常,停止;所述创建单元,即创建数据处理控制器,将注册事件转发到ui事件处理;所述转发单元,即将数据处理器转发到解析器或拓展处理器中进行ui创建处理,基于ui数据生成界面;所述添加单元,即添加事件监听到ui事件处理中,返回ui根节点;所述记录单元,即记录ui根节点与其他缓存到数据处理控制器中;所述返回单元,即完成ui界面创建返回数据处理控制器,停止。
请参阅图4所示,所述数据处理模块进一步包括:判断类型单元、数据判断单元、填充单元、根节点单元和子数据单元;所述判断类型单元,即输入数据,判断数据的输入类型;所述数据判断单元,即判断数据是否是json数据,是,则将json数据识别为json实例类型;否,则判断是否为json文件路径,是,则读取文件中的json数据,否,则停止;所述填充单元,即创建一个新的ui数据,将json数据中的基础数据填充到ui数据中的对应字段值中;所述根节点单元,即无匹配字段的数据填充到ui数据的拓展字段队列中,判断是否是根节点数据,是,则记录为根节点ui数据;否,则添加到父节点ui数据的子数据中;所述子数据单元,即判断json数据是否包含子数据,是,则返回创建一个新的ui数据,否,则返回创建的根节点ui数据,停止。
以上所述仅为本发明的较佳实施例,凡依本发明申请专利范围所做的均等变化与修饰,皆应属本发明的涵盖范围。