CN114461204A - 一种将多层级对象数据翻译为原生代码的开发系统和方法 - Google Patents
一种将多层级对象数据翻译为原生代码的开发系统和方法 Download PDFInfo
- Publication number
- CN114461204A CN114461204A CN202210380014.5A CN202210380014A CN114461204A CN 114461204 A CN114461204 A CN 114461204A CN 202210380014 A CN202210380014 A CN 202210380014A CN 114461204 A CN114461204 A CN 114461204A
- Authority
- CN
- China
- Prior art keywords
- data
- component
- page
- value
- editor
- Prior art date
- Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
- Granted
Links
- 238000000034 method Methods 0.000 title claims abstract description 42
- 238000011161 development Methods 0.000 title claims abstract description 32
- 230000000007 visual effect Effects 0.000 claims abstract description 29
- 238000013519 translation Methods 0.000 claims abstract description 28
- 238000012545 processing Methods 0.000 claims abstract description 14
- 230000003068 static effect Effects 0.000 claims abstract description 6
- 238000012986 modification Methods 0.000 claims description 73
- 230000004048 modification Effects 0.000 claims description 72
- 238000009877 rendering Methods 0.000 claims description 28
- 238000004458 analytical method Methods 0.000 claims description 17
- 238000003860 storage Methods 0.000 claims description 15
- 230000003993 interaction Effects 0.000 claims description 14
- 230000008569 process Effects 0.000 claims description 14
- 230000006870 function Effects 0.000 claims description 13
- 125000006850 spacer group Chemical group 0.000 claims description 12
- 230000008859 change Effects 0.000 claims description 7
- 230000000712 assembly Effects 0.000 claims description 6
- 238000000429 assembly Methods 0.000 claims description 6
- 238000012544 monitoring process Methods 0.000 claims description 6
- 238000003672 processing method Methods 0.000 claims description 6
- 239000013589 supplement Substances 0.000 claims description 6
- 230000001960 triggered effect Effects 0.000 claims description 6
- 238000012937 correction Methods 0.000 claims description 5
- 230000004044 response Effects 0.000 claims description 5
- 230000014759 maintenance of location Effects 0.000 claims description 4
- 238000010586 diagram Methods 0.000 description 8
- 230000009471 action Effects 0.000 description 4
- 230000001419 dependent effect Effects 0.000 description 3
- 238000004519 manufacturing process Methods 0.000 description 3
- 238000005457 optimization Methods 0.000 description 3
- 238000012800 visualization Methods 0.000 description 2
- 230000009286 beneficial effect Effects 0.000 description 1
- 230000005540 biological transmission Effects 0.000 description 1
- 238000005282 brightening Methods 0.000 description 1
- 238000006243 chemical reaction Methods 0.000 description 1
- 238000010276 construction Methods 0.000 description 1
- 238000013499 data model Methods 0.000 description 1
- 230000000694 effects Effects 0.000 description 1
- 230000006872 improvement Effects 0.000 description 1
- 238000012423 maintenance Methods 0.000 description 1
- 239000000463 material Substances 0.000 description 1
- 230000007246 mechanism Effects 0.000 description 1
- 239000000047 product Substances 0.000 description 1
- 230000009466 transformation Effects 0.000 description 1
Images
Classifications
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F8/00—Arrangements for software engineering
- G06F8/30—Creation or generation of source code
- G06F8/34—Graphical or visual programming
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F8/00—Arrangements for software engineering
- G06F8/30—Creation or generation of source code
- G06F8/38—Creation or generation of source code for implementing user interfaces
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F8/00—Arrangements for software engineering
- G06F8/40—Transformation of program code
- G06F8/41—Compilation
- G06F8/42—Syntactic analysis
- G06F8/427—Parsing
Landscapes
- Engineering & Computer Science (AREA)
- Software Systems (AREA)
- General Engineering & Computer Science (AREA)
- Theoretical Computer Science (AREA)
- Physics & Mathematics (AREA)
- General Physics & Mathematics (AREA)
- Human Computer Interaction (AREA)
- User Interface Of Digital Computer (AREA)
Abstract
本发明公开了一种将多层级对象数据翻译为原生代码的开发系统和方法,属于数据处理技术领域。本系统包括可视化编辑器、资源中心、数据中心、解析器、转换器、生成器、代码仓库:利用可视化编辑器通过拖动及属性设置的方式修改页面数据;利用资源中心统筹所有静态的资源数据;利用数据中心对用户产生的数据和资源数据管理;利用解析器解析数据中心元数据,生成抽象模型;利用转换器将抽象模型转换成实际端的模型;利用生成器遍历模型数据,调用各个端生成器生成相应代码;利用代码仓库将生成器生成的代码推到对应仓库。本发明在框架升级时只需要改翻译模块即可生成新的代码,不需要手工迁移代码,能够解决手工代码日益冗余的问题。
Description
技术领域
本发明涉及数据处理技术领域,具体为一种将多层级对象数据翻译为原生代码的开发系统和方法。
背景技术
多层级对象数据是一种嵌套层次比较深的复杂对象,主要用于描述系统的元素、物料、插件等。该数据记载了页面中各类信息,并与资源数据关联,最终会持久化到数据库中。比如组件数据,需记录该组件的元数据,组件属性数据,组件绑定关系等,而最终被翻译模块消费生成源代码。
在现有技术发展中,企业数字化转型加大了对低代码的需求,传统业务开发周期较长,且成本较高,需要专业的程序员开发及维护,成本过高。目前市面上的低代码多为生成配置数据,强依赖平台本身,对于私有化部署有较大门槛。同时配置数据对于逻辑性很强的交互或者业务是难以胜任的。
发明内容
本发明的目的在于提供一种将多层级对象数据翻译为原生代码的开发系统和方法,以解决上述背景技术中提出的问题。
为了解决上述技术问题,本发明提供如下技术方案:
一种将多层级对象数据翻译为原生代码的开发方法,该方法包括以下步骤:
S1、可视化编辑器通过拖动及属性设置的方式修改页面数据并实时进行预览;
S2、利用资源中心统筹所有静态的资源数据,拉取资源及缓存至数据中心,数据中心管理用户产生的数据和资源数据,将配置及插件初始化,对响应式的数据通过控制器对外暴露修改接口;
S3、利用解析器解析数据中心元数据,生成抽象模型,所述抽象模型为一个树形结构,抽象模型中包含翻译需要的数据;
S4、利用转换器将抽象模型转换成实际端的模型,并配置修正属性和逻辑块,利用生成器遍历模型数据,调用各个端生成器生成相应代码,通过代码仓库将生成器生成的代码推到对应仓库。
根据上述技术方案,所述可视化编辑器包括视图编辑器、逻辑编辑器;
所述视图编辑器负责组件树的实时渲染,属性修改和逻辑绑定;
所述渲染代理模块用于在渲染层构建一个代理的虚拟节点专门负责监听该虚拟节点的数据变化,然后重绘真实的渲染节点;所述交互模块用于属性修改,并传输至控制器;所述事件处理模块用于代理所有真实dom节点事件,然后根据事件类型和操作的节点触发相应命令,通过控制器去实际操作组件树;所述控制器用于维护所有响应式数据的引用,并保留操作历史用于回退用户操作;
所述逻辑编辑器底层使用了开源的Blockly编辑器,通过拖拽的方式,生成业务处理方法,在逻辑编排中添加了结构化定义、自动翻译和用户行为推测;
所述结构化定义用于帮助用户推断数据类型、增加生成代码的鲁棒性;所述自动翻译用于让用户自由命名函数或变量,在逻辑编辑器内部会翻译成语义化的命名;所述行为推测用于在用户触发特定操作时,逻辑编辑器自动帮特定操作构建部分逻辑,用户只需要补充其中可变的逻辑空缺。
根据上述技术方案,所述生成器在翻译过程中边翻译边进行依赖收集,并对依赖的版本兼容性进行合并和修正,生成完的代码在语义上有歧异或不符合用户理解的语法,会统一转换成抽象语法树进行修改,最终生成目标代码。
根据上述技术方案,所述可视化编辑器包括有组件配置模块;
所述可视化编辑器通过拖动及属性设置的方式修改页面数据包括:
通过组件配置模块在可视化编辑器编辑组件的过程中,对组件在画板上的位置进行分析。
根据上述技术方案,所述组件配置模块还包括组件分析子模块、组件分析子模块;
所述组件分析子模块还包括有历史数据库;
所述历史数据库存储组件属性修改时的管理员每一次的页面停留时间、页面操作顺序、组件与页面比例值:
对历史数据库中存储管理员每一次的页面停留时间、页面操作顺序、组件与页面比例值进行归一化处理,以管理员每一次的页面停留时间、页面操作顺序、组件与页面比例值的归一化值为自变量,构建回归方程:
所述画板规划子模块还包括:
获取历史数据库中组件修改的属性;所述属性包括大小、颜色、位置;
以平均值作为属性修改的标准值,获取当前属性修改的预测值;所述预测值中包括大小修改值、位置移动概率;
根据任意两组件之间的间隔区域对画板进行排列,生成显示框,在管理员进行拖拽操作时亮起,指引管理员操作。
在上述技术方案中,利用页面停留时间与页面操作顺序判断管理员的页面使用习惯,对其进行属性修改的个性化进行分析,利用组件与页面比例值进行加权分析属性修改的概率,因为一般在组件页面的比例值较大的情况下,图形配置并不符合常规配置,因此管理员会进行属性修改,调节组件大小与位置,而在调节过程中,由于各组件之间的距离不好把控,容易出现误触现象,需要管理员多次人工调节位置,降低工作效率并且也极其不方便。
一种将多层级对象数据翻译为原生代码的开发系统,该系统包括可视化编辑器、资源中心、数据中心、解析器、转换器、生成器、代码仓库:
所述可视化编辑器用于通过拖动及属性设置的方式修改页面数据并实时进行预览;所述资源中心用于统筹所有静态的资源数据;如组件属性,方法块的配置等,这些资源大都存在版本控制,为了加快加载速度,本地会对已加载的资源进行缓存;而某些资源的升级需要迁移用户数据,资源中心会进行数据修正。所述数据中心用于对用户产生的数据和资源数据管理,将配置及插件初始化,对响应式的数据通过控制器对外暴露修改接口;所述解析器用于解析数据中心元数据,生成抽象模型,所述抽象模型为一个树形结构,抽象模型中包含翻译需要的数据;所述转换器用于将抽象模型转换成实际端的模型,并配置修正属性和逻辑块;所述生成器用于遍历模型数据,调用各个端生成器生成相应代码;所述代码仓库用于将生成器生成的代码推到对应仓库。
根据上述技术方案,所述可视化编辑器包括视图编辑器、逻辑编辑器;
所述视图编辑器负责组件树的实时渲染,属性修改和逻辑绑定;所述视图编辑器包括渲染代理模块、交互模块、控制器、事件处理模块、组件树;
所述渲染代理模块用于在渲染层构建一个代理的虚拟节点专门负责监听该虚拟节点的数据变化,然后重绘真实的渲染节点;所述交互模块用于属性修改,并传输至控制器;所述事件处理模块用于代理所有真实dom节点事件,然后根据事件类型和操作的节点触发相应命令,通过控制器去实际操作组件树;所述控制器用于维护所有响应式数据的引用,并保留操作历史用于回退用户操作;
所述逻辑编辑器底层使用了开源的Blockly编辑器,通过拖拽的方式,生成业务处理方法,在逻辑编排中添加了结构化定义、自动翻译和用户行为推测;
所述结构化定义用于帮助用户推断数据类型、增加生成代码的鲁棒性;所述自动翻译用于让用户自由命名函数或变量,在逻辑编辑器内部会翻译成语义化的命名;所述行为推测用于在用户触发特定操作时,逻辑编辑器自动帮特定操作构建部分逻辑,用户只需要补充其中可变的逻辑空缺。
根据上述技术方案,所述生成器在翻译过程中边翻译边进行依赖收集,并对依赖的版本兼容性进行合并和修正,生成完的代码在语义上有歧异或不符合用户理解的语法,会统一转换成抽象语法树进行修改,最终生成目标代码。
根据上述技术方案,所述视图编辑器还包括有组件配置模块;
所述组件配置模块用于在可视化编辑器编辑组件的过程中,对组件在画板上的位置进行分析,保证容纳组件数量最多的同时不出现覆盖和误触情况;
所述组件配置模块包括组件分析子模块、画板规划子模块;
所述组件分析子模块用于根据页面停留时间、页面操作顺序、组件与页面比例值生成预测组件属性修改概率;所述画板规划子模块用于根据预测组件属性修改概率对画板布局进行规划,显示各组件的拖拽位置。
根据上述技术方案,所述组件分析子模块还包括有历史数据库;
所述历史数据库存储组件属性修改时的管理员每一次的页面停留时间、页面操作顺序、组件与页面比例值:
对历史数据库中存储管理员每一次的页面停留时间、页面操作顺序、组件与页面比例值进行归一化处理,以管理员每一次的页面停留时间、页面操作顺序、组件与页面比例值的归一化值为自变量,构建回归方程:
所述画板规划子模块还包括:
获取历史数据库中组件修改的属性;所述属性包括大小、颜色、位置;
以平均值作为属性修改的标准值,获取当前属性修改的预测值;所述预测值中包括大小修改值、位置移动概率;
根据任意两组件之间的间隔区域对画板进行排列,生成显示框,在管理员进行拖拽操作时亮起,指引管理员操作。
为了提高效率减少数据传输,会拉取相应远端仓库的代码进行差异比较,最终生成仓库的提交动作,将代码推到仓库中
与现有技术相比,本发明所达到的有益效果是:
本发明中可视化编辑器通过拖动及属性设置的方式修改页面数据并实时进行预览。通过可视化逻辑块的拖动生成逻辑方法,并与视图进行绑定从而完成复杂业务逻辑。代码通过解析、转换和生成最终生成源代码。生成器通过插件机制,以获得良好的扩展性。制作过程通过算法的优化和智能标注以达到良好的性能和极高的制作效率;
本发明提供了可视化的交互,降低使用门槛,让普通的用户通过拖拽即可完成业务逻辑的搭建,大大提高生产效率;提供了自动的逻辑伸缩,根据用户的操作自动帮用户生成逻辑和绑定关系;基于Blockly二次开发,提供了一套逻辑编排引擎,用于处理复杂业务逻辑;同时平台底层对标原生代码,几乎所有业务都能完成,并且由于直接产生源代码,私有化部署或者源码交付更加简单;另外生成代码对标实际手工代码,翻译过程中会对函数或者变量名称进行语义化处理,基于抽象的数据模型,如果框架升级只需要改翻译模块即可生成新的代码,不需要手工迁移代码;
本发明还能够解决手工代码日益冗余的问题,利用本系统可自动分析逻辑和视图等引用关系,一键删除冗余变量和方法;在性能优化方面,如样式,逻辑等,只需要在翻译层做一遍优化,整个项目都能得到提升;
本发明还提供页面与画板的优化方式,对组件大小、位置及属性修改概率进行预测,提高工作效率,进一步提升系统的简便性。
附图说明
附图用来提供对本发明的进一步理解,并且构成说明书的一部分,与本发明的实施例一起用于解释本发明,并不构成对本发明的限制。在附图中:
图1是本发明一种将多层级对象数据翻译为原生代码的开发系统的整体结构示意图;
图2是本发明一种将多层级对象数据翻译为原生代码的开发系统的视图编辑器结构示意图;
图3是本发明一种将多层级对象数据翻译为原生代码的开发系统的逻辑编辑器结构示意图;
图4是本发明一种将多层级对象数据翻译为原生代码的开发系统的数据结构流程示意图;
图5是本发明一种将多层级对象数据翻译为原生代码的开发系统的基础模型示意图;
图6是本发明一种将多层级对象数据翻译为原生代码的开发系统的实施例页面添加示意图;
图7是本发明一种将多层级对象数据翻译为原生代码的开发系统的实施例逻辑编辑器示意图;
图8是本发明一种将多层级对象数据翻译为原生代码的开发系统的实施例代码保存示意图。
具体实施方式
下面将结合本发明实施例中的附图,对本发明实施例中的技术方案进行清楚、完整地描述,显然,所描述的实施例仅仅是本发明一部分实施例,而不是全部的实施例。基于本发明中的实施例,本领域普通技术人员在没有做出创造性劳动前提下所获得的所有其他实施例,都属于本发明保护的范围。
请参阅图1-图8,在本实施例1中:
一种将多层级对象数据翻译为原生代码的开发方法,该方法包括以下步骤:
S1、可视化编辑器通过拖动及属性设置的方式修改页面数据并实时进行预览;
S2、利用资源中心统筹所有静态的资源数据,拉取资源及缓存至数据中心,数据中心管理用户产生的数据和资源数据,将配置及插件初始化,对响应式的数据通过控制器对外暴露修改接口;
S3、利用解析器解析数据中心元数据,生成抽象模型,所述抽象模型为一个树形结构,抽象模型中包含翻译需要的数据;
S4、利用转换器将抽象模型转换成实际端的模型,并配置修正属性和逻辑块,利用生成器遍历模型数据,调用各个端生成器生成相应代码,通过代码仓库将生成器生成的代码推到对应仓库。
所述可视化编辑器包括视图编辑器、逻辑编辑器;
所述视图编辑器负责组件树的实时渲染,属性修改和逻辑绑定;
所述渲染代理模块用于在渲染层构建一个代理的虚拟节点专门负责监听该虚拟节点的数据变化,然后重绘真实的渲染节点;所述交互模块用于属性修改,并传输至控制器;所述事件处理模块用于代理所有真实dom节点事件,然后根据事件类型和操作的节点触发相应命令,通过控制器去实际操作组件树;所述控制器用于维护所有响应式数据的引用,并保留操作历史用于回退用户操作;
所述逻辑编辑器底层使用了开源的Blockly编辑器,通过拖拽的方式,生成业务处理方法,在逻辑编排中添加了结构化定义、自动翻译和用户行为推测;
所述结构化定义用于帮助用户推断数据类型、增加生成代码的鲁棒性;所述自动翻译用于让用户自由命名函数或变量,在逻辑编辑器内部会翻译成语义化的命名;所述行为推测用于在用户触发特定操作时,逻辑编辑器自动帮特定操作构建部分逻辑,用户只需要补充其中可变的逻辑空缺。
所述生成器在翻译过程中边翻译边进行依赖收集,并对依赖的版本兼容性进行合并和修正,生成完的代码在语义上有歧异或不符合用户理解的语法,会统一转换成抽象语法树进行修改,最终生成目标代码。
所述可视化编辑器包括有组件配置模块;
所述可视化编辑器通过拖动及属性设置的方式修改页面数据包括:
通过组件配置模块在可视化编辑器编辑组件的过程中,对组件在画板上的位置进行分析。
所述组件配置模块还包括组件分析子模块、组件分析子模块;
所述组件分析子模块还包括有历史数据库;
所述历史数据库存储组件属性修改时的管理员每一次的页面停留时间、页面操作顺序、组件与页面比例值:
对历史数据库中存储管理员每一次的页面停留时间、页面操作顺序、组件与页面比例值进行归一化处理,以管理员每一次的页面停留时间、页面操作顺序、组件与页面比例值的归一化值为自变量,构建回归方程:
所述画板规划子模块还包括:
获取历史数据库中组件修改的属性;所述属性包括大小、颜色、位置;
以平均值作为属性修改的标准值,获取当前属性修改的预测值;所述预测值中包括大小修改值、位置移动概率;
根据任意两组件之间的间隔区域对画板进行排列,生成显示框,在管理员进行拖拽操作时亮起,指引管理员操作。
利用本系统生成代码流程如下:
新建页面:
进入可视化编辑器,点击“页面”标签的右上角“加号”图标,可创建一个新的页面;“双击”页面名称可以打开页面;“单击”页面名称可以编辑页面名称;“右击”页面名称,可以看到更多操作,如图5所示
编辑页面:
打开页面,页面左侧为“资源栏”,你可以拖动“组件”放置到中间的空白部分,我们称之为 “画板”,在制作 web 时,你可以认为它是用户的浏览器窗口。
视图编辑器:
当“组件”被放置到“画板”上面后,鼠标单击即可选中组件,在右侧会展示该组件的相关 “属性”、“交互”、“控制”、“注释”。通过这些设置,你可以控制你的“组件”的表达形式。通过各种“组件”的组合,会呈现出完全不同的效果。
逻辑编辑器:
逻辑是整个页面的一个部分,它和视图部分相互影响,共同实现产品意图。
点击顶部的“逻辑”按钮,会弹出“逻辑编辑器”。
创建编辑方法:
在右下角创建一个方法,这个方法可以被视图部分的组件交互所调用,也可以被“过程” (生命周期)所调用。
创建使用变量:
如果你的方法使用到了变量,你可以在左下角切换到“变量”标签,创建你所需要的变量。
保存:
应用的保存支持快捷键“ctrl/command+s”,这是一种快速保存方式,会将你制作的数据快速保存,但不会生成代码。点击右上角的“保存”按钮,输入“变更描述”,可以生成代码。
在本实施例2中:
一种将多层级对象数据翻译为原生代码的开发系统,该系统包括可视化编辑器、资源中心、数据中心、解析器、转换器、生成器、代码仓库:
可视化编辑器包括视图编辑器、逻辑编辑器;
视图编辑器负责组件树的实时渲染,属性修改和逻辑绑定;视图编辑器包括渲染代理模块、交互模块、控制器、事件处理模块、组件树;
渲染代理模块用于在渲染层构建一个代理的虚拟节点专门负责监听该虚拟节点的数据变化,然后重绘真实的渲染节点;交互模块用于属性修改,并传输至控制器;事件处理模块用于代理所有真实dom节点事件,然后根据事件类型和操作的节点触发相应命令,通过控制器去实际操作组件树;控制器用于维护所有响应式数据的引用,并保留操作历史用于回退用户操作;
逻辑编辑器底层使用了开源的Blockly编辑器,通过拖拽的方式,生成业务处理方法,在逻辑编排中添加了结构化定义、自动翻译和用户行为推测;
结构化定义用于帮助用户推断数据类型、增加生成代码的鲁棒性;自动翻译用于让用户自由命名函数或变量,在逻辑编辑器内部会翻译成语义化的命名;行为推测用于在用户触发特定操作时,逻辑编辑器自动帮特定操作构建部分逻辑,用户只需要补充其中可变的逻辑空缺。
生成器在翻译过程中边翻译边进行依赖收集,并对依赖的版本兼容性进行合并和修正,生成完的代码在语义上有歧异或不符合用户理解的语法,会统一转换成抽象语法树进行修改,最终生成目标代码。
视图编辑器还包括有组件配置模块;
组件配置模块包括组件分析子模块、画板规划子模块;
组件分析子模块还包括有历史数据库;
历史数据库存储组件属性修改时的管理员每一次的页面停留时间、页面操作顺序、组件与页面比例值:
对历史数据库中存储管理员每一次的页面停留时间、页面操作顺序、组件与页面比例值进行归一化处理,以管理员每一次的页面停留时间、页面操作顺序、组件与页面比例值的归一化值为自变量,构建回归方程:
画板规划子模块还包括:
获取历史数据库中组件修改的属性;所述属性包括大小、颜色、位置;
以平均值作为属性修改的标准值,获取当前属性修改的预测值;所述预测值中包括大小修改值、位置移动概率;
根据任意两组件之间的间隔区域对画板进行排列,生成显示框,在管理员进行拖拽操作时亮起,指引管理员操作。
需要说明的是,在本文中,诸如第一和第二等之类的关系术语仅仅用来将一个实体或者操作与另一个实体或操作区分开来,而不一定要求或者暗示这些实体或操作之间存在任何这种实际的关系或者顺序。而且,术语“包括”、“包含”或者其任何其他变体意在涵盖非排他性的包含,从而使得包括一系列要素的过程、方法、物品或者设备不仅包括那些要素,而且还包括没有明确列出的其他要素,或者是还包括为这种过程、方法、物品或者设备所固有的要素。
最后应说明的是:以上所述仅为本发明的优选实施例而已,并不用于限制本发明,尽管参照前述实施例对本发明进行了详细的说明,对于本领域的技术人员来说,其依然可以对前述各实施例所记载的技术方案进行修改,或者对其中部分技术特征进行等同替换。凡在本发明的精神和原则之内,所作的任何修改、等同替换、改进等,均应包含在本发明的保护范围之内。
Claims (10)
1.一种将多层级对象数据翻译为原生代码的开发方法,其特征在于:该方法包括以下步骤:
S1、可视化编辑器通过拖动及属性设置的方式修改页面数据并实时进行预览;
S2、利用资源中心统筹所有静态的资源数据,拉取资源及缓存至数据中心,数据中心管理用户产生的数据和资源数据,将配置及插件初始化,对响应式的数据通过控制器对外暴露修改接口;
S3、利用解析器解析数据中心元数据,生成抽象模型,所述抽象模型为一个树形结构,抽象模型中包含翻译需要的数据;
S4、利用转换器将抽象模型转换成实际端的模型,并配置修正属性和逻辑块,利用生成器遍历模型数据,调用各个端生成器生成相应代码,通过代码仓库将生成器生成的代码推到对应仓库。
2.根据权利要求1所述的一种将多层级对象数据翻译为原生代码的开发方法,其特征在于:所述可视化编辑器包括视图编辑器、逻辑编辑器;
所述视图编辑器负责组件树的实时渲染,属性修改和逻辑绑定;所述视图编辑器包括渲染代理模块、交互模块、控制器、事件处理模块、组件树;
所述渲染代理模块用于在渲染层构建一个代理的虚拟节点专门负责监听该虚拟节点的数据变化,然后重绘真实的渲染节点;所述交互模块用于属性修改,并传输至控制器;所述事件处理模块用于代理所有真实dom节点事件,然后根据事件类型和操作的节点触发相应命令,通过控制器去实际操作组件树;所述控制器用于维护所有响应式数据的引用,并保留操作历史用于回退用户操作;
所述逻辑编辑器底层使用了开源的Blockly编辑器,通过拖拽的方式,生成业务处理方法,在逻辑编排中添加了结构化定义、自动翻译和用户行为推测;
所述结构化定义用于帮助用户推断数据类型、增加生成代码的鲁棒性;所述自动翻译用于让用户自由命名函数或变量,在逻辑编辑器内部会翻译成语义化的命名;所述行为推测用于在用户触发特定操作时,逻辑编辑器自动帮特定操作构建部分逻辑,用户只需要补充其中可变的逻辑空缺。
3.根据权利要求1所述的一种将多层级对象数据翻译为原生代码的开发方法,其特征在于:所述生成器在翻译过程中边翻译边进行依赖收集,并对依赖的版本兼容性进行合并和修正,生成完的代码在语义上有歧异或不符合用户理解的语法,会统一转换成抽象语法树进行修改,最终生成目标代码。
4.根据权利要求1所述的一种将多层级对象数据翻译为原生代码的开发方法,其特征在于:所述可视化编辑器包括有组件配置模块;
所述可视化编辑器通过拖动及属性设置的方式修改页面数据包括:
通过组件配置模块在可视化编辑器编辑组件的过程中,对组件在画板上的位置进行分析。
5.根据权利要求4所述的一种将多层级对象数据翻译为原生代码的开发方法,其特征在于:所述组件配置模块还包括组件分析子模块、组件分析子模块;
所述组件分析子模块还包括有历史数据库;
所述历史数据库存储组件属性修改时的管理员每一次的页面停留时间、页面操作顺序、组件与页面比例值:
对历史数据库中存储管理员每一次的页面停留时间、页面操作顺序、组件与页面比例值进行归一化处理,以管理员每一次的页面停留时间、页面操作顺序、组件与页面比例值的归一化值为自变量,构建回归方程:
所述画板规划子模块还包括:
获取历史数据库中组件修改的属性;所述属性包括大小、颜色、位置;
以平均值作为属性修改的标准值,获取当前属性修改的预测值;所述预测值中包括大小修改值、位置移动概率;
根据任意两组件之间的间隔区域对画板进行排列,生成显示框,在管理员进行拖拽操作时亮起,指引管理员操作。
6.一种将多层级对象数据翻译为原生代码的开发系统,其特征在于:该系统包括可视化编辑器、资源中心、数据中心、解析器、转换器、生成器、代码仓库:
所述可视化编辑器用于通过拖动及属性设置的方式修改页面数据并实时进行预览;所述资源中心用于统筹所有静态的资源数据;所述数据中心用于对用户产生的数据和资源数据管理,将配置及插件初始化,对响应式的数据通过控制器对外暴露修改接口;所述解析器用于解析数据中心元数据,生成抽象模型,所述抽象模型为一个树形结构,抽象模型中包含翻译需要的数据;所述转换器用于将抽象模型转换成实际端的模型,并配置修正属性和逻辑块;所述生成器用于遍历模型数据,调用各个端生成器生成相应代码;所述代码仓库用于将生成器生成的代码推到对应仓库。
7.根据权利要求6所述的一种将多层级对象数据翻译为原生代码的开发系统,其特征在于:所述可视化编辑器包括视图编辑器、逻辑编辑器;
所述视图编辑器负责组件树的实时渲染,属性修改和逻辑绑定;所述视图编辑器包括渲染代理模块、交互模块、控制器、事件处理模块、组件树;
所述渲染代理模块用于在渲染层构建一个代理的虚拟节点专门负责监听该虚拟节点的数据变化,然后重绘真实的渲染节点;所述交互模块用于属性修改,并传输至控制器;所述事件处理模块用于代理所有真实dom节点事件,然后根据事件类型和操作的节点触发相应命令,通过控制器去实际操作组件树;所述控制器用于维护所有响应式数据的引用,并保留操作历史用于回退用户操作;
所述逻辑编辑器底层使用了开源的Blockly编辑器,通过拖拽的方式,生成业务处理方法,在逻辑编排中添加了结构化定义、自动翻译和用户行为推测;
所述结构化定义用于帮助用户推断数据类型、增加生成代码的鲁棒性;所述自动翻译用于让用户自由命名函数或变量,在逻辑编辑器内部会翻译成语义化的命名;所述行为推测用于在用户触发特定操作时,逻辑编辑器自动帮特定操作构建部分逻辑,用户只需要补充其中可变的逻辑空缺。
8.根据权利要求6所述的一种将多层级对象数据翻译为原生代码的开发系统,其特征在于:所述生成器在翻译过程中边翻译边进行依赖收集,并对依赖的版本兼容性进行合并和修正,生成完的代码在语义上有歧异或不符合用户理解的语法,会统一转换成抽象语法树进行修改,最终生成目标代码。
9.根据权利要求7所述的一种将多层级对象数据翻译为原生代码的开发系统,其特征在于:所述视图编辑器还包括有组件配置模块;
所述组件配置模块用于在可视化编辑器编辑组件的过程中,对组件在画板上的位置进行分析;
所述组件配置模块包括组件分析子模块、画板规划子模块;
所述组件分析子模块用于根据页面停留时间、页面操作顺序、组件与页面比例值生成预测组件属性修改概率;所述画板规划子模块用于根据预测组件属性修改概率对画板布局进行规划,显示各组件的拖拽位置。
10.根据权利要求9所述的一种将多层级对象数据翻译为原生代码的开发系统,其特征在于:
所述组件分析子模块还包括有历史数据库;
所述历史数据库存储组件属性修改时的管理员每一次的页面停留时间、页面操作顺序、组件与页面比例值:
对历史数据库中存储管理员每一次的页面停留时间、页面操作顺序、组件与页面比例值进行归一化处理,以管理员每一次的页面停留时间、页面操作顺序、组件与页面比例值的归一化值为自变量,构建回归方程:
所述画板规划子模块还包括:
获取历史数据库中组件修改的属性;所述属性包括大小、颜色、位置;
以平均值作为属性修改的标准值,获取当前属性修改的预测值;所述预测值中包括大小修改值、位置移动概率;
根据任意两组件之间的间隔区域对画板进行排列,生成显示框,在管理员进行拖拽操作时亮起,指引管理员操作。
Priority Applications (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN202210380014.5A CN114461204B (zh) | 2022-04-12 | 2022-04-12 | 一种将多层级对象数据翻译为原生代码的开发系统和方法 |
Applications Claiming Priority (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN202210380014.5A CN114461204B (zh) | 2022-04-12 | 2022-04-12 | 一种将多层级对象数据翻译为原生代码的开发系统和方法 |
Publications (2)
Publication Number | Publication Date |
---|---|
CN114461204A true CN114461204A (zh) | 2022-05-10 |
CN114461204B CN114461204B (zh) | 2022-06-17 |
Family
ID=81418597
Family Applications (1)
Application Number | Title | Priority Date | Filing Date |
---|---|---|---|
CN202210380014.5A Active CN114461204B (zh) | 2022-04-12 | 2022-04-12 | 一种将多层级对象数据翻译为原生代码的开发系统和方法 |
Country Status (1)
Country | Link |
---|---|
CN (1) | CN114461204B (zh) |
Cited By (3)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN116414375A (zh) * | 2023-06-07 | 2023-07-11 | 长威信息科技发展股份有限公司 | 一种导出设计版源码的方法和系统 |
CN117236632A (zh) * | 2023-10-08 | 2023-12-15 | 常州同泰生物药业科技股份有限公司 | 一种狂犬病疫苗生产线物料管控方法 |
CN117289914A (zh) * | 2023-11-22 | 2023-12-26 | 南京飓风引擎信息技术有限公司 | 基于SpringBoot框架的数据转换系统及方法 |
Citations (6)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
US20170109933A1 (en) * | 2015-10-14 | 2017-04-20 | Prime Software Systems, Inc. | Visualizing the structure and execution of a program |
CN108597014A (zh) * | 2018-04-03 | 2018-09-28 | 万玉帝 | 一种基于可视化编程的跨平台渲染效果的编辑系统 |
US10788957B1 (en) * | 2019-08-22 | 2020-09-29 | Intel Corporation | Web page designing with sandboxed custom editors |
US20210255842A1 (en) * | 2020-02-18 | 2021-08-19 | Trixta, Inc. | Low-Code Development Platform |
CN113504908A (zh) * | 2021-07-19 | 2021-10-15 | 中国建设银行股份有限公司 | 业务代码生成方法、装置、电子设备及计算机可读介质 |
CN113961183A (zh) * | 2021-10-22 | 2022-01-21 | 平安银行股份有限公司 | 可视化编程方法、装置、设备及存储介质 |
-
2022
- 2022-04-12 CN CN202210380014.5A patent/CN114461204B/zh active Active
Patent Citations (6)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
US20170109933A1 (en) * | 2015-10-14 | 2017-04-20 | Prime Software Systems, Inc. | Visualizing the structure and execution of a program |
CN108597014A (zh) * | 2018-04-03 | 2018-09-28 | 万玉帝 | 一种基于可视化编程的跨平台渲染效果的编辑系统 |
US10788957B1 (en) * | 2019-08-22 | 2020-09-29 | Intel Corporation | Web page designing with sandboxed custom editors |
US20210255842A1 (en) * | 2020-02-18 | 2021-08-19 | Trixta, Inc. | Low-Code Development Platform |
CN113504908A (zh) * | 2021-07-19 | 2021-10-15 | 中国建设银行股份有限公司 | 业务代码生成方法、装置、电子设备及计算机可读介质 |
CN113961183A (zh) * | 2021-10-22 | 2022-01-21 | 平安银行股份有限公司 | 可视化编程方法、装置、设备及存储介质 |
Non-Patent Citations (3)
Title |
---|
IVAN BACHER 等: ""The Code Mini-Map Visualisation: Encoding Conceptual Structures Within Source Code"", 《2018 IEEE WORKING CONFERENCE ON SOFTWARE VISUALIZATION》 * |
刘炳元: "《一种可视化编程语言的低代码开发方法实践》", 《福建电脑》 * |
徐飞: ""浅谈低代码平台涉及的一些技术选型"", 《HTTPS://ZHUANLAN.ZHIHU.COM/P/182211043》 * |
Cited By (5)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN116414375A (zh) * | 2023-06-07 | 2023-07-11 | 长威信息科技发展股份有限公司 | 一种导出设计版源码的方法和系统 |
CN116414375B (zh) * | 2023-06-07 | 2023-09-01 | 长威信息科技发展股份有限公司 | 一种导出设计版源码的方法和系统 |
CN117236632A (zh) * | 2023-10-08 | 2023-12-15 | 常州同泰生物药业科技股份有限公司 | 一种狂犬病疫苗生产线物料管控方法 |
CN117289914A (zh) * | 2023-11-22 | 2023-12-26 | 南京飓风引擎信息技术有限公司 | 基于SpringBoot框架的数据转换系统及方法 |
CN117289914B (zh) * | 2023-11-22 | 2024-02-02 | 南京飓风引擎信息技术有限公司 | 基于SpringBoot框架的数据转换系统及方法 |
Also Published As
Publication number | Publication date |
---|---|
CN114461204B (zh) | 2022-06-17 |
Similar Documents
Publication | Publication Date | Title |
---|---|---|
CN114461204B (zh) | 一种将多层级对象数据翻译为原生代码的开发系统和方法 | |
US6466240B1 (en) | Method for visually writing programs or scripts that transform structured text presented as a tree | |
US5555408A (en) | Knowledge based information retrieval system | |
RU2537776C2 (ru) | Основанная на разметке расширяемость для интерфейсов пользователя | |
US7904821B1 (en) | Graphical user interface that is convertible at runtime | |
JPH0658624B2 (ja) | グラフィカル・ユーザ・インターフェース管理装置 | |
CN116225429A (zh) | 基于拖拽式组件框架的ipage网页式低代码开发平台 | |
US20090077091A1 (en) | System for development and hosting of network applications | |
CN101334728A (zh) | 一种基于xml文档描述的界面生成方法和平台 | |
JP2008512794A (ja) | オブジェクト処理グラフアプリケーション開発システム | |
CN103383645A (zh) | 代码生成方法及系统 | |
CN102591659A (zh) | 一种移动终端主界面上的微件实现方法及其管理方法 | |
JP2009535730A (ja) | プログラミング言語における式ツリーの深い埋め込みのためのジェネリックインターフェイス | |
CN101776999A (zh) | 软件系统开发实施平台 | |
CN112764743B (zh) | 一种基于数据模型驱动自动生成软件的方法 | |
JP2020017277A (ja) | グラフィックインタフェースに基づく、イベント動作をプログラミングするwebレポーティングデザインシステム | |
US7958073B2 (en) | Software and methods for task method knowledge hierarchies | |
CN115202626A (zh) | 一种支持多技术栈组件的低代码前端开发方法 | |
CN110377371B (zh) | 一种基于Web标签的样式表系统管理方法 | |
Paganelli et al. | A tool for creating design models from web site code | |
CN115935944A (zh) | 一种跨平台的标准文件树形结构生成方法与展示控件 | |
US20050081193A1 (en) | System and method for interacting with computer programming languages at semantic level | |
CN113655996B (zh) | 一种基于需求模型的企业级系统生成方法 | |
CN116360766A (zh) | 一种基于ddd可视化设计器的低代码系统和装置 | |
Cooper | Integrating dataflow evaluation into a practical higher-order call-by-value language |
Legal Events
Date | Code | Title | Description |
---|---|---|---|
PB01 | Publication | ||
PB01 | Publication | ||
SE01 | Entry into force of request for substantive examination | ||
SE01 | Entry into force of request for substantive examination | ||
GR01 | Patent grant | ||
GR01 | Patent grant |