UI模型驱动的前端无代码开发框架、方法、介质及设备技术

技术编号:37772551 阅读:6 留言:0更新日期:2023-06-06 13:38
本发明专利技术公开一种UI模型驱动的前端无代码开发框架、方法、介质及设备,开发框架包括:设计器,用于通过Web程序实现将预置组件拖拉到设计画布上时建立对应的UI模型,通过描述语言在UI模型被建立时产生对应的描述文件;预置代码库,其具有预置组件和预置组件被操作响应的程序代码;解析引擎,用于解析所述UI模型建立过程中产生的描述文件;渲染框架,用于将UI模型对应的预置组件渲染到Web页面中;后端服务连接调用接口,用于在前端Web发生事件或/和数据提交时调用后端服务与其对接。本发明专利技术可以为人机交互的Web应用的需求场景,实现无代码开发,通过非专业的预置组件设计工具,设计软件最终运行形态的组件及其布局,来实现软件功能。能。能。

【技术实现步骤摘要】
UI模型驱动的前端无代码开发框架、方法、介质及设备


[0001]本专利技术涉及计算机
,尤其涉及一种UI模型驱动的前端无代码开发框架、方法、介质及设备。

技术介绍

[0002]软件开发传统上都需要程序员利用计算机软件编程语言,进行程序代码的编写,通过解析或编译语言的编译器(或解析器)软件,翻译为目标计算机的运行机器码,计算机程序才能完成其功能。
[0003]因此,计算机编程是一种专业技能要求很高的能力,而且编程效率比较低。
[0004]但对一些领域应用,软件的应用场景比较明确,系统架构比较固定的需求,通过一些新的软件编程技术,无需编写程序代码,自动进行计算机程序设计一直是业界的努力方向。
[0005]通过自然语言进行编程,而不是专业的计算机软件编程语言进行编程,通过人工智能对语言的理解进行自动编程是学术界发展的方向之一,但进展不顺利。
[0006]因而,需要一种可以降低专业技能要求、提高编程效率的方案。

技术实现思路

