CN104216691B - 一种创建应用的方法及装置 - Google Patents
一种创建应用的方法及装置 Download PDFInfo
- Publication number
- CN104216691B CN104216691B CN201310213242.4A CN201310213242A CN104216691B CN 104216691 B CN104216691 B CN 104216691B CN 201310213242 A CN201310213242 A CN 201310213242A CN 104216691 B CN104216691 B CN 104216691B
- Authority
- CN
- China
- Prior art keywords
- functional unit
- component
- pel
- model
- interface
- 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.)
- Active
Links
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
- G06F3/00—Input arrangements for transferring data to be processed into a form capable of being handled by the computer; Output arrangements for transferring data from processing unit to output unit, e.g. interface arrangements
- G06F3/01—Input arrangements or combined input and output arrangements for interaction between user and computer
- G06F3/048—Interaction techniques based on graphical user interfaces [GUI]
- G06F3/0484—Interaction techniques based on graphical user interfaces [GUI] for the control of specific functions or operations, e.g. selecting or manipulating an object, an image or a displayed text element, setting a parameter value or selecting a range
- G06F3/04842—Selection of displayed objects or displayed text elements
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F8/00—Arrangements for software engineering
- G06F8/20—Software design
-
- 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/35—Creation or generation of source code model driven
-
- 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
Landscapes
- Engineering & Computer Science (AREA)
- General Engineering & Computer Science (AREA)
- Theoretical Computer Science (AREA)
- Software Systems (AREA)
- Physics & Mathematics (AREA)
- General Physics & Mathematics (AREA)
- Human Computer Interaction (AREA)
- Stored Programmes (AREA)
Abstract
本发明实施例提供一种创建应用的方法及装置。该方法包括:接收用户配置的组件属性的属性值,根据组件属性的属性值生成组件模型,并根据组件模型渲染组件界面中的预定义图元,以获取与所述组件属性的属性值相应的组件界面图元;将组件模型映射为功能组件模型,并将其图形化显示为功能组件图元,根据用户对所述功能组件图元的操作,图形化建立待创建的应用中不同的所述功能组件图元之间的关联关系,并根据所述待创建的应用中不同的功能组件图元之间的关联关系生成业务功能模型;根据所述组件模型和所述业务功能模型,生成应用的可执行代码。本发明提供的创建应用的方法及装置,实现了全图形化零代码创建应用和开发程序功能。
Description
技术领域
本发明涉及应用开发技术,尤其涉及一种创建应用的方法及装置,属于计算机技术领域。
背景技术
随着移动互联网的迅猛发展,移动应用软件的开发面向广大的普通受众是未来的一大必然趋势,以使普通人员能够方便、快速地实现移动应用软件的开发。
但是目前的应用开发技术中,虽然能够通过可视化界面技术,使得开发人员通过拖、拽组件的方式完成界面设计,但是在基于界面中的组件模型开发程序功能时,仍然需要开发人员以语言文字描述的形式进行配置,即进行代码开发。这就需要应用开发者精通编程语言,而且开发效率低。
因此,现有技术已经不能满足需求,基于可视化用户交互界面(UI)组件模型如何进一步全图形化开发程序功能,以使得普通人员也能简单、快速开发程序功能,已经成为图形化开发领域研究的热点和难点。
发明内容
针对现有技术中存在的缺陷,本发明实施例提供一种创建应用的方法及装置,以实现图形化创建应用。
第一方面,提供一种创建应用的方法,该方法应用在带有显示设备的终端上,包括:
接收用户配置的组件属性的属性值,根据所述组件属性的属性值,生成组件模型,并根据所述组件模型渲染组件界面中所述组件模型的预定义图元,以获取与所述组件属性的属性值相应的组件界面图元;
将所述组件模型映射为功能组件模型,并根据所述组件界面图元将所述功能组件模型图形化显示为功能组件图元,根据用户对所述功能组件图元的操作,图形化建立待创建的应用中不同的所述功能组件图元之间的关联关系,并根据所述待创建的应用中不同的所述功能组件图元之间的关联关系生成业务功能模型;
根据所述组件模型和所述业务功能模型,生成所述待创建的应用的可执行代码。
在第一方面的第一种可能的实现方式中,所述根据所述组件模型渲染组件界面中所述组件模型的预定义图元,以获取与所述组件属性的属性值相应的组件界面图元,具体包括:
根据所述组件属性中的组件界面展现格式的属性值及组件界面展现数据的属性值,生成组件模型代码;
根据所述组件模型代码,生成所述组件界面图元。
在第一方面的第二种可能的实现方式中,所述将组件模型映射为功能组件模型,并根据所述组件界面图元将所述功能组件模型图形化显示为功能组件图元,具体包括:
将所述组件模型的组件属性,映射为所述功能组件模型的功能组件属性;
将所述组件模型的组件关键标识,映射为所述功能组件模型的功能组件关键标识;
根据所述组件模型的组件关键标识,获取所述功能组件关键标识对应的功能组件展现代码;或者,根据所述组件关键标识对应的组件模型的组件展现格式的属性值和组件界面展现数据的属性值,生成所述功能组件关键标识对应的功能组件展现代码;
根据所述组件关键标识对应的组件模型的位置坐标,在功能组件界面对应的位置坐标处,根据所述功能组件展现代码渲染所述功能组件图元。
结合第一方面的第二种可能的实现方式,在第一方面的第三种可能的实现方式中,所述根据所述组件关键标识对应的组件模型的位置坐标,在功能组件界面对应的位置坐标处,根据所述功能组件展现代码渲染功能组件图元,具体包括:
调用所述终端中预置的绘图工具的图形操作接口,根据所述组件关键标识对应的位置坐标,在功能组件界面对应的位置坐标处,根据所述功能组件展现代码渲染功能组件界面图元;
根据所述组件模型的组件属性,自动联想映射所述功能组件属性图元。
在第一方面的第四种可能的实现方式中,所述将所述功能组件模型图形化显示为功能组件图元,具体包括:
利用所述终端中预置的绘图工具的三维展现空间能力,自动建模所述功能组件图元的三维模型,并根据用户配置的组件显示层次进行分层显示。
结合第一方面的第四种可能的实现方式,在第一方面的第五种可能的实现方式中,所述根据用户配置的组件显示层次进行分层显示,具体包括:
检索所有组件类型为应用程序交互接口API的功能组件图元;将API类型的功能组件界面图元的显示层次设置为最底层值,以在最底层显示所述API类型的功能组件界面图元;将API类型的功能组件界面图元对应的输入输出属性图元的显示层次,设置为所述API类型的功能组件界面图元的显示层次加1,以在所述API类型的功能组件界面图元的上方叠加显示附属的输入输出属性图元;
检索所有组件类型为可视化用户交互界面UI类型的功能组件图元;根据所述UI类型的功能组件图元的显示层次,显示所述UI类型的功能组件图元。
在第一方面的第六种可能的实现方式中,所述根据用户对所述功能组件图元的操作,图形化建立待创建的应用中不同的所述功能组件图元之间的关联关系,具体包括:
接收用户为所述功能组件图元进行颜色标注的标注颜色消息,所述标注颜色消息包括标注颜色、标注时间戳,以及功能组件图元对应的功能组件关键标识;
根据所述标注颜色、标注时间戳,以及功能组件图元对应的功能组件关键标识,生成图元标注序列;
根据所述图元标注序列,确定所述待创建的应用中不同的所述功能组件图元之间的关联关系。
结合第一方面的第六种可能的实现方式,在第一方面的第七种可能的实现方式中,所述根据所述图元标注序列,确定所述待创建的应用中不同的所述功能组件图元之间的关联关系,具体包括:
将所述功能组件图元的前景色,修改为所述标注颜色;
根据所述功能组件图元的前景色,以及所述功能组件图元对应的标注时间戳,自动生成用于指示应用功能逻辑的标注顺序码。
结合第一方面或第一方面的第一至第七中任一种可能的实现方式,在第一方面的第八种可能的实现方式中,所述根据所述待创建的应用中不同的所述功能组件图元之间的关联关系生成业务功能模型,具体包括:
根据所述待创建的应用中不同的所述功能组件图元之间的关联关系,生成功能组件图元关联序列;
根据所述图元关联序列、所述组件模型以及所述组件模型与功能组件图元的映射关系,生成所述业务功能模型。
结合第一方面或第一方面的第一至第七中任一种可能的实现方式,在第一方面的第九种可能的实现方式中,所述根据所述组件模型和所述业务功能模型,生成应用的可执行代码,具体包括:
从所述业务功能模型中,读取可视化用户交互界面UI类型的功能组件图元的属性;从所述组件界面中对应的UI组件的组件模型中,获取与所述UI类型的功能组件图元对应的已配置生成代码模板;根据所述UI类型的功能组件图元的属性,与所述对应的已配置生成代码模板,生成即时渲染组件代码;
从所述业务功能模型中,读取应用程序交互接口API类型的功能组件图元的属性;从所述组件界面中对应的API组件的组件模型中,获取与所述API类型的功能组件图元对应的已配置生成代码模板,并根据API组件声明的引用库生成引用类库代码;根据所述API类型的功能组件图元的属性、所述对应的已配置生成代码模板以及所述引用类库代码,生成API功能代码;
根据所述功能组件图元的属性和所述待创建的应用中不同的所述功能组件图元之间的关联关系,生成用于控制所述UI组件和所述API组件交互的脚本代码;
根据所述即时渲染组件代码、所述API功能代码以及所述脚本代码,生成所述应用的可执行代码。
第二方面,提供一种创建应用的装置,设置在带有显示设备的终端上,包括组件模型、组件设计模块、功能设计模块以及代码生成模块,其中:
所述组件设计模块,用于接收用户配置的组件属性的属性值,根据所述组件属性的属性值,生成组件模型,并根据所述组件模型渲染组件界面中所述组件模型的预定义图元,以获取与所述组件属性的属性值相应的组件界面图元;
所述功能设计模块,用于将所述组件模型映射为功能组件模型,并根据所述组件界面图元将所述功能组件模型图形化显示为功能组件图元,根据用户对所述功能组件图元的操作,图形化建立待创建的应用中不同的所述功能组件图元之间的关联关系,并根据所述待创建的应用中不同的所述功能组件图元之间的关联关系生成业务功能模型;
所述代码生成模块,用于根据所述组件模型和所述业务功能模型,生成所述待创建的应用的可执行代码。
在第二方面的第一种可能的实现方式中,所述组件设计模块具体用于:
根据所述组件属性中的组件界面展现格式的属性值及组件界面展现数据的属性值,生成组件模型代码;
根据所述组件模型代码,生成所述组件界面图元。
在第二方面的第二种可能的实现方式中,所述功能设计模块具体用于:
将所述组件模型的组件属性,映射为所述功能组件模型的功能组件属性;
将所述组件模型的组件关键标识,映射为所述功能组件模型的功能组件关键标识;
根据所述组件模型的组件关键标识,获取所述功能组件关键标识对应的功能组件展现代码;或者,根据所述组件关键标识对应的组件模型的组件展现格式的属性值和组件界面展现数据的属性值,生成所述功能组件关键标识对应的功能组件展现代码;
根据所述组件关键标识对应的组件模型的位置坐标,在功能组件界面对应的位置坐标处,根据所述功能组件展现代码渲染所述功能组件图元。
结合第二方面的第二种可能的实现方式,在第二方面的第三种可能的实现方式中,所述功能设计模块进一步用于:
调用所述终端中预置的绘图工具的图形操作接口,根据所述组件关键标识对应的位置坐标,在功能组件界面对应的位置坐标处,根据所述功能组件展现代码渲染功能组件界面图元;
根据所述组件模型的组件属性,自动联想映射所述功能组件属性图元。
在第二方面的第四种可能的实现方式中,所述功能设计模块进一步用于:
利用所述终端中预置的绘图工具的三维展现空间能力,自动建模所述功能组件图元的三维模型,并根据用户配置的组件显示层次进行分层显示。
结合第二方面的第四种可能的实现方式,在第二方面的第五种可能的实现方式中,所述功能设计模块具体用于:
检索所有组件类型为应用程序交互接口API的功能组件图元;将API类型的功能组件界面图元的显示层次设置为最底层值,以在最底层显示所述API类型的功能组件界面图元;将API类型的功能组件界面图元对应的输入输出属性图元的显示层次,设置为所述API类型的功能组件界面图元的显示层次加1,以在所述API类型的功能组件界面图元的上方叠加显示附属的输入输出属性图元;
检索所有组件类型为可视化用户交互界面UI的功能组件图元;根据所述UI类型的功能组件图元的显示层次,显示所述UI类型的功能组件图元。
在第二方面的第六种可能的实现方式中,所述功能设计模块进一步用于:
接收用户为所述功能组件图元进行颜色标注的标注颜色消息,所述标注颜色消息包括标注颜色、标注时间戳,以及功能组件图元对应的功能组件关键标识;
根据所述标注颜色、标注时间戳,以及功能组件图元对应的功能组件关键标识,生成图元标注序列;
根据所述图元标注序列,确定所述待创建的应用中不同的所述功能组件图元之间的关联关系。
结合第二方面的第六种可能的实现方式,在第二方面的第七种可能的实现方式中,所述功能设计模块进一步用于:
将所述功能组件图元的前景色,修改为所述标注颜色;
根据所述功能组件图元的前景色,以及所述功能组件图元对应的标注时间戳,自动生成用于指示应用功能逻辑的标注顺序码。
结合第二方面或第二方面的第一至第七中任一种可能的实现方式,在第二方面的第八种可能的实现方式中,所述功能设计模块进一步用于:
根据所述待创建的应用中不同的所述功能组件图元之间的关联关系,生成功能组件图元关联序列;
根据所述图元关联序列、所述组件模型以及所述组件模型与功能组件图元的映射关系,生成所述业务功能模型。
结合第二方面或第二方面的第一至第七中任一种可能的实现方式,在第二方面的第九种可能的实现方式中,所述代码生成模块,具体用于:
从所述业务功能模型中,读取可视化用户交互界面UI类型的功能组件图元的属性;从所述组件界面中对应的UI组件的组件模型中,获取与所述UI类型的功能组件图元对应的已配置生成代码模板;根据所述UI类型的功能组件图元的属性,与所述对应的已配置生成代码模板,生成即时渲染组件代码;
从所述业务功能模型中,读取应用程序交互接口API类型的功能组件图元的属性;从所述组件界面中对应的API组件的组件模型中,获取与所述API类型的功能组件图元对应的已配置生成代码模板,并根据API组件声明的引用库生成引用类库代码;根据所述API类型的功能组件图元的属性、所述对应的已配置生成代码模板以及所述引用类库代码,生成API功能代码;
根据所述功能组件图元的属性和所述待创建的应用中不同的所述功能组件图元之间的关联关系,生成用于控制所述UI组件和所述API组件交互的脚本代码;
根据所述即时渲染组件代码、所述API功能代码,以及所述脚本代码,生成所述应用的可执行代码。
根据本发明实施例提供的创建应用的方法及装置,利用用户通过图形化组件界面配置的组件模型创建图形化的功能组件图元,并根据用户对图形化的功能组件图元的操作,确定实现应用时,各功能组件图元之间的关联关系;还结合功能组件图元和关联关系生成用于表征程序功能的业务功能模型,并根据组件模型和业务功能模型,生成应用的可执行代码。因此,将组件设计与业务功能设计有机结合,实现了在完整的应用创建过程中,用户基于可视化界面零代码开发,并且简化了应用的创建过程,应用的开发创建效率高。
附图说明
为了更清楚地说明本发明实施例或现有技术中的技术方案,下面将对实施例或现有技术描述中所需要使用的附图作简单地介绍,显而易见地,下面描述中的附图仅仅是本发明的一些实施例,对于本领域普通技术人员来讲,在不付出创造性劳动性的前提下,还可以根据这些附图获得其他的附图。
图1为本发明实施例的创建应用的方法的流程示意图;
图2为本发明实施例的创建应用的方法中更新组件模型的一个示例的流程示意图;
图3为本发明实施例的创建应用的方法中生成功能组件模型的一个示例的流程示意图;
图4为本发明实施例的创建应用的方法中展现功能组件属性图元的一个示例的流程示意图;
图5为本发明实施例的创建应用的方法中图形化建立所述待创建的应用中不同的功能组件图元之间的关联关系的一个示例的流程示意图;
图6为本发明实施例的创建应用的装置的结构示意图;
图7为应用本发明实施例的创建应用的装置创建应用的示例一的流程示意图;
图8为应用本发明实施例的创建应用的装置更新组件模型的一个示例的流程示意图;
图9为应用本发明实施例的创建应用的装置创建应用的示例二的流程示意图;
图10为本发明另一实施例的创建应用的装置的结构示意图;
图11为本发明另一实施例的创建应用的装置的结构示意图。
具体实施方式
本发明实施例的创建应用的方法应用在带有显示设备的终端上,例如由一个创建应用的装置来执行,该创建应用的装置具有可视化界面,即显示设备,用户通过对该可视化界面进行操作,即可创建应用。下面,从创建应用的装置的角度,对本发明实施例的创建应用的方法进行说明。
图1为本发明实施例的创建应用的方法的流程示意图。如图1所示,该创建应用的方法包括:
步骤101,接收用户配置的组件属性的属性值,根据所述组件属性的属性值,生成组件模型,并根据所述组件模型渲染组件界面中所述组件模型的预定义图元,以获取与所述组件属性的属性值相应的组件界面图元;
具体地,创建应用的装置以图形化的方式,向用户提供组件待设计的组件属性,并将用户的实时设计信息更新到预先定义的组件模型,生成组件模型,再根据所述组件模型的属性渲染组件界面中组件模型对应的预定义图元,以获取相应的组件界面图元。其中,渲染的含义是指根据组件模型的属性生成图形化图元。
其中,组件模型提供的功能实体例如包括:
可视化用户交互界面(User Interface,UI)组件:定义界面表单元素实体;
应用程序交互接口(Application Program Interface,API)组件:业务平台提供或从第三方引入的数据处理能力组件;和
模型操作接口:根据组件信息读取或更新组件模型的接口;
用户可设计的组件的属性例如包括组件可以触发事件、组件对外交互接口及参数、以及组件展现信息三类属性。
其中,组件触发事件例如包括单击(click)、双击(doubleclick)、轻触(tap)、滑动(swipe)等;
组件支持的交互功能及参数例如为setData(data)、getData()、hide()、getLocation()等;对外交互功能属性数据格式例如为:
组件展现信息例如包括布局(layout)、和/或类型(style)、和/或格式(format)、和/或数据(data)、和/或可视(visible)、和/或索引(index)、和/或宽度(width)、和/或高度(height)等。
更为具体地,用户可设计的组件的属性例如包括组件界面展现格式、组件界面展现数据、组件显示层次、组件的位置坐标、组件触发事件名称、组件对外交互接口名称及接口相关参数的名称,以及组件类型等。创建应用的装置获取用户输入的组件属性的属性值,并将所获取的组件属性的属性值,更新到预定义的组件模型。预定义的组件模型中预定义有各组件属性的初始化属性值,该初始化属性值可以为空。例如,组件模型预先定义如下:
步骤102,将组件模型映射为功能组件模型,并根据所述组件界面图元将所述功能组件模型图形化显示为功能组件图元,图形化建立待创建的应用中不同的所述功能组件图元之间的关联关系,并根据所述待创建的应用中不同的所述功能组件图元之间的关联关系生成业务功能模型;
其中,所述功能组件图元包括功能组件界面图元和附属于所述功能组件界面图元的功能组件属性图元。
具体地,创建应用的装置还以图形化方式供用户开发业务功能,设计开发组件关联关系,生成业务功能模型。其中,创建应用的装置将步骤101获得的组件模型,映射为功能组件模型,并将功能组件模型图形化显示为功能组件图元。所显示的功能组件图元包括功能组件界面图元和功能组件属性图元,其中,功能组件界面图元用于标识功能组件模型,其可以与组件界面中,对应的组件模型的显示方式相同,功能组件属性图元是根据功能组件模型对应的事件和功能属性生成的,并附属展现在功能组件界面图元周围或重叠在功能组件界面图元之上。
用户通过创建应用的装置的人机交互界面,根据待创建的应用的实现流程,对功能组件图元进行操作,例如对功能组件图元进行标注,或对功能组件图元进行拖动操作等。创建应用的装置获取用户对图形化功能组件图元的操作,根据用户的操作,确定在待创建的应用中,实现不同功能的各功能组件图元之间的关联关系,例如为执行的先后次序。创建应用的装置再根据各功能组件图元,以及所确定的各功能组件图元之间的关联关系,即可生成业务功能模型。
步骤103,根据所述组件模型和所述业务功能模型,生成应用的可执行代码。
具体地,创建应用的装置在执行上述步骤101和步骤102后,根据组件模型和业务功能模型,生成代码形式的可执行应用,通过加载并运行可执行应用,即可提供相应的应用服务。
根据本发明实施例的创建应用的方法,利用用户通过图形化组件界面配置的组件模型创建图形化的功能组件图元,并根据用户对图形化的功能组件图元的操作,确定实现应用时,各功能组件图元之间的关联关系;还结合功能组件图元和关联关系生成用于表征程序功能的业务功能模型,并根据组件模型和业务功能模型,生成应用的可执行代码。因此,将组件设计与业务功能设计有机结合,实现了在完整的应用创建过程中,用户基于可视化界面零代码开发,并且简化了应用的创建过程,应用的创建开发效率高。
进一步地,在本发明实施例的创建应用的方法中,接收用户配置的组件属性的属性值,根据所述组件属性的属性值,生成组件模型的过程,例如为:创建应用的装置按照图2所示流程检测组件属性的改变,记录改变后的属性值,并更新组件模型中的对应的属性值为改变后的值。其中,图2为本发明实施例的创建应用的方法中更新组件模型的一个示例的流程示意图。如图2所示,包括以下步骤:
步骤201,根据用户选择设计的组件的类型和名称,获取相应的组件模型的组件元数据;
步骤202,根据所获取的组件元数据,图形化分属性展现属性项,展现形式例如为(属性名称、属性值),并设置属性值可编辑;
步骤203,获取变更的属性值;
步骤204,将组件模型中对应的属性更新为变更的属性值。
进一步地,在本发明实施例的创建应用的方法中,所述根据组件模型渲染组件界面中所述组件模型的预定义图元,以获取相应的组件界面图元,包括:
根据组件界面展现格式的属性值及组件界面展现数据的属性值,生成组件模型代码;
根据组件模型代码,生成所述组件界面图元。
进一步地,在本发明实施例的创建应用的方法中,所述将组件模型映射为功能组件模型,并根据所述组件界面图元将所述功能组件模型图形化显示为功能组件图元,包括:
将所述组件模型的组件属性,映射为所述功能组件模型的功能组件属性;
将所述组件模型的组件关键标识,映射为所述功能组件模型的功能组件关键标识;
根据所述组件模型的组件关键标识,获取所述功能组件关键标识对应的功能组件展现代码;或者,根据所述组件关键标识对应的组件模型的组件展现格式的属性值和组件界面展现数据的属性值,生成所述功能组件关键标识对应的功能组件展现代码;
根据所述组件关键标识对应的组件模型的位置坐标,在功能组件界面对应的位置坐标处,根据所述功能组件展现代码,渲染功能组件图元。
具体地,在上述渲染功能组件图元的过程中,创建应用的装置根据生成的组件模型,动态生成对应的功能组件模型,该功能组件模型主要包括以下属性:功能组件关键标识(ID);功能组件展现代码(图元展现格式、图元展现数据、图元图标、图元大小),展示的效果和组件设计效果保持一致;功能组件类型(UI组件/API组件);功能组件支持的交互功能及参数;功能组件支持的触发事件;功能组件的显示层次zindex值;以及功能组件对应显示的位置坐标。
功能组件模型定义例如为:
图3为本发明实施例的创建应用的方法中生成功能组件模型的一个示例的流程示意图。如图3所示,包括以下步骤:
步骤301,获取组件模型;
步骤302,解析组件模型;
步骤303,将所述组件模型的组件属性,映射为功能组件模型的功能组件属性;并根据组件模型的组件关键标识,生成功能组件模型的功能组件关键标识;
具体地,例如为将组件模型的组件关键标识,添加任意字符串,生成功能组件关键标识。
步骤304,将功能组件模型的功能组件事件属性(即组件支持的可设计的事件),设置为组件模型的组件事件属性(即组件触发事件名称);
步骤305,将功能组件的功能属性(即支持的交互功能及参数),设置为组件模型的功能(即组件对外交互接口名称及接口相关参数的名称);
步骤306,根据所述组件模型的组件关键标识,获取所述功能组件关键标识对应的功能组件展现代码;或者,根据所述组件关键标识对应的组件模型的组件展现格式的属性值和组件界面展现数据的属性值,生成所述功能组件关键标识对应的功能组件展现代码;
步骤307,设置功能组件显示层次为组件显示层次;
步骤308,设置功能组件展现位置坐标为组件展现位置坐标;
步骤309,保存经过以上设置的功能组件模型。
经过图3所示的流程,生成功能组件模型后,根据功能组件关键标识和组件关键标识,建立功能组件和组件的映射关系,并根据功能组件模型对应的功能组件展现位置坐标、显示层次和功能组件展现代码,自动展现功能组件。
其中,自动展现功能组件具体包括:调用终端中预置的绘图工具(例如为Canvas或SVG等)的图形操作接口,根据所述组件关键标识对应的位置坐标,在功能组件界面对应的位置坐标处,根据所述功能组件展现代码,绘制功能组件界面图元;并自动联想映射所述功能组件属性图元。具体地,基于组件模型的组件属性,自动联想所述功能组件界面图元的属性,根据功能组件对应的事件和功能属性,自动生成图形化展示组件事件和功能属性的功能组件部件单元,并附属展现在功能组件界面图元周围或重叠在功能组件界面图元之上,即功能组件属性图元。其中,自动联想映射所述功能组件属性图元的过程,例如为:将组件模型的组件属性一一映射为功能组件属性图元。
更为具体地,图4为本发明实施例的创建应用的方法中展现功能组件属性图元的一个示例的流程示意图。如图4所示,包括以下步骤:
步骤401,读取功能组件事件属性;
步骤402,分别为每个事件在功能组件界面图元周围增加一个部件展现单元;
步骤403,设置步骤402增加的部件展现单元文本信息为事件名;
步骤404,为步骤402增加的部件展现单元增加标识事件的图标;
步骤405,读取功能组件对应的功能属性;
步骤406,分别为每个功能在功能组件界面图元周围增加一个部件展现单元,即功能部件展现单元;
步骤407,设置步骤406增加的部件展现单元文本信息为功能方法名;
步骤408,为步骤406增加的部件展现单元增加标识功能图标/API组件图标属性对应的图标;
步骤409,在功能部件展现单元周围增加所有参数部件单元,并设置其文本为参数名。
至此,完成渲染功能组件图元的操作。
进一步地,在本发明实施例的创建应用的方法中,除采用上述图3和图4所示的流程渲染功能组件图元之外,还可以利用终端中预置的绘图工具的三维展现空间能力,自动建模所述功能组件图元的三维模型,并根据用户配置的组件显示层次进行分层显示。
其中,所述根据用户配置的组件显示层次进行分层显示,包括:
检索所有组件类型为API的功能组件图元;将API类型的功能组件界面图元的显示层次设置为最底层值,以在最底层显示API类型的功能组件界面图元;将API类型的功能组件界面图元对应的输入输出属性图元的显示层次,设置为API类型的功能组件界面图元的显示层次加1,以在API类型的功能组件界面图元的上方叠加显示附属的输入输出属性图元;检索所有组件类型为UI的功能组件图元;根据UI类型的功能组件图元的显示层次,显示UI类型的功能组件图元。其中,用户还可以通过修改功能组件图元的显示层次,控制功能组件图元处于显示状态或隐藏状态。
根据本发明实施例的创建应用的方法,提供了更为直观、形象的功能组件图元显示。
进一步地,在本发明实施例的创建应用的方法中,所述根据用户对所述功能组件图元的操作,图形化建立所述待创建的应用中不同的功能组件图元之间的关联关系,包括:
接收用户为所述功能组件图元进行颜色标注的标注颜色消息,所述标注颜色消息包括标注颜色、标注时间戳,以及功能组件图元对应的功能组件关键标识;
根据所述标注颜色、标注时间戳,以及功能组件图元对应的功能组件关键标识,生成图元标注序列;
根据所述图元标注序列,确定待创建的应用中不同的功能组件图元之间的关联关系。
其中,根据所述图元标注序列,确定待创建的应用中不同的功能组件图元之间的关联关系,具体包括:
将所述功能组件图元的前景色,修改为所述标注颜色;
根据所述功能组件图元的前景色,以及所述功能组件图元对应的标注时间戳,自动生成用于指示应用功能逻辑的标注顺序码。
更为具体地,图5为本发明实施例的创建应用的方法中图形化建立所述待创建的应用中不同的功能组件图元之间的关联关系的一个示例的流程示意图。如图5所示,包括以下步骤:
步骤501,接收用户对功能组件图元的点击;
步骤502,显示颜色面板;
步骤503,接收用户选定的颜色;
步骤504,将功能组件图元的前景色,修改为用户选定的颜色(即标注颜色);
步骤505,记录着色的功能组件图元的功能组件关键标识、标注颜色和标注时间戳;
步骤506,根据用户对不同功能组件图元的标注顺序,分析出业务功能执行顺序,自动生成与各功能组件图元对应的标注顺序码。
进一步,还可以包括:
步骤507,在所述功能组件图元上自动增加容器元素,并设置所述容器元素的文本为所述标注顺序码。
根据本发明实施例的创建应用的方法,用户通过对功能组件图元进行颜色标注,即可完成应用执行逻辑的设置,程序功能开发效率高,尤其当功能组件图元显示为三维模型时,通过这种颜色标注的方法,使图形化显示效果更为清晰。
进一步地,在本发明实施例的创建应用的方法中,除采用上述图5所示的流程图形化建立各功能组件图元之间的关联关系之外,还可以通过接收用户的拖动操作,自动画线连接所述拖动操作对应的源功能组件图元和目标功能组件图元,记录各功能组件图元之间的关联关系。
根据本发明实施例的创建应用的方法,用户通过直接对功能组件图元进行拖拽操作,即可完成应用执行逻辑的设置,更为直观、简便。
进一步地,在本发明实施例的创建应用的方法中,根据所述待创建的应用中不同的所述功能组件图元之间的关联关系生成业务功能模型,包括:
根据所述待创建的应用中不同的功能组件图元之间的关联关系,生成功能组件图元关联序列;
根据图元关联序列、组件模型,以及组件模型与功能组件图元的映射关系,生成业务功能模型。
其中,功能组件图元关联序列例如定义如下:
{object1.event:object2.method,objec2t.method.para1:object3,object2.out:obje ct4,…}
其中,用“:”隔开不同的功能组件图元。
业务功能模型例如定义如下:
进一步地,在本发明实施例的创建应用的方法中,所述图形化建立的所述待创建的应用中不同的所述功能组件图元之间的关联关系,是以树形结构分层或分级展示的。
进一步地,在本发明实施例的创建应用的方法中,所述根据所述组件模型和所述业务功能模型,生成应用的可执行代码,包括:
从所述业务功能模型中,读取UI类型的功能组件图元的属性;从所述组件界面中对应的UI组件的组件模型中,获取与所述UI类型的功能组件图元对应的已配置生成代码模板;根据所述UI类型的功能组件图元的属性,与所述对应的已配置生成代码模板,生成即时渲染组件代码;
从所述业务功能模型中,读取API类型的功能组件图元的属性;从所述组件界面中对应的API组件的组件模型中,获取与所述API类型的功能组件图元对应的已配置生成代码模板,并根据API组件声明的引用库生成引用类库代码;根据所述API类型的功能组件图元的属性、所述对应的已配置生成代码模板以及所述引用类库代码,生成API功能代码;
根据所述功能组件图元的属性和所述功能组件图元的关联关系,生成用于控制所述UI组件和所述API组件交互的脚本代码;
根据所述即时渲染组件代码、所述API功能代码,以及所述脚本代码,生成所述应用的可执行代码。
图6为本发明实施例的创建应用的装置的结构示意图。该创建应用的装置设置在带有显示设备的终端上。如图6所示,创建应用的装置60包括组件模型61、组件设计模块62、功能设计模块63以及代码生成模块64,其中:
所述组件设计模块62,用于接收用户配置的组件属性的属性值,根据所述组件属性的属性值,生成组件模型,并根据所述组件模型渲染组件界面中所述组件模型的预定义图元,以获取与所述组件属性的属性值相应的组件界面图元;
所述功能设计模块63,用于将组件模型映射为功能组件模型,并根据所述组件界面图元将所述功能组件模型图形化显示为功能组件图元,根据用户对所述功能组件图元的操作,图形化建立待创建的应用中不同的所述功能组件图元之间的关联关系,并根据所述待创建的应用中不同的所述功能组件图元之间的关联关系生成业务功能模型;其中,所述功能组件图元包括功能组件界面图元和附属于所述功能组件界面图元的功能组件属性图元;
所述代码生成模块64,用于根据所述组件模型和所述业务功能模型,生成待创建的应用的可执行代码。
本发明实施例的创建应用的装置创建应用的具体流程与本发明实施例的创建应用的方法相同,故此处不再赘述。
根据本发明实施例的创建应用的装置,利用用户通过图形化组件界面配置的组件模型创建图形化的功能组件图元,并根据用户对图形化的功能组件图元的操作,确定实现应用时,各功能组件图元之间的关联关系;还结合功能组件图元和关联关系生成用于表征程序功能的业务功能模型,并根据组件模型和业务功能模型,生成应用的可执行代码。因此,将组件设计与业务功能设计有机结合,实现了在完整的应用创建过程中,用户基于图形化界面零代码开发,并且简化了应用的创建过程,而且应用的创建效率高。
进一步地,本发明实施例的创建应用的装置中,还可以包括业务运行引擎,用于运行代码生成模块生成的可执行代码,以向用户提供应用服务。
进一步地,本发明实施例的创建应用的装置中,所述组件属性包括:组件界面展现格式、组件界面展现数据、组件显示层次、组件的位置坐标、组件触发事件名称、组件对外交互接口名称及接口相关参数的名称,以及组件类型。
进一步地,本发明实施例的创建应用的装置中,所述组件设计模块具体用于:
根据所述组件属性中的组件界面展现格式的属性值及组件界面展现数据的属性值,生成组件模型代码;根据所述组件模型代码,生成所述组件界面图元。
进一步地,本发明实施例的创建应用的装置中,所述功能设计模块具体用于:
将所述组件模型的组件属性,映射为所述功能组件模型的功能组件属性;
将所述组件模型的组件关键标识,映射为所述功能组件模型的功能组件关键标识;
根据所述组件模型的组件关键标识,获取所述功能组件关键标识对应的功能组件展现代码;或者,根据所述组件关键标识对应的组件模型的组件展现格式的属性值和组件界面展现数据的属性值,生成所述功能组件关键标识对应的功能组件展现代码;
根据所述组件关键标识对应的组件模型的位置坐标,在功能组件界面对应的位置坐标处,根据所述功能组件展现代码渲染功能组件图元。
进一步地,本发明实施例的创建应用的装置中,所述功能设计模块具体还用于:
调用终端中预置的绘图工具的图形操作接口,根据所述组件关键标识对应的位置坐标,在功能组件界面对应的位置坐标处,根据所述功能组件展现代码渲染功能组件界面图元;
根据所述组件模型的组件属性,自动联想映射所述功能组件属性图元。
进一步地,本发明实施例的创建应用的装置中,所述功能设计模块还用于:
利用终端中预置的绘图工具的三维展现空间能力,自动建模所述功能组件图元的三维模型,并根据用户配置的组件显示层次进行分层显示。
进一步地,本发明实施例的创建应用的装置中,所述功能设计模块还用于:
检索所有组件类型为API的功能组件图元;将API类型的功能组件界面图元的显示层次设置为最底层值,以在最底层显示所述API类型的功能组件界面图元;将API类型的功能组件界面图元对应的输入输出属性图元的显示层次,设置为所述API类型的功能组件界面图元的显示层次加1,以在所述API类型的功能组件界面图元的上方叠加显示附属的输入输出属性图元;
检索所有组件类型为UI的功能组件图元;根据所述UI类型的功能组件图元的显示层次,显示所述UI类型的功能组件图元。
进一步地,本发明实施例的创建应用的装置中,所述功能设计模块还还用于:
通过修改所述功能组件图元的显示层次,控制所述功能组件图元处于显示状态或隐藏状态。
进一步地,本发明实施例的创建应用的装置中,所述功能设计模块还用于:
接收用户为所述功能组件图元进行颜色标注的标注颜色消息,所述标注颜色消息包括标注颜色、标注时间戳,以及功能组件图元对应的功能组件关键标识;
根据所述标注颜色、标注时间戳,以及功能组件图元对应的功能组件关键标识,生成图元标注序列;
根据所述图元标注序列,确定待创建的应用中不同的功能组件图元之间的关联关系。
进一步地,本发明实施例的创建应用的装置中,所述功能设计模块还具体用于:
将所述功能组件图元的前景色,修改为所述标注颜色;
根据所述功能组件图元的前景色,以及所述功能组件图元对应的标注时间戳,自动生成用于指示应用功能逻辑的标注顺序码。
进一步地,本发明实施例的创建应用的装置中,所述功能设计模块还具体用于:
在所述功能组件图元上自动增加容器元素,并设置所述容器元素的文本为所述标注顺序码。
进一步地,本发明实施例的创建应用的装置中,所述功能设计模块还用于:
接收用户的拖动操作,自动画线连接所述拖动操作对应的源功能组件图元和目标功能组件图元,记录所述待创建的应用中不同的所述功能组件图元之间的关联关系。
进一步地,本发明实施例的创建应用的装置中,所述功能设计模块还用于:
将所述组件模型的组件关键标识,添加任意字符串,生成所述功能组件关键标识。
进一步地,本发明实施例的创建应用的装置中,所述功能设计模块还用于:
根据所述待创建的应用中不同的所述功能组件图元之间的关联关系,生成功能组件图元关联序列;
根据所述图元关联序列、所述组件模型以及所述组件模型与功能组件图元的映射关系,生成所述业务功能模型。
进一步地,本发明实施例的创建应用的装置中,所述图形化建立的所述功能组件图元之间的关联关系,是以树形结构分层或分级展示的。
进一步地,本发明实施例的创建应用的装置中,所述功能组件图元与相应的组件界面图元的展现效果一致。
进一步地,本发明实施例的创建应用的装置中,所述代码生成模块,用于:
从所述业务功能模型中,读取UI类型的功能组件图元的属性;从所述组件界面中对应的UI组件的组件模型中,获取与所述UI类型的功能组件图元对应的已配置生成代码模板;根据所述UI类型的功能组件图元的属性,与所述对应的已配置生成代码模板,生成即时渲染组件代码;
从所述业务功能模型中,读取API类型的功能组件图元的属性;从所述组件界面中对应的API组件的组件模型中,获取与所述API类型的功能组件图元对应的已配置生成代码模板,并根据API组件声明的引用库生成引用类库代码;根据所述API类型的功能组件图元的属性、所述对应的已配置生成代码模板以及所述引用类库代码,生成API功能代码;
根据所述功能组件图元的属性和所述功能组件图元的关联关系,生成用于控制所述UI组件和所述API组件交互的脚本代码;
根据所述即时渲染组件代码、所述API功能代码,以及所述脚本代码,生成所述应用的可执行代码。
下文中,以两个具体的示例,对应用本发明实施例的创建应用的装置创建应用的流程进行更为详细说明。
示例一
创建的应用:拍照业务,通过单击一个按钮调用拍照API组件,并把拍照的照片显示在图片组件上的WEB业务,通过JavaScript和CSS来实现该业务。
需使用的相关组件:一个图片UI组件、一个按钮UI组件、一个拍照API组件。
图7为应用本发明实施例的创建应用的装置创建应用的示例一的流程示意图,如图7所示,包括:
步骤701,组件设计模块记录用户设计的图片UI组件、按钮UI组件、拍照API组件的属性信息,并更新预先存储的组件模型;
具体地,预先定义的组件模型包括UI组件、API组件和模型操作接口。图8为应用本发明实施例的创建应用的装置更新组件模型的一个示例的流程示意图。如图8所示,包括以下步骤:
步骤801,组件设计模块根据用户选择设计的组件的类型和名称,向模型操作接口发送组件元数据获取请求;
步骤802,模型操作接口根据用户选择设计的组件的类型和名称,读取对应的组件元数据,并以JSON格式封装为组件元数据消息;
步骤803,模型操作接口将组件元数据消息返回给组件设计模块;
步骤804,组件设计模块根据所获取的组件元数据,图形化分属性展现属性项,展现形式例如为(属性名称、属性值),并设置属性值可编辑;
步骤805,组件设计模块为属性值增加编辑监听事件,绑定组件属性变更处理回调接口,回调接口格式如下:
Interface(String type,String name,String propertyName,StringpropertyValue)
{
//调用组件元模型操作接口更新组件元模型
}
步骤806,回调接口获取变更属性值,请求模型操作接口更新组件元数据;
步骤807,模型操作接口将相应的UI组件/API组件中的属性更新为变更的属性值。
在本示例中,用户例如通过拖拽的方式,在组件设计模块中增加了图片UI组件、按钮UI组件和拍照API组件,并设置组件的展现数据、图标、样式等属性。组件设计模块调用模型操作接口,自动更新组件模型对应的属性信息。更为具体地,用户设计图片UI组件的功能名为“changeImage”,输入参数为“image”;设计按钮UI组件(即“拍照”按钮)的触发事件名属性为“onClick”,别名属性为“click”;设计拍照API组件的名称为“TakePicture”及对应的图标。
步骤702,组件设计模块请求功能设计模块生成所有组件的功能组件模型;
步骤703,功能设计模块根据组件模型,生成功能组件模型,并建立组件模型的组件属性与功能组件模型的功能组件属性的映射关系;
具体地,功能设计模块向组件设计模块请求获取图片UI组件、按钮UI组件和拍照API组件的组件元数据,并接收组件设计模块响应该请求返回的组件元数据信息。返回的元数据信息如下:
功能设计模块解析返回的组件元模型,分别获取图片UI组件、按钮UI组件和拍照API组件的组件元数据。功能设计模块采用组件关键标识(组件ID标识)+“function”生成所有组件对应的功能组件关键标识,即生成如下:
图片UI功能组件标识为:“object1function”;
按钮UI功能组件标识为:“object2function”;
拍照API功能组件标识为:“object3function”。
功能设计模块设置“拍照”按钮对应的功能组件支持事件为“click”;设置图片UI功能组件支持的功能属性为步骤701中用户设计的图片UI组件的功能属性,即:
功能设计模块设置按钮UI功能组件支持的功能属性为步骤701中用户设计的拍照API组件的功能属性,即:
功能设计模块再根据各功能组件ID标识,获取组件对应的outerHTML代码作为功能组件展示代码,以下为功能组件展示代码的示例:
图片UI功能组件的功能组件展示代码为:
<div id="logicobject3"style="z-index:3;width:112px;height:112px;"logiconclick="objClicked(3)"logicondblclick="objDblClicked(3)"logiconmouseover="objMouseOver(this);"logiconmouseout="objMouseOut(this);"class="yui-resize-hover yui-resize-knob yui-resize yui-draggable"onclick="objClicked(3)"><imgid="logicobjectImg3"style="position:absolute;width:100%;height:100%;"src="images/background/apple.jpeg"></div>
按钮UI功能组件的功能组件展示代码为:
<div id="logicobject2"style="width:89px;height:32px;z-index:2;logicleft:85px;logictop:150px;text-align:left;visibility:visible;"onclick="objClicked(2)"logicondblclick="objDblClicked(2)"logiconmouseover="objMouseOver(this);"logiconmouseout="objMouseOut(this);"class="yui-resize-hover yui-resize-knob yui-resize yui-draggable"><logica id="logicobjectPushButton2"style="margin:0px;height:100%;width:100%;text-align:left;"logichref="#"class="ui-btn ui-btn-icon-left ui-btn-hover-a ui-btn-corner-all ui-shadow ui-btn-up-a"><span id="buttonandicon2"class="ui-btn-inner ui-btn-corner-all"style="line-height:18px"><span class="ui-btn-text"id="buttontext2">拍照</span><span id="buttonicon2"class="ui-icon ui-icon-gearui-icon-shadow"></span></span></logica>
拍照API功能组件的功能组件展示代码为:
<div id="TakePicture"lang="API"align="addDsJSAPI('COSMOS','','takePicture','username','','images/toolbox/mobile_picture.png');"dir="TakePicture"onmouseover="switchTopBarBg(this,'over','apibg.png');"onmouseout="switchTopBarBg(this,'over','');"class="div_api"title="TakePicture"style="background-image:url(http://localhost:8088/mashupIDE/images/newstyle/apibg.png);"><table><tbody><tr><td style="height:30px;cursor:move"align="center"><imgclass="img_api_td"src="images/toolbox/mobile_picture.png"></td></tr><tr><td align="center"><div class="td_api"><a style=""href="javascript:void(0)"title="ViewDetail"onclick="showApiDetail('TakePicture');">TakePicture</a><a></a></div></td></tr></tbody></table></div>
功能设计模块再将各功能组件的显示层次Zindex值,设置为用户设计的组件的Zindex属性值。例如,将图片UI功能组件的Zindex值设置为1,将按钮UI功能组件的Zindex值设置为2,将拍照API功能组件的Zindex值设置为3。
功能设计模块再将各功能组件的显示位置属性值,设置为用户设计的组件的显示位置属性值。例如,将图片UI功能组件的x属性值为124px,y属性值为219px;将按钮UI功能组件的x属性值为124px,y属性值为319px;将拍照API功能组件的x属性值为124px,y属性值为419px。
通过上述步骤,功能设计模块完成功能组件模型的生成,保存所生成的图片UI功能组件、按钮UI功能组件和拍照API功能组件。
步骤704,功能设计模块根据组件关键标识和功能组件关键标识建立映射关系;
例如,映射关系如下:
{object1:object1_function,object:object2_function,object3:object3_function}
步骤705,图形化显示功能组件模型到功能设计模块;
具体地,在功能设计模块中分别为各功能组件模型增加DIV容器元素,所增加的DIV容器元素的位置为功能组件模型的坐标属性(x,y)的值,并设置DIV容器元素的ID为功能组件ID标识,设置DIV容器元素的innerHTML代码为功能组件模型的HTML代码,最终展现效果同组件设计模块中的组件展现效果完全一致。
步骤706,自动联想功能组件模型属性,并图形化映射到图形化显示的功能组件(即功能组件界面图元)右侧附近;
具体流程例如包括:功能设计模块从功能组件模型中读取拍照按钮对应的事件属性值,即“click”;在拍照按钮功能组件右侧增加一个DIV展现容器;设置DIV文本(text)属性为“click”;为展现事件容器增加一个图片(IMG)元素统一资源定位符(Uniform/Universal Resource Locator,URL),“http://localhost/resources/gear.png”,用于标识该功能组件为事件功能组件;读取拍照API功能组件对应的功能属性,属性值参考返回消息中API组件元数据;在拍照API功能设计组件右侧增加一个DIV容器;设置DIV text属性为“output”;为展现DIV容器增加一个IMG元素URL,“http://localhost/resources/output.png”,用于标识该功能组件为API输出单元。
步骤707,功能设计模块记录用户通过拖动功能组件图元,设计的功能组件关联关系,生成功能组件关联序列;
具体地,用户通过拖动功能组件图元到目标、关联组件,功能设计模块自动画线连接源和目标组件,完成功能组件关联,并建立关联关系,生成功能组件关联序列。在本示例中,所生成的功能组件关联序列例如为:
{object2.click:object3.takePicture,object3.out:object1}
步骤708,功能设计模块记录功能设计展示效果及功能组件模型,序列化功能设计容器代码JSON(JavaScript Object Notation)格式字符串及序列化功能组件模型JSON格式字符串并保存。
步骤709,功能设计模块根据组件模型、组件模型与功能组件模型的映射关系以及功能组件关联序列,生成业务功能模型并保存;
在本示例中,所生成的业务功能模型如下:
步骤710,代码生成模块根据组件模型、业务功能模型生成超文本标记语言(Hypertext Markup Language,HTML)和javascript代码。
在上述示例中,功能设计模块以二维形式对功能组件图元进行显示,并且通过接收用户对功能组件图元的拖动操作,建立所述待创建的应用中不同的功能组件图元之间的关联关系;还结合功能组件图元和关联关系生成用于表征程序功能的业务功能模型,并根据组件模型和业务功能模型,生成应用的可执行代码。因此,将组件设计与业务功能设计有机结合,实现了在完整的应用开发过程中,用户基于图形化界面零代码开发,使得普通人员也能简单、快速开发程序功能,而且开发效率高。
示例二
本示例中,假设的待创建的应用、需使用的相关组件与上述示例一相同。
图9为应用本发明实施例的创建应用的装置创建应用的示例二的流程示意图,如图9所示,包括:
步骤901,组件设计模块记录用户设计的图片UI组件、按钮UI组件、拍照API组件的属性信息,生成组件模型,并根据组件模型渲染对应的预定义图元,重新生成组件界面图元;
步骤902,组件设计模块请求功能设计模块生成所有组件的功能组件模型;
步骤903,功能设计模块根据组件模型,生成功能组件模型;
步骤904,功能设计模块根据组件关键标识和功能组件关键标识建立映射关系;
上述步骤901~904可以采用与示例一相同的方式执行。
步骤905,以3D展现样式,图形化显示功能组件模型到功能设计模块;
具体地,在功能设计模块中分别为各功能组件模型增加DIV容器元素,所增加的DIV容器元素的位置为功能组件模型的坐标属性(x,y)的值,并设置DIV容器元素的ID为功能组件ID标识,设置DIV容器元素的innerHTML代码为功能组件模型的HTML代码,最终展现效果同组件设计模块中的组件展现效果完全一致,并重新设置API组件的容器的样式zindex属性值为0使拍照API作为底层展现,设置功能组件容器的style属性,增加CSS3的3D展现样式,使功能组件分层3D展示。
增加样式CSS代码例如为:
步骤906,自动联想功能组件模型属性,并图形化映射到图形化显示的功能组件(即功能组件界面图元)正上方的边线处;
具体地,例如:功能设计模块从功能组件模型中读取拍照按钮对应的事件属性值,即“click”;在拍照按钮功能组件左上方增加一个DIV展现容器;设置DIV文本(text)属性为“click”;为展现事件容器增加CSS3立体样式,使事件单元立体展示。
步骤907,功能设计模块记录用户通过对功能组件图元标注颜色,设计的功能组件关联关系,生成功能组件关联序列;
具体地,例如:用户单击拍照按钮组件的click事件单元;功能设计模块显示包含常见颜色表的颜色选择器;用户单击目标颜色选择标注颜色;记录标注的色彩码(#11ff11)、标注色彩的组件ID标识及事件名{object2.click},和时间戳(7/15/201210:13:26PM);以标注色彩的组件ID标识、标注颜色、时间戳生成图元标注序列,例如为:
{[object2,click,7/15/201210:13:26PM,#11ff11],[object3,takePicture,7/15/201210:13:27PM,#11ff11],[object1,7/15/201210:13:28PM,#11ff11]}
功能设计模块根据图元标注序列分析出业务功能步骤,并自动标注顺序码,生成功能组件关联序列,例如:拍照按钮功能组件的click单元标注为1,拍照API功能组件标注为2,图片功能组件标注为3,所生成的功能组件关联序列为:{object2.click:object3.takePicture,object3.out:object1}
步骤908,功能设计模块记录功能设计展示效果及功能组件模型,序列化功能设计容器代码JSON(JavaScript Object Notation)格式字符串及序列化功能组件模型JSON格式字符串并保存。
步骤909,功能设计模块根据组件模型、组件模型与功能组件模型的映射关系以及功能组件关联序列,生成业务功能模型并保存;
步骤910,代码生成模块根据组件模型、业务功能模型生成超文本标记语言(Hypertext Markup Language,HTML)和javascript代码。
上述步骤908~910可以采用与示例一相同的方式执行。
在上述示例中,功能设计模块以三维形式对功能组件图元进行显示,并且通过接收用户对功能组件图元的颜色标注操作,建立所述待创建的应用中不同的功能组件图元之间的关联关系;还结合功能组件图元和关联关系生成用于表征程序功能的业务功能模型,并根据组件模型和业务功能模型,生成应用的可执行代码。因此,将组件设计与业务功能设计有机结合,实现了在完整的应用开发过程中,用户基于图形化界面零代码开发,使得普通人员也能简单、快速开发程序功能,而且开发效率高。
图10为本发明另一实施例的创建应用的装置的结构示意图。该创建应用的装置设置在带有显示设备的终端上。如图10所示,该创建应用的装置100包括存储器110和与存储器连接的处理器120,其中:存储器110中存储一组程序代码,且处理器120用于调用存储器110中存储的程序代码,用于执行以下操作:
接收用户配置的组件属性的属性值,根据所述组件属性的属性值,生成组件模型,并根据所述组件模型渲染组件界面中所述组件模型的预定义图元,以获取与所述组件属性的属性值相应的组件界面图元;
将所述组件模型映射为功能组件模型,并根据所述组件界面图元将所述功能组件模型图形化显示为功能组件图元,根据用户对所述功能组件图元的操作,图形化建立待创建的应用中不同的所述功能组件图元之间的关联关系,并根据所述待创建的应用中不同的功能组件图元之间的关联关系生成业务功能模型;其中,所述功能组件图元包括功能组件界面图元和附属于所述功能组件界面图元的功能组件属性图元;
根据所述组件模型和所述业务功能模型,生成应用的可执行代码。
本发明实施例的创建应用的装置创建应用的具体流程与本发明实施例的创建应用的方法相同,故此处不再赘述。
根据本发明实施例的创建应用的装置,利用用户通过图形化组件界面配置的组件模型创建图形化的功能组件图元,并根据用户对图形化的功能组件图元的操作,确定实现应用时,各功能组件图元之间的关联关系;还结合功能组件图元和关联关系生成用于表征程序功能的业务功能模型,并根据组件模型和业务功能模型,生成应用的可执行代码。因此,将组件设计与业务功能设计有机结合,实现了在完整的应用创建过程中,用户基于图形化界面零代码开发,并且简化了应用的创建过程,而且应用的创建效率高。
进一步地,本发明实施例的创建应用的装置中,所述组件属性包括:组件界面展现格式、组件界面展现数据、组件显示层次、组件的位置坐标、组件触发事件名称、组件对外交互接口名称及接口相关参数的名称,以及组件类型。
进一步地,本发明实施例的创建应用的装置中,所述处理器还用于调用存储器中存储的程序代码,执行以下操作:
根据所述组件属性中的组件界面展现格式的属性值及组件界面展现数据的属性值,生成组件模型代码;
根据所述组件模型代码,生成所述组件界面图元。
进一步地,本发明实施例的创建应用的装置中,所述处理器还用于调用存储器中存储的程序代码,执行以下操作:
将所述组件模型的组件属性,映射为所述功能组件模型的功能组件属性;
将所述组件模型的组件关键标识,映射为所述功能组件模型的功能组件关键标识;根据所述组件模型的组件关键标识,获取所述功能组件关键标识对应的功能组件展现代码;或者,根据所述组件关键标识对应的组件模型的组件展现格式的属性值和组件界面展现数据的属性值,生成所述功能组件关键标识对应的功能组件展现代码;
根据所述组件关键标识对应的组件模型的位置坐标,在功能组件界面对应的位置坐标处,根据所述功能组件展现代码渲染功能组件图元。
进一步地,本发明实施例的创建应用的装置中,所述处理器还用于调用存储器中存储的程序代码,执行以下操作:
调用终端中预置的绘图工具的图形操作接口,根据所述组件关键标识对应的位置坐标,在功能组件界面对应的位置坐标处,根据所述功能组件展现代码,渲染功能组件界面图元;
根据所述组件模型的组件属性,自动联想映射所述功能组件属性图元。
进一步地,本发明实施例的创建应用的装置中,所述处理器还用于调用存储器中存储的程序代码,执行以下操作:
利用终端中预置的绘图工具的三维展现空间能力,自动建模所述功能组件图元的三维模型,并根据用户配置的组件显示层次进行分层显示。
进一步地,本发明实施例的创建应用的装置中,所述处理器还用于调用存储器中存储的程序代码,执行以下操作:
检索所有组件类型为API的功能组件图元;将API类型的功能组件界面图元的显示层次设置为最底层值,以在最底层显示所述API类型的功能组件界面图元;将API类型的功能组件界面图元对应的输入输出属性图元的显示层次,设置为所述API类型的功能组件界面图元的显示层次加1,以在所述API类型的功能组件界面图元的上方叠加显示附属的输入输出属性图元;
检索所有组件类型为UI的功能组件图元;根据所述UI类型的功能组件图元的显示层次,显示所述UI类型的功能组件图元。
进一步地,本发明实施例的创建应用的装置中,所述处理器还用于调用存储器中存储的程序代码,执行以下操作:
通过修改所述功能组件图元的显示层次,控制所述功能组件图元处于显示状态或隐藏状态。
进一步地,本发明实施例的创建应用的装置中,所述处理器还用于调用存储器中存储的程序代码,执行以下操作:
接收用户为所述功能组件图元进行颜色标注的标注颜色消息,所述标注颜色消息包括标注颜色、标注时间戳,以及功能组件图元对应的功能组件关键标识;
根据所述标注颜色、标注时间戳,以及功能组件图元对应的功能组件关键标识,生成图元标注序列;
根据所述图元标注序列,确定待创建的应用中不同的功能组件图元之间的关联关系。
进一步地,本发明实施例的创建应用的装置中,所述处理器还用于调用存储器中存储的程序代码,执行以下操作:
将所述功能组件图元的前景色,修改为所述标注颜色;
根据所述功能组件图元的前景色,以及所述功能组件图元对应的标注时间戳,自动生成用于指示应用功能逻辑的标注顺序码。
进一步地,本发明实施例的创建应用的装置中,所述处理器还用于调用存储器中存储的程序代码,执行以下操作:
在所述功能组件图元上自动增加容器元素,并设置所述容器元素的文本为所述标注顺序码。
进一步地,本发明实施例的创建应用的装置中,所述处理器还用于调用存储器中存储的程序代码,执行以下操作:
接收用户的拖动操作,自动画线连接所述拖动操作对应的源功能组件图元和目标功能组件图元,记录所述待创建的应用中不同的所述功能组件图元之间的关联关系。
进一步地,本发明实施例的创建应用的装置中,所述处理器还用于调用存储器中存储的程序代码,执行以下操作:
将所述组件模型的组件关键标识,添加任意字符串,生成所述功能组件关键标识。
进一步地,本发明实施例的创建应用的装置中,所述处理器还用于调用存储器中存储的程序代码,执行以下操作:
根据所述待创建的应用中不同功能组件图元之间的关联关系,生成功能组件图元关联序列;
根据所述图元关联序列、所述组件模型,以及所述组件模型与功能组件图元的映射关系,生成所述业务功能模型。
进一步地,本发明实施例的创建应用的装置中,所述图形化建立的所述待创建的应用中不同的所述功能组件图元之间的关联关系,是以树形结构分层或分级展示的。
进一步地,本发明实施例的创建应用的装置中,所述功能组件图元与相应的组件界面图元的展现效果一致。
进一步地,本发明实施例的创建应用的装置中,所述处理器还用于调用存储器中存储的程序代码,执行以下操作:
从所述业务功能模型中,读取UI类型的功能组件图元的属性;从所述组件界面中对应的UI组件的组件模型中,获取与所述UI类型的功能组件图元对应的已配置生成代码模板;根据所述UI类型的功能组件图元的属性,与所述对应的已配置生成代码模板,生成即时渲染组件代码;
从所述业务功能模型中,读取API类型的功能组件图元的属性;从所述组件界面中对应的API组件的组件模型中,获取与所述API类型的功能组件图元对应的已配置生成代码模板,并根据API组件声明的引用库生成引用类库代码;根据所述API类型的功能组件图元的属性、所述对应的已配置生成代码模板以及所述引用类库代码,生成API功能代码;
根据所述功能组件图元的属性和所述待创建的应用中不同功能组件图元之间的关联关系,生成用于控制所述UI组件和所述API组件交互的脚本代码;
根据所述即时渲染组件代码、所述API功能代码以及所述脚本代码,生成所述应用的可执行代码。
图11为本发明另一实施例的创建应用的装置的结构示意图,该装置包括至少一个处理器1101(例如CPU),至少一个网络接口1105或者其他通信接口,存储器1106,和至少一个通信总线1103,用于实现这些装置之间的连接通信。处理器1101用于执行存储器1106中存储的可执行模块,例如计算机程序。存储器1106可能包含高速随机存取存储器(RAM:Random Access Memory),也可能还包括非不稳定的存储器(non-volatile memory),例如至少一个磁盘存储器。通过至少一个网络接口1105(可以是有线或者无线)实现该系统网关与至少一个其他网元之间的通信连接,可以使用互联网,广域网,本地网,城域网等。
在一些实施方式中,存储器1106存储了程序11061,程序11061可以被处理器1101执行,这个程序包括:接收用户配置的组件属性的属性值,根据所述组件属性的属性值,生成组件模型,并根据所述组件模型渲染组件界面中所述组件模型的预定义图元,以获取与所述组件属性的属性值相应的组件界面图元;将所述组件模型映射为功能组件模型,并根据所述组件界面图元将所述功能组件模型图形化显示为功能组件图元,根据用户对所述功能组件图元的操作,图形化建立待创建的应用中不同的所述功能组件图元之间的关联关系,并根据所述待创建的应用中不同的所述功能组件图元之间的关联关系生成业务功能模型;根据所述组件模型和所述业务功能模型,生成所述应用的可执行代码。
本领域普通技术人员可以理解:实现上述各方法实施例的全部或部分步骤可以通过程序指令相关的硬件来完成。前述的程序可以存储于一计算机可读取存储介质中。该程序在执行时,执行包括上述各方法实施例的步骤;而前述的存储介质包括:ROM、RAM、磁碟或者光盘等各种可以存储程序代码的介质。
最后应说明的是:以上实施例仅用以说明本发明的技术方案,而非对其限制;尽管参照前述实施例对本发明进行了详细的说明,本领域的普通技术人员应当理解:其依然可以对前述各实施例所记载的技术方案进行修改,或者对其中部分技术特征进行等同替换;而这些修改或者替换,并不使相应技术方案的本质脱离本发明各实施例技术方案的精神和范围。
Claims (20)
1.一种创建应用的方法,该方法应用在带有显示设备的终端上,其特征在于,包括:
接收用户配置的组件属性的属性值,根据所述组件属性的属性值,生成组件模型,并根据所述组件模型渲染组件界面中所述组件模型的预定义图元,以获取与所述组件属性的属性值相应的组件界面图元;
将所述组件模型映射为功能组件模型,并根据所述组件界面图元将所述功能组件模型图形化显示为功能组件图元,根据用户对所述功能组件图元的操作,图形化建立待创建的应用中不同的所述功能组件图元之间的关联关系,并根据所述待创建的应用中不同的所述功能组件图元之间的关联关系生成业务功能模型;
根据所述组件模型和所述业务功能模型,生成所述待创建的应用的可执行代码。
2.根据权利要求1所述的创建应用的方法,其特征在于,所述根据所述组件模型渲染组件界面中所述组件模型的预定义图元,以获取与所述组件属性的属性值相应的组件界面图元,具体包括:
根据所述组件属性中的组件界面展现格式的属性值及组件界面展现数据的属性值,生成组件模型代码;
根据所述组件模型代码,生成所述组件界面图元。
3.根据权利要求1所述的创建应用的方法,其特征在于,所述将组件模型映射为功能组件模型,并根据所述组件界面图元将所述功能组件模型图形化显示为功能组件图元,具体包括:
将所述组件模型的组件属性,映射为所述功能组件模型的功能组件属性;
将所述组件模型的组件关键标识,映射为所述功能组件模型的功能组件关键标识;
根据所述组件模型的组件关键标识,获取所述功能组件关键标识对应的功能组件展现代码;或者,根据所述组件关键标识对应的组件模型的组件展现格式的属性值和组件界面展现数据的属性值,生成所述功能组件关键标识对应的功能组件展现代码;
根据所述组件关键标识对应的组件模型的位置坐标,在功能组件界面对应的位置坐标处,根据所述功能组件展现代码渲染所述功能组件图元。
4.根据权利要求3所述的创建应用的方法,其特征在于,所述根据所述组件关键标识对应的组件模型的位置坐标,在功能组件界面对应的位置坐标处,根据所述功能组件展现代码渲染功能组件图元,具体包括:
调用所述终端中预置的绘图工具的图形操作接口,根据所述组件关键标识对应的位置坐标,在功能组件界面对应的位置坐标处,根据所述功能组件展现代码渲染功能组件界面图元;
根据所述组件模型的组件属性,自动联想映射功能组件属性图元。
5.根据权利要求1所述的创建应用的方法,其特征在于,所述将所述功能组件模型图形化显示为功能组件图元,具体包括:
利用所述终端中预置的绘图工具的三维展现空间能力,自动建模所述功能组件图元的三维模型,并根据用户配置的组件显示层次进行分层显示。
6.根据权利要求5所述的创建应用的方法,其特征在于,所述根据用户配置的组件显示层次进行分层显示,具体包括:
检索所有组件类型为应用程序交互接口API的功能组件图元;将API类型的功能组件界面图元的显示层次设置为最底层值,以在最底层显示所述API类型的功能组件界面图元;将API类型的功能组件界面图元对应的输入输出属性图元的显示层次,设置为所述API类型的功能组件界面图元的显示层次加1,以在所述API类型的功能组件界面图元的上方叠加显示附属的输入输出属性图元;
检索所有组件类型为可视化用户交互界面UI类型的功能组件图元;根据所述UI类型的功能组件图元的显示层次,显示所述UI类型的功能组件图元。
7.根据权利要求1所述的创建应用的方法,其特征在于,所述根据用户对所述功能组件图元的操作,图形化建立待创建的应用中不同的所述功能组件图元之间的关联关系,具体包括:
接收用户为所述功能组件图元进行颜色标注的标注颜色消息,所述标注颜色消息包括标注颜色、标注时间戳,以及功能组件图元对应的功能组件关键标识;
根据所述标注颜色、标注时间戳,以及功能组件图元对应的功能组件关键标识,生成图元标注序列;
根据所述图元标注序列,确定所述待创建的应用中不同的所述功能组件图元之间的关联关系。
8.根据权利要求7所述的创建应用的方法,其特征在于,所述根据所述图元标注序列,确定所述待创建的应用中不同的所述功能组件图元之间的关联关系,具体包括:
将所述功能组件图元的前景色,修改为所述标注颜色;
根据所述功能组件图元的前景色,以及所述功能组件图元对应的标注时间戳,自动生成用于指示应用功能逻辑的标注顺序码。
9.根据权利要求1-8任一所述的创建应用的方法,其特征在于,所述根据所述待创建的应用中不同的所述功能组件图元之间的关联关系生成业务功能模型,具体包括:
根据所述待创建的应用中不同的所述功能组件图元之间的关联关系,生成功能组件图元关联序列;
根据所述图元关联序列、所述组件模型以及所述组件模型与功能组件图元的映射关系,生成所述业务功能模型。
10.根据权利要求1-8任一所述的创建应用的方法,其特征在于,所述根据所述组件模型和所述业务功能模型,生成应用的可执行代码,具体包括:
从所述业务功能模型中,读取可视化用户交互界面UI类型的功能组件图元的属性;从所述组件界面中对应的UI组件的组件模型中,获取与所述UI类型的功能组件图元对应的已配置生成代码模板;根据所述UI类型的功能组件图元的属性,与所述对应的已配置生成代码模板,生成即时渲染组件代码;
从所述业务功能模型中,读取应用程序交互接口API类型的功能组件图元的属性;从所述组件界面中对应的API组件的组件模型中,获取与所述API类型的功能组件图元对应的已配置生成代码模板,并根据API组件声明的引用库生成引用类库代码;根据所述API类型的功能组件图元的属性、所述对应的已配置生成代码模板以及所述引用类库代码,生成API功能代码;
根据所述功能组件图元的属性和所述待创建的应用中不同的所述功能组件图元之间的关联关系,生成用于控制所述UI组件和所述API组件交互的脚本代码;
根据所述即时渲染组件代码、所述API功能代码以及所述脚本代码,生成所述应用的可执行代码。
11.一种创建应用的装置,设置在带有显示设备的终端上,其特征在于,包括组件模型、组件设计模块、功能设计模块以及代码生成模块,其中:
所述组件设计模块,用于接收用户配置的组件属性的属性值,根据所述组件属性的属性值,生成组件模型,并根据所述组件模型渲染组件界面中所述组件模型的预定义图元,以获取与所述组件属性的属性值相应的组件界面图元;
所述功能设计模块,用于将所述组件模型映射为功能组件模型,并根据所述组件界面图元将所述功能组件模型图形化显示为功能组件图元,根据用户对所述功能组件图元的操作,图形化建立待创建的应用中不同的所述功能组件图元之间的关联关系,并根据所述待创建的应用中不同的所述功能组件图元之间的关联关系生成业务功能模型;
所述代码生成模块,用于根据所述组件模型和所述业务功能模型,生成所述待创建的应用的可执行代码。
12.根据权利要求11所述的创建应用的装置,其特征在于,所述组件设计模块具体用于:
根据所述组件属性中的组件界面展现格式的属性值及组件界面展现数据的属性值,生成组件模型代码;
根据所述组件模型代码,生成所述组件界面图元。
13.根据权利要求11所述的创建应用的装置,其特征在于,所述功能设计模块具体用于:
将所述组件模型的组件属性,映射为所述功能组件模型的功能组件属性;
将所述组件模型的组件关键标识,映射为所述功能组件模型的功能组件关键标识;
根据所述组件模型的组件关键标识,获取所述功能组件关键标识对应的功能组件展现代码;或者,根据所述组件关键标识对应的组件模型的组件展现格式的属性值和组件界面展现数据的属性值,生成所述功能组件关键标识对应的功能组件展现代码;
根据所述组件关键标识对应的组件模型的位置坐标,在功能组件界面对应的位置坐标处,根据所述功能组件展现代码渲染所述功能组件图元。
14.根据权利要求13所述的创建应用的装置,其特征在于,所述功能设计模块进一步用于:
调用所述终端中预置的绘图工具的图形操作接口,根据所述组件关键标识对应的位置坐标,在功能组件界面对应的位置坐标处,根据所述功能组件展现代码渲染功能组件界面图元;
根据所述组件模型的组件属性,自动联想映射功能组件属性图元。
15.根据权利要求11所述的创建应用的装置,其特征在于,所述功能设计模块进一步用于:
利用所述终端中预置的绘图工具的三维展现空间能力,自动建模所述功能组件图元的三维模型,并根据用户配置的组件显示层次进行分层显示。
16.根据权利要求15所述的创建应用的装置,其特征在于,所述功能设计模块具体用于:
检索所有组件类型为应用程序交互接口API的功能组件图元;将API类型的功能组件界面图元的显示层次设置为最底层值,以在最底层显示所述API类型的功能组件界面图元;将API类型的功能组件界面图元对应的输入输出属性图元的显示层次,设置为所述API类型的功能组件界面图元的显示层次加1,以在所述API类型的功能组件界面图元的上方叠加显示附属的输入输出属性图元;
检索所有组件类型为可视化用户交互界面UI的功能组件图元;根据所述UI类型的功能组件图元的显示层次,显示所述UI类型的功能组件图元。
17.根据权利要求11所述的创建应用的装置,其特征在于,所述功能设计模块进一步用于:
接收用户为所述功能组件图元进行颜色标注的标注颜色消息,所述标注颜色消息包括标注颜色、标注时间戳,以及功能组件图元对应的功能组件关键标识;
根据所述标注颜色、标注时间戳,以及功能组件图元对应的功能组件关键标识,生成图元标注序列;
根据所述图元标注序列,确定所述待创建的应用中不同的所述功能组件图元之间的关联关系。
18.根据权利要求17所述的创建应用的装置,其特征在于,所述功能设计模块进一步用于:
将所述功能组件图元的前景色,修改为所述标注颜色;
根据所述功能组件图元的前景色,以及所述功能组件图元对应的标注时间戳,自动生成用于指示应用功能逻辑的标注顺序码。
19.根据权利要求11-18任一所述的创建应用的装置,其特征在于,所述功能设计模块进一步用于:
根据所述待创建的应用中不同的所述功能组件图元之间的关联关系,生成功能组件图元关联序列;
根据所述图元关联序列、所述组件模型以及所述组件模型与功能组件图元的映射关系,生成所述业务功能模型。
20.根据权利要求11-18任一所述的创建应用的装置,其特征在于,所述代码生成模块,具体用于:
从所述业务功能模型中,读取可视化用户交互界面UI类型的功能组件图元的属性;从所述组件界面中对应的UI组件的组件模型中,获取与所述UI类型的功能组件图元对应的已配置生成代码模板;根据所述UI类型的功能组件图元的属性,与所述对应的已配置生成代码模板,生成即时渲染组件代码;
从所述业务功能模型中,读取应用程序交互接口API类型的功能组件图元的属性;从所述组件界面中对应的API组件的组件模型中,获取与所述API类型的功能组件图元对应的已配置生成代码模板,并根据API组件声明的引用库生成引用类库代码;根据所述API类型的功能组件图元的属性、所述对应的已配置生成代码模板以及所述引用类库代码,生成API功能代码;
根据所述功能组件图元的属性和所述待创建的应用中不同的所述功能组件图元之间的关联关系,生成用于控制所述UI组件和所述API组件交互的脚本代码;
根据所述即时渲染组件代码、所述API功能代码,以及所述脚本代码,生成所述应用的可执行代码。
Priority Applications (3)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN201310213242.4A CN104216691B (zh) | 2013-05-31 | 2013-05-31 | 一种创建应用的方法及装置 |
PCT/CN2014/075532 WO2014190821A1 (zh) | 2013-05-31 | 2014-04-16 | 一种创建应用的方法及装置 |
US14/953,912 US9720658B2 (en) | 2013-05-31 | 2015-11-30 | Application creation method and apparatus |
Applications Claiming Priority (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN201310213242.4A CN104216691B (zh) | 2013-05-31 | 2013-05-31 | 一种创建应用的方法及装置 |
Publications (2)
Publication Number | Publication Date |
---|---|
CN104216691A CN104216691A (zh) | 2014-12-17 |
CN104216691B true CN104216691B (zh) | 2017-11-17 |
Family
ID=51987976
Family Applications (1)
Application Number | Title | Priority Date | Filing Date |
---|---|---|---|
CN201310213242.4A Active CN104216691B (zh) | 2013-05-31 | 2013-05-31 | 一种创建应用的方法及装置 |
Country Status (3)
Country | Link |
---|---|
US (1) | US9720658B2 (zh) |
CN (1) | CN104216691B (zh) |
WO (1) | WO2014190821A1 (zh) |
Families Citing this family (51)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
US10127023B2 (en) * | 2013-09-20 | 2018-11-13 | Oracle International Corporation | Computer-aided development of native mobile application code |
US9588742B2 (en) | 2013-09-20 | 2017-03-07 | Oracle International Corporation | Rule-based automatic class generation from a JSON message |
US9858321B2 (en) | 2013-09-20 | 2018-01-02 | Oracle International Corporation | Accessing application services from forms |
FR3038087B1 (fr) * | 2015-06-29 | 2018-08-10 | Commissariat A L'energie Atomique Et Aux Energies Alternatives | Procede d'execution d'un programme d'ordinateur comportant une fonction parametree |
CN105138322B (zh) * | 2015-08-05 | 2018-10-19 | 移康智能科技(上海)股份有限公司 | 生成应用程序的方法及系统 |
CN105094847B (zh) * | 2015-08-24 | 2018-09-07 | 佛吉亚好帮手电子科技有限公司 | 基于安卓系统的多图层可定制的按钮控件实现方法及系统 |
CN105224332B (zh) * | 2015-10-14 | 2019-06-11 | 深圳市金证科技股份有限公司 | 一种应用程序生成方法和装置 |
US10180900B2 (en) * | 2016-04-15 | 2019-01-15 | Red Hat Israel, Ltd. | Recordation of user interface events for script generation |
CN106484394B (zh) * | 2016-09-13 | 2019-07-12 | 厦门兆慧网络科技有限公司 | 一种双引擎快速软件开发系统 |
CN106502680B (zh) * | 2016-10-31 | 2019-08-16 | 用友网络科技股份有限公司 | 一种通过可视化界面进行图元扩展的方法 |
CN108279890B (zh) * | 2017-01-06 | 2021-12-24 | 阿里巴巴集团控股有限公司 | 组件发布方法、组件构建方法及图形化机器学习算法平台 |
CN108334387B (zh) * | 2017-01-20 | 2021-03-16 | 阿里巴巴集团控股有限公司 | 动态界面渲染方法及装置 |
CN108519877A (zh) * | 2017-02-28 | 2018-09-11 | 广东智源信息技术有限公司 | 一种基于配置式的开发模型 |
CN109240706A (zh) * | 2017-05-09 | 2019-01-18 | 北京京东尚科信息技术有限公司 | 用于配置系统业务的方法、装置及电子设备 |
US10275292B1 (en) * | 2017-06-27 | 2019-04-30 | Northrup Grumman Systems Corporation | Shadow Java classes provide private metadata |
CN109542544A (zh) * | 2017-09-22 | 2019-03-29 | 北京小度信息科技有限公司 | 界面显示方法及装置 |
CN107807814B (zh) * | 2017-09-27 | 2021-10-26 | 百度在线网络技术(北京)有限公司 | 应用组件的构建方法、装置、设备及计算机可读存储介质 |
US11321614B2 (en) | 2017-09-29 | 2022-05-03 | Oracle International Corporation | Directed trajectories through communication decision tree using iterative artificial intelligence |
US11481641B2 (en) | 2017-09-29 | 2022-10-25 | Oracle International Corporation | Methods and systems for configuring communication decision trees based on connected positionable elements on canvas |
US11327471B2 (en) * | 2017-10-26 | 2022-05-10 | Siemens Aktiengesellschaft | Building and tracking of an automation engineering environment |
CN108415695A (zh) * | 2018-01-25 | 2018-08-17 | 新智数字科技有限公司 | 一种基于可视化组件的数据处理方法、装置和设备 |
CN110362306A (zh) * | 2018-04-11 | 2019-10-22 | 阿里巴巴集团控股有限公司 | 图形化算法组件的自定义方法、模型生成方法及装置 |
CN110471656B (zh) * | 2018-05-10 | 2024-09-20 | 北京京东尚科信息技术有限公司 | 组件层级的调整方法和装置 |
CN109040822B (zh) * | 2018-07-16 | 2021-06-22 | 北京奇艺世纪科技有限公司 | 播放器配置方法及装置、存储介质 |
CN110955474B (zh) * | 2018-09-27 | 2023-09-05 | 杭州海康威视系统技术有限公司 | 一种应用系统中业务添加、业务调用方法、装置及设备 |
CN109491735B (zh) * | 2018-10-16 | 2022-01-28 | 南京轨道交通系统工程有限公司 | 集成数据生成与校验的综合监控人机界面组态实现方法 |
CN109445774A (zh) * | 2018-10-24 | 2019-03-08 | 北京奇虎科技有限公司 | 基于图元化操作的业务处理方法及装置 |
CN109324789A (zh) * | 2018-11-01 | 2019-02-12 | 广州南洋理工职业学院 | 一种软件开发方法 |
CN109646955B (zh) * | 2018-12-20 | 2022-06-24 | 网易(杭州)网络有限公司 | 游戏界面生成方法、装置和存储介质 |
CN109683939B (zh) * | 2018-12-29 | 2023-05-02 | 北京小米移动软件有限公司 | 组件对象更新方法、装置以及存储介质 |
WO2020194186A1 (en) * | 2019-03-25 | 2020-10-01 | Aurora Labs Ltd. | Generating and signing a line-of-code behavior and relation model |
CN110058985A (zh) * | 2019-04-09 | 2019-07-26 | 美林数据技术股份有限公司 | 一种拖拽式构建企业级ai应用的系统及方法 |
CN112099779B (zh) * | 2019-06-18 | 2024-09-27 | 深圳云天励飞技术有限公司 | 一种可视化操作界面生成的方法及相关装置 |
CN110244942B (zh) * | 2019-06-19 | 2023-03-21 | 优信拍(北京)信息科技有限公司 | 一种页面生成方法、装置及系统 |
CN110955452B (zh) * | 2019-09-05 | 2021-03-05 | 华为技术有限公司 | 一种非侵入式交互方法及电子设备 |
CN110989976A (zh) * | 2019-11-29 | 2020-04-10 | 北京美络克思科技有限公司 | 基于J2EE的Web应用的组件化开发方法、存储介质和电子设备 |
CN111198674B (zh) * | 2019-12-23 | 2021-10-15 | 华为技术有限公司 | 一种软件架构的可视化方法及装置 |
WO2021129812A1 (zh) * | 2019-12-26 | 2021-07-01 | 第四范式(北京)技术有限公司 | 运行人工智能应用的方法、系统及设备 |
CN111158797A (zh) * | 2019-12-26 | 2020-05-15 | 第四范式(北京)技术有限公司 | 运行人工智能应用的方法、系统及引擎装置 |
CN111158651A (zh) * | 2019-12-26 | 2020-05-15 | 第四范式(北京)技术有限公司 | 构建人工智能应用的方法、装置及系统 |
CN112562845A (zh) * | 2020-02-29 | 2021-03-26 | 华为技术有限公司 | 一种应用程序的生成方法与装置 |
CN111538498A (zh) * | 2020-04-14 | 2020-08-14 | 北京宝兰德软件股份有限公司 | 一种应用创建方法、装置、电子设备及存储介质 |
CN113918138A (zh) * | 2020-07-09 | 2022-01-11 | 阿里巴巴集团控股有限公司 | 流程处理方法、装置及计算机系统 |
US12013777B2 (en) * | 2020-08-26 | 2024-06-18 | Spirent Communications, Inc. | Controlling heterogeneous component-based testing in a portable automation framework with test scripts in both API mode and UI mode |
US11449414B2 (en) | 2020-08-26 | 2022-09-20 | Spirent Communications, Inc. | Mapping test parameter data elements during heterogeneous component-based testing in a portable automation framework in both API mode and UI mode |
US11216347B1 (en) | 2020-08-26 | 2022-01-04 | Spirent Communications, Inc. | Automatically locating resources using alternative locator expressions during heterogeneous component-based testing in a portable automation framework |
CN112256276A (zh) * | 2020-10-30 | 2021-01-22 | 上海锘科智能科技有限公司 | 定义边缘设备行为的方法、装置及存储介质 |
CN112783483B (zh) * | 2021-01-22 | 2024-08-27 | 平安普惠企业管理有限公司 | 基于悬浮按钮组件的功能创建方法、装置、设备及介质 |
CN114064188A (zh) * | 2022-01-18 | 2022-02-18 | 深圳微迅信息科技有限公司 | 一种监控界面的设计方法、设计装置及电子设备 |
CN114721647B (zh) * | 2022-06-10 | 2022-09-16 | 杭州普数软件有限公司 | 一种基于无代码应用开发的面向对象编程方法 |
US20240078354A1 (en) * | 2022-09-01 | 2024-03-07 | Rockwell Automation Technologies, Inc. | System and methods for modeling capabilities within system models of industrial systems |
Citations (5)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN1441346A (zh) * | 2002-02-26 | 2003-09-10 | 三星电子株式会社 | 图形用户界面修改方法和记录介质 |
CN1459719A (zh) * | 2002-05-17 | 2003-12-03 | 义隆电子股份有限公司 | 图形化开发程序的系统及方法 |
US7631265B1 (en) * | 2000-12-29 | 2009-12-08 | Gateway, Inc. | System and method for configuring and loading a user interface |
US7979243B1 (en) * | 2005-05-13 | 2011-07-12 | The Mathworks, Inc. | System and method for graphical model processing |
CN102654833A (zh) * | 2012-02-01 | 2012-09-05 | 中兴通讯(香港)有限公司 | 一种手机应用开发方法和系统 |
Family Cites Families (33)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
US6225998B1 (en) * | 1997-12-02 | 2001-05-01 | Aspect Communications | Visual design of workflows for transaction processing |
WO2001082071A1 (en) * | 2000-04-21 | 2001-11-01 | Togethersoft Corporation | Methods and systems for supporting and deploying distributed computing components |
US7039875B2 (en) * | 2000-11-30 | 2006-05-02 | Lucent Technologies Inc. | Computer user interfaces that are generated as needed |
US7367028B2 (en) * | 2001-08-14 | 2008-04-29 | National Instruments Corporation | Graphically deploying programs on devices in a system |
US6985939B2 (en) * | 2001-09-19 | 2006-01-10 | International Business Machines Corporation | Building distributed software services as aggregations of other services |
US20040036719A1 (en) | 2002-08-26 | 2004-02-26 | Van Treeck George Michael | Quicker development of database applications having a graphical user interface |
US20040090458A1 (en) * | 2002-11-12 | 2004-05-13 | Yu John Chung Wah | Method and apparatus for previewing GUI design and providing screen-to-source association |
US20060015844A1 (en) * | 2003-07-30 | 2006-01-19 | Wrd Corporation | Automatic hardware and firmware generation for multi-function custom controls |
CA2443454A1 (en) * | 2003-09-11 | 2005-03-11 | Teamplate Inc. | Data binding method in workflow system |
US8527943B1 (en) * | 2004-02-12 | 2013-09-03 | Raju V. Chiluvuri | System and method of application development |
US7827527B1 (en) * | 2004-02-12 | 2010-11-02 | Chiluvuri Raju V | System and method of application development |
US7849440B1 (en) * | 2004-04-16 | 2010-12-07 | The Mathworks, Inc. | Real-time code preview for a model based development process |
EP1782366A2 (en) * | 2004-06-04 | 2007-05-09 | Sap Ag | Consistent set of interfaces derived from a business object |
CN101052948A (zh) * | 2004-09-10 | 2007-10-10 | 图形公司 | 对象过程图应用程序开发系统 |
US8170901B2 (en) * | 2004-10-01 | 2012-05-01 | Microsoft Corporation | Extensible framework for designing workflows |
US8478616B2 (en) * | 2004-10-29 | 2013-07-02 | FrontRange Solutions USA Inc. | Business application development and execution environment |
GB0426240D0 (en) * | 2004-11-30 | 2004-12-29 | Ibm | Defining expressions in a meta-object model of an application |
US7681176B2 (en) | 2005-03-04 | 2010-03-16 | Microsoft Corporation | Generating a graphical designer application for developing graphical models |
US7493594B2 (en) * | 2005-03-14 | 2009-02-17 | Research In Motion | System and method for designing component based applications |
US20080059504A1 (en) * | 2005-11-30 | 2008-03-06 | Jackie Barbetta | Method and system for rendering graphical user interface |
US8112739B2 (en) * | 2005-12-01 | 2012-02-07 | Cypress Semiconductor Corporation | Data driven transfer functions |
US8176468B2 (en) * | 2005-12-01 | 2012-05-08 | Cypress Semiconductor Corporation | Multivariable transfer functions |
US7716634B2 (en) * | 2006-01-19 | 2010-05-11 | Medseek Inc. | System and method for building and modifying software applications |
WO2007140237A2 (en) * | 2006-05-24 | 2007-12-06 | 170 Systems, Inc. | System for and method of providing a user interface for a computer-based software application |
WO2008021433A2 (en) * | 2006-08-14 | 2008-02-21 | Payman Khodabandehloo | Design tool and methodology for enterprise software applications |
CN100520716C (zh) * | 2007-08-28 | 2009-07-29 | 北京中企开源信息技术有限公司 | 一种基于模型组件的代码自动生成装置、系统及方法 |
US9501751B1 (en) * | 2008-04-10 | 2016-11-22 | Versionone, Inc. | Virtual interactive taskboard for tracking agile software development |
US8635177B2 (en) * | 2009-08-17 | 2014-01-21 | Adobe Systems Incorporated | Rule-based binding |
US9424005B1 (en) * | 2009-12-09 | 2016-08-23 | The Mathworks, Inc. | Templatized component |
US8966447B2 (en) * | 2010-06-21 | 2015-02-24 | Apple Inc. | Capturing and displaying state of automated user-level testing of a graphical user interface application |
US8869052B2 (en) * | 2010-11-30 | 2014-10-21 | Sap Se | Context-dependent object types in an integrated development environment |
CN102222006A (zh) * | 2011-07-22 | 2011-10-19 | 武汉天喻信息产业股份有限公司 | 移动Widget用户界面的实现方法及装置 |
CN102609271B (zh) * | 2012-02-20 | 2014-09-10 | 山东大学 | 一种元数据驱动的SaaS应用的可视化定制方法及系统 |
-
2013
- 2013-05-31 CN CN201310213242.4A patent/CN104216691B/zh active Active
-
2014
- 2014-04-16 WO PCT/CN2014/075532 patent/WO2014190821A1/zh active Application Filing
-
2015
- 2015-11-30 US US14/953,912 patent/US9720658B2/en active Active
Patent Citations (5)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
US7631265B1 (en) * | 2000-12-29 | 2009-12-08 | Gateway, Inc. | System and method for configuring and loading a user interface |
CN1441346A (zh) * | 2002-02-26 | 2003-09-10 | 三星电子株式会社 | 图形用户界面修改方法和记录介质 |
CN1459719A (zh) * | 2002-05-17 | 2003-12-03 | 义隆电子股份有限公司 | 图形化开发程序的系统及方法 |
US7979243B1 (en) * | 2005-05-13 | 2011-07-12 | The Mathworks, Inc. | System and method for graphical model processing |
CN102654833A (zh) * | 2012-02-01 | 2012-09-05 | 中兴通讯(香港)有限公司 | 一种手机应用开发方法和系统 |
Also Published As
Publication number | Publication date |
---|---|
WO2014190821A1 (zh) | 2014-12-04 |
US9720658B2 (en) | 2017-08-01 |
US20160085520A1 (en) | 2016-03-24 |
CN104216691A (zh) | 2014-12-17 |
Similar Documents
Publication | Publication Date | Title |
---|---|---|
CN104216691B (zh) | 一种创建应用的方法及装置 | |
US7873946B2 (en) | Scalable vector graphics, tree and tab as drag and drop objects | |
US8370750B2 (en) | Technology for generating service program | |
US8194075B2 (en) | Method and system for generating and displaying an interactive dynamic list view of multiply connected objects | |
AU2009225393B2 (en) | File access via conduit application | |
CN112364496B (zh) | 基于html5和vue技术的航电仿真面板生成系统 | |
CN109375914A (zh) | 信息远程交互方法和系统 | |
CN109583591A (zh) | 用于简化的知识工程的方法与系统 | |
CN106846431B (zh) | 一种支持多表现形式的统一Web图形绘制系统 | |
CN114816380A (zh) | 一种面向医疗机构的低代码平台 | |
CN114548056A (zh) | 富文本编辑方法、装置及设备 | |
CN113094144A (zh) | 显示屏界面控制方法及电子设备 | |
Kuan | Learning highcharts 4 | |
Dessart et al. | Animated transitions between user interface views | |
CN114706584A (zh) | 一种数据可视化展示制作系统 | |
Schwarz | The Designer’s Guide to Figma: Master Prototyping, Collaboration, Handoff, and Workflow | |
CN115691772A (zh) | 运营可视化系统及相应计算机设备和存储介质 | |
CN112269960B (zh) | 基于关联报表的网页更新方法、系统、设备及存储介质 | |
CN119251420A (zh) | 兴趣点建模方法、电子设备和存储介质 | |
CN118916437A (zh) | 一种矢量瓦片样式的转换方法、装置、设备及介质 | |
Forcignano | Digital Twin for collaborative spaces and Web Applications development in the context of Industry 4.0 | |
CN119311260A (zh) | 一种可视化操作界面中的组件标识方法、装置、设备及介质 | |
WO2023093327A1 (zh) | 目标程序的测试方法、装置、设备及存储介质 | |
CN119576450A (zh) | 一种静态场景数据生成动态可视化渲染文件的方法、装置及设备 | |
CN118885530A (zh) | 工业数据可视化处理方法、装置、电子设备及存储介质 |
Legal Events
Date | Code | Title | Description |
---|---|---|---|
C06 | Publication | ||
PB01 | Publication | ||
C10 | Entry into substantive examination | ||
SE01 | Entry into force of request for substantive examination | ||
GR01 | Patent grant | ||
GR01 | Patent grant |