[0007]鉴于以上技术问题,本专利技术提供了一种UI模型驱动的前端无代码开发框架、方法、介质及设备。
[0008]本公开的其他特性和优点将通过下面的详细描述变得显然,或部分地通过本公开的实践而习得。
[0009]根据本专利技术的一方面,提出了一种UI模型驱动的前端无代码开发框架,所述框架包括:设计器,用于通过Web程序实现将一个或多个预置组件拖拉到设计画布上时建立对应的UI模型,通过描述语言在所述UI模型被建立时产生对应的描述文件;预置代码库,其具有所述预置组件和所述预置组件被操作响应的程序代码;解析引擎,用于解析所述UI模型建立过程中产生的所述描述文件,以转变为调用所述预置组件的程序代码;渲染框架,用于将所述UI模型对应的所述预置组件渲染到Web页面中,及将接入与调用链接到对应的所述UI模型的菜单或按钮中;后端服务连接调用接口,用于在前端Web发生事件或/和数据提交,以及对应的事件或/和数据被封装为服务调用的格式后,调用后端服务与其对接。
[0010]进一步的,所述描述文件至少包括以下的一种描述参数:不同的所述预置组件的类型;渲染效果;操作合法性校验;操作的事件响应;不同的所述预置组件的布局。
[0011]进一步的,所述描述语言为基于JavaScript/HTML5的语言。
[0012]进一步的,所述预置组件具有设定的类型、名称、外观、对应的程序代码。
[0013]进一步的,所述渲染框架还用于:根据在所述预置组件被渲染至所述Web页面中时,适配当前屏幕的大小与分辨率。
[0014]根据本公开的第二方面,提供一种UI模型驱动的前端无代码开发方法,包括如上
述的开发框架,所述方法包括:定义所述框架的基本参数和服务调用接口;根据所述预置组件的特性和定义,利用所述设计器拖拉布局所述UI模型;将所述UI模型发布保存的同时建立所述UI模型与后端应用的接口;通过所述渲染框架,使得对应的所述预置组件被渲染至Web页面中。
[0015]进一步的,所述定义所述框架的基本参数和服务调用接口,至少包括以下一种:
[0016]定义程序名称;
[0017]定义代码简称;
[0018]设置调用入口;
[0019]设置调用参数;
[0020]设置调用权限。
[0021]进一步的,所述方法还包括:在渲染后的所述Web页面被操作而发生操作事件时,根据预置规则,调用并执行所述预置组件被操作响应的程序代码;在渲染后的所述Web页面被操作提交数据或/和发生交互事件时,对交互事件或/和所提交的数据封装为服务调用格式,调用后端应用接口,以完成Web交互操作的程序运行。
[0022]根据本公开的第三方面,提供一种计算机可读存储介质,存储有计算机程序,所述计算机程序被处理器执行时实现如上述的UI模型驱动的前端无代码开发方法。
[0023]根据本公开的第四方面,提供一种UI模型驱动的前端无代码开发设备,包括:控制器;所述控制器包括上述的存储有计算机程序的计算机可读存储介质,所述计算机程序被处理器执行时实现上述的UI模型驱动的前端无代码开发方法;或/和,所述控制器包括上述的所述的UI模型驱动的前端无代码开发框架。
[0024]本公开的技术方案具有以下有益效果:
[0025]本专利技术可以为人机交互的Web应用的需求场景,实现无代码开发,通过非专业的预置组件设计工具,设计软件最终运行形态的组件及其布局,来实现软件功能。这样,就可以无需复杂的计算机编程语言进行代码编写,大大提高软件设计的效率,所见即所得获得软件运行的最终体验,让不懂程序设计语言和没有软件编程特殊能力的人都可以快速进行软件设计,降低软件开发的能力要求。
[0026]本专利技术的核心优势就是利用UI模型实现软件最终运行效果的表达到运行预置代码的映射技术,通过引擎并结合前后端分离的模型,分别实现前后端的无编程运行框架。这种前后端分离的技术,可以实现业务的解耦,无需后端的修改,前端即可以封装为不同终端的操作系统和屏幕格式的自适应。
[0027]本专利技术通过程序运行时刻(Runtime)进行软件建模和运行,无需传统软件编程后需要进行软件编译、构建和打包为相关运行代码,然后在服务器上进行部署和运行的复杂过程,可以即时开发即时部署和即时运行,大大提高了系统管理效率。
附图说明
[0028]图1为本说明书实施例中的一种UI模型驱动的前端无代码开发框架的示意图;
[0029]图2为本说明书实施例中的一种UI模型驱动的前端无代码开发方法的流程图;
[0030]图3为本说明书实施例中一种安装有实现UI模型驱动的前端无代码开发框架的终端设备;
[0031]图4为本说明书实施例中一种储存有UI模型驱动的前端无代码开发框架的计算机可读存储介质。
具体实施方式
[0032]现在将参考附图更全面地描述示例实施方式。然而,示例实施方式能够以多种形式实施,且不应被理解为限于在此阐述的范例;相反,提供这些实施方式使得本公开将更加全面和完整,并将示例实施方式的构思全面地传达给本领域的技术人员。所描述的特征、结构或特性可以以任何合适的方式结合在一个或更多实施方式中。在下面的描述中,提供许多具体细节从而给出对本公开的实施方式的充分理解。然而,本领域技术人员将意识到,可以实践本公开的技术方案而省略所述特定细节中的一个或更多,或者可以采用其它的方法、组元、装置、步骤等。在其它情况下,不详细示出或描述公知技术方案以避免喧宾夺主而使得本公开的各方面变得模糊。
[0033]此外,附图仅为本公开的示意性图解。图中相同的附图标记表示相同或类似的部分,因而将省略对它们的重复描述。附图中所示的一些方框图是功能实体,不一定必须与物理或逻辑上独立的实体相对应。可以采用软件形式来实现这些功能实体,或在一个或多个硬件模块或集成电路中实现这些功能实体,或在不同网络和/或处理器装置和/或微控制器装置中实现这些功能实体。
[00本文档来自技高网
...

【技术保护点】

【技术特征摘要】
1.一种UI模型驱动的前端无代码开发框架,其特征在于,所述框架包括:设计器,用于通过Web程序实现将一个或多个预置组件拖拉到设计画布上时建立对应的UI模型,通过描述语言在所述UI模型被建立时产生对应的描述文件;预置代码库,其具有所述预置组件和所述预置组件被操作响应的程序代码;解析引擎,用于解析所述UI模型建立过程中产生的所述描述文件,以转变为调用所述预置组件的程序代码;渲染框架,用于将所述UI模型对应的所述预置组件渲染到Web页面中,及将接入与调用链接到对应的所述UI模型的菜单或按钮中;后端服务连接调用接口,用于在前端Web发生事件或/和数据提交,以及对应的事件或/和数据被封装为服务调用的格式后,调用后端服务与其对接。2.根据权利要求1所述的UI模型驱动的前端无代码开发框架,其特征在于,所述描述文件至少包括以下的一种描述参数:不同的所述预置组件的类型;渲染效果;操作合法性校验;操作的事件响应;不同的所述预置组件的布局。3.根据权利要求1所述的UI模型驱动的前端无代码开发框架,其特征在于,所述描述语言为基于JavaScript/HTML5的语言。4.根据权利要求1所述的UI模型驱动的前端无代码开发框架,其特征在于,所述预置组件具有设定的类型、名称、外观、对应的程序代码。5.根据权利要求1所述的UI模型驱动的前端无代码开发框架,其特征在于,所述渲染框架还用于:根据在所述预置组件被渲染至所述Web页面中时,适配当前屏幕的大小与分辨率。6.一种UI模型驱动的前端无代码开发方法,其特征在于,包括如权利要求1

5任一...

【专利技术属性】
技术研发人员:奉继承陈晓龙
申请(专利权)人:深圳市科南软件有限公司
类型:发明
国别省市:

网友询问留言 已有0条评论
  • 还没有人留言评论。发表了对其他浏览者有用的留言会获得科技券。

1