CN109101304A - 界面的自动生成方法、装置、电子设备和计算机可读介质 - Google Patents
界面的自动生成方法、装置、电子设备和计算机可读介质 Download PDFInfo
- Publication number
- CN109101304A CN109101304A CN201810733105.6A CN201810733105A CN109101304A CN 109101304 A CN109101304 A CN 109101304A CN 201810733105 A CN201810733105 A CN 201810733105A CN 109101304 A CN109101304 A CN 109101304A
- Authority
- CN
- China
- Prior art keywords
- interface
- configuration file
- data
- file
- component
- 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.)
- Pending
Links
Classifications
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F9/00—Arrangements for program control, e.g. control units
- G06F9/06—Arrangements for program control, e.g. control units using stored programs, i.e. using an internal store of processing equipment to receive or retain programs
- G06F9/44—Arrangements for executing specific programs
- G06F9/451—Execution arrangements for user interfaces
Landscapes
- Engineering & Computer Science (AREA)
- Software Systems (AREA)
- Theoretical Computer Science (AREA)
- Human Computer Interaction (AREA)
- Physics & Mathematics (AREA)
- General Engineering & Computer Science (AREA)
- General Physics & Mathematics (AREA)
- User Interface Of Digital Computer (AREA)
Abstract
本公开公开一种界面的自动生成方法、界面的自动生成装置、电子设备和计算机可读存储介质。其中,该界面的自动生成方法包括:获取配置文件,所述配置文件包括所述界面的布局属性;获取数据文件,所述数据文件与所述配置文件对应;解析所述配置文件,从所述配置文件中解析所述布局属性;解析所述数据文件,从所述数据文件中解析出数据;基于所述布局属性和数据,生成所述界面。本公开实施例通过采取该技术方案,可以获取配置文件和数据后进行解析得到布局属性和数据,然后,基于布局属性和数据生成界面,提高了界面的生成效率,并使得界面的修改变得更加容易,从而提高了用户体验效果。
Description
技术领域
本公开涉及一种界面处理技术领域,特别是涉及一种界面的自动生成方法,装置、电子设备和计算机可读存储介质。
背景技术
界面,也称为,UI,UI即UserInterface(用户界面)的简称,UI设计是指对软件的人机交互、操作逻辑、界面美观的整体设计。UI设计分为实体UI和虚拟UI。
现有技术中的界面一般采用设计师手工设计或者使用具体的编程语言(如C++)编写界面,这些方法的生成的界面美感不足,界面的生成难度大,生成效率低,且生成后的界面难以修改,更不能将已生成的界面进行复用,用户体验差。
对此,提供一种高效生成且易于修改和复用的界面的自动生成方法是亟需解决的技术问题。
发明内容
本公开解决的技术问题是提供一种界面的自动生成方法,以至少部分地解决如何提高界面的生成效率及使得生成后的界面易于修改和复用并提高用户体验的技术问题。此外,还提供一种界面的自动生成装置、电子设备和计算机可读存储介质。
为了实现上述目的,根据本公开的一个方面,提供以下技术方案:
一种界面的自动生成方法,包括:
读取配置文件,所述配置文件包括所述界面的布局属性;
读取数据文件,所述数据文件与所述配置文件对应;
解析所述配置文件,从所述配置文件中解析所述布局属性;
解析所述数据文件,从所述数据文件中解析出数据;
基于所述布局属性和数据,生成所述界面。
进一步地,所述布局属性包括:所述界面的位置和尺寸;
所述界面中的组件类型、组件位置、组件尺寸和/或组件所需资源。
进一步地,在读取配置文件之前,还包括:获取当前界面的节点ID;
基于所述当前界面的节点ID,获取与当前界面对应的配置文件。
进一步地,所述组件类型包括输入组件、下拉组件、滑动组件、点击组件或选择组件。
进一步地,所述组件位置为组件的中心点在显示屏上的坐标;或者,
所述组件位置为组件的中心点在所述界面中的相对坐标。
进一步地,所述组件尺寸包括组件的形状以及组件的形状的大小,其中所述形状的大小不超过所述界面的尺寸。
进一步地,当所述界面中的组件接收到数据时,将所述数据回传至所述配置文件中;
与接收数据的组件相对应的处理程序从配置文件中读取所述数据。
进一步地,构成所述界面的所有节点形成树形结构,所述布局属性还包括:所述界面的子界面位置和尺寸,所述界面的节点为所述子界面的子节点的父节点。
进一步地,在读取配置文件之前,还包括:接收布局属性设置命令,基于所述布局属性设置命令创建配置文件。
进一步地,在显示装置上实时显示基于所述布局属性和数据生成所述界面的预览。
为了实现上述目的,根据本公开的另一个方面,还提供以下技术方案:
一种界面的自动生成装置,其特征在于,包括:
配置文件读取模块,用于读取配置文件,所述配置文件包括所述界面的布局属性;
数据文件读取模块,用于读取数据文件,所述数据文件与所述配置文件对应
配置文件解析模块,用于解析所述配置文件,从所述配置文件中解析所述布局属性;
数据文件解析模块,用于解析所述数据文件,从所述数据文件中解析出数据
界面生成模块,用于基于所述布局属性和数据,生成所述界面。
进一步地,所述布局属性包括:
所述界面的位置和尺寸;
所述界面中的组件类型、组件位置、组件尺寸和/或组件所需资源。
进一步地,还包括:
配置文件获取模块,用于在读取模块读取配置文件之前获取当前界面的节点ID,并基于当前界面的节点ID,获取与当前界面对应的配置文件。
进一步地,所述组件类型包括输入组件、下拉组件、滑动组件、点击组件或选择组件。
进一步地,所述组件位置为组件的中心点在显示屏上的坐标;或者,所述组件位置为组件的中心点在所述界面中的相对坐标。
进一步地,所述组件尺寸包括组件的形状以及组件的形状的大小,其中所述形状的大小不超过所述界面的尺寸。
进一步地,当界面中的组件接收到数据时,将所述数据回传至配置文件中;
处理程序从所述配置文件中读取所述数据,其中所述处理程序与接收到数据的组件相对应。
进一步地,构成所述界面的所有节点形成树形结构,所述布局属性还包括:所述界面的子界面位置和尺寸,所述界面的节点为所述子界面的子节点的父节点。
进一步地,还包括:
布局属性设置命令接收模块,用于在读取模块读取配置文件之前接收布局属性设置命令,基于所述布局属性设置命令创建配置文件。
进一步地,在显示装置上实时显示基于所述布局属性和数据生成所述界面的预览。
为了实现上述目的,根据本公开的又一个方面,还提供以下技术方案:
一种电子设备,其特征在于,所述电子设备包括:
至少一个处理器;以及,
与所述至少一个处理器通信连接的存储器;其中,
所述存储器存储有能被所述至少一个处理器执行的指令,所述指令被所述至少一个处理器执行,以使所述至少一个处理器能够执行上述任一界面的自动生成方法技术方案中所述的步骤。
为了实现上述目的,根据本公开的又一个方面,还提供以下技术方案:
一种非暂态计算机可读存储介质,其特征在于,该非暂态计算机可读存储介质存储计算机指令,该计算机指令用于使计算机执行上述任一界面的自动生成方法技术方案中所述的步骤。
本公开实施例提供一种界面的自动生成方法、界面的自动生成装置、电子设备和计算机可读存储介质。其中,该界面的自动生成方法包括:获取配置文件,所述配置文件包括所述界面的布局属性;获取数据文件,所述数据文件与所述配置文件对应;解析所述配置文件,从所述配置文件中解析所述布局属性;解析所述数据文件,从所述数据文件中解析出数据;基于所述布局属性和数据,生成所述界面。本公开实施例通过采取该技术方案,可以获取配置文件和数据后进行解析得到布局属性和数据,然后,基于布局属性和数据生成界面,提高了界面的生成效率,并使得界面的修改变得更加容易,从而提高了用户体验效果。
上述说明仅是本公开技术方案的概述,为了能更清楚了解本公开的技术手段,而可依照说明书的内容予以实施,并且为让本公开的上述和其他目的、特征和优点能够更明显易懂,以下特举较佳实施例,并配合附图,详细说明如下。
附图说明
图1为根据本公开一个实施例的界面的自动生成方法的流程示意图。
图2为根据本公开另一个实施例的界面的自动生成方法的流程示意图。
图3为根据本公开一个实施例的界面的自动生成装置的结构示意图。
图4为根据本公开另一个实施例的界面的自动生成装置的结构示意图。
图5为根据本公开一个实施例的电子设备的结构示意图。
图6为根据本公开一个实施例的计算机可读存储介质的结构示意图。
具体实施方式
以下通过特定的具体实例说明本公开的实施方式,本领域技术人员可由本说明书所揭露的内容轻易地了解本公开的其他优点与功效。显然,所描述的实施例仅仅是本公开一部分实施例,而不是全部的实施例。本公开还可以通过另外不同的具体实施方式加以实施或应用,本说明书中的各项细节也可以基于不同观点与应用,在没有背离本公开的精神下进行各种修饰或改变。需说明的是,在不冲突的情况下,以下实施例及实施例中的特征可以相互组合。基于本公开中的实施例,本领域普通技术人员在没有作出创造性劳动前提下所获得的所有其他实施例,都属于本公开保护的范围。
需要说明的是,下文描述在所附权利要求书的范围内的实施例的各种方面。应显而易见,本文中所描述的方面可体现于广泛多种形式中,且本文中所描述的任何特定结构及/或功能仅为说明性的。基于本公开,所属领域的技术人员应了解,本文中所描述的一个方面可与任何其它方面独立地实施,且可以各种方式组合这些方面中的两者或两者以上。举例来说,可使用本文中所阐述的任何数目个方面来实施设备及/或实践方法。另外,可使用除了本文中所阐述的方面中的一或多者之外的其它结构及/或功能性实施此设备及/或实践此方法。
还需要说明的是,以下实施例中所提供的图示仅以示意方式说明本公开的基本构想,图式中仅显示与本公开中有关的组件而非按照实际实施时的组件数目、形状及尺寸绘制,其实际实施时各组件的型态、数量及比例可为一种随意的改变,且其组件布局型态也可能更为复杂。
另外,在以下描述中,提供具体细节是为了便于透彻理解实例。然而,所属领域的技术人员将理解,可在没有这些特定细节的情况下实践所述方面。
为了解决如何提高界面的生成效率及使得生成后的界面易于修改和复用并提高用户体验的技术问题,本公开实施例提供一种界面的自动生成方法。如图1所示,该界面的自动生成方法主要包括如下步骤S1至步骤S5。其中:
步骤S1:读取配置文件,所述配置文件包括所述界面的布局属性。
配置文件是数据文件与UI控件之间的桥梁。当想要操作数据文件时,想要通过在UI上对各个数据进行编辑,不同类型的数据对应不同类型的控件。比如bool类型的数据使用勾选框或按钮,浮点数类型的数据使用输入框或挂动杆编辑,配置文件的作用就是将不同的数据对应上想要的编辑方方式。使用配置文件的优点是不用将数据与控件的对应信息硬编码到程序,由外部灵活配置。
在一个实施例中,配置文件的类型为json类型(也称为格式)的配置文件,JSON(JavaScriptObjectNotation,JS对象简谱)是一种轻量级的数据交换格式。它基于ECMAScript(欧洲计算机协会制定的JS规范)的一个子集,采用完全独立于编程语言的文本格式来存储和表示数据。简洁和清晰的层次结构使得JSON成为理想的数据交换语言。易于人阅读和编写,同时也易于机器解析和生成,并有效地提升网络传输效率。Json类型的配置文件中包括有描述界面的参数,比如界面中包括哪些控件、控件的位置以及大小等等。
Json类型的配置文件定义的控件分为两类:section类和property类。section表示一组控件,section可以嵌套section,property表示原子化控件,无法再细分,一个section由其他section和property组成,最终与一个数据对应的是property类型的控件。把一个section想象成一棵树,最终的叶子就是property,其他的节点都是section。
section有多种类型,有的是直接展示其树状结构的所有控件,有的是可对其下控件展开隐藏等,由配置文件中的sectionType定义,形如“ESSectionType***”。section类型控件的主要配置参数:sectionType是类型。"components"是一组子控件,可以是其他的section或property,"components"其下"type"如果是“ESSection”,表示这个子控件是另一个"section","name"表示这个"section"子控件的名字,在配置文件最顶层去查找该子控件配置,如果"components"其下的"type"是"ESPropType***",表示该子控件是一个property类型,参数配置直接写出来。
property也有多种类型,处理整数、浮点数、bool、枚举等,由字段type定义,形如“ESPropType***”。property控件主要配置参数:由于类型多样,很多参数都是特定property独有的,并不具有通用性。"label"表示控件显示的文字说明,"value"表示具体值,"options"表示复选框的值,"optionLabels"复选框文案,"defaultValue"缺省值等。
字段"array"说明:代表该组件用用来表示一组数据,根据数据文件中的对应数据多少个,决定该控件有多少个。
配置文件是json格式时,其<Key,Value>具体含义主要是<自定义控件名,控件参数设置>,<参数名,参数值>。且所有的section类型控件的<Key,Value>都在最顶层,配置文件解析入口在"ESEntry"。
在一个可选的实施例中,配置文件可以使用xml、文本或excel格式的文件,这些类型的配置文件中同样包括有描述界面的参数,比如界面中包括哪些控件、控件的位置以及大小等等。
步骤S2:读取数据文件,所述数据文件与所述配置文件对应。
数据文件与配置文件对应,数据文件中有什么类型的数据,配置文件中就需要定义这个类型的数据的布局属性,数据文件同样可以存储在json类型的文件中,当然也可以使用xml、文本或excel格式的文件存储数据文件。
步骤S3:解析所述配置文件,从所述配置文件中解析所述布局属性。
在一个实施例中,以Json类型的配置文件为例,描述了如何从Json类型的配置文件中解析布局属性,首先,确定配置文件解析入口"ESEntry",然后进入配置文件,根据控件的格式解析出控件<自定义控件名,控件参数设置>,<参数名,参数值>。如下述Json类型的配置文件的一部分:
{
"type":"ESPropTypeLabelButton",
"id":"clickValue",
"label":"素材",
"buttonText":"导入入序列帧"
}。
对其进行解析,可以获得控件的类型、ID、标签及该控件上显示的文本。
对于其他类型的文件,根据文件类型进行具体的解析,在此不再赘述。
步骤S4:解析所述数据文件,从所述数据文件中解析出数据。
当配置文件使用Json类型文件保存时,数据文件也应该使用Json类型文件保存,其解析方法与配置文件的解析方法相同,在此不再赘述。
步骤S5:基于所述布局属性和数据,生成所述界面。
在生成界面中,通过解析出来的布局属性和数据中的字段"id",该字段是控件和数据一一对应的纽带。数据文件和配置文件都是json格式,解析数据文件和配置文件过程中,数据字段id和配置文文件中的id相同时,表示该字段用对应的配置文件描述的控件显示,将数据填充到对应控件,最终自动生成整个界面。
本实施例通过采取该技术方案,可以获取配置文件和数据后进行解析得到布局属性和数据,然后,基于布局属性和数据生成界面,提高了界面的生成效率。
在一个实施例中,所述布局属性包括:界面的位置和尺寸,用于定义界面本身在显示屏中的位置和大小,比如定义采用坐标(x,y)定义界面的位置,采用高(H)和宽(W)定义界面的大小。
在一个实施例中,布局属性还可以包括:所述界面中的组件类型、组件位置、组件尺寸和/或组件所需资源。组件的类型包括输入组件、下拉组件、滑动组件、点击组件或选择组件等等。
在一个实施例中,组件的位置为组件的中心点在显示屏上的坐标;或者组件位置为组件的中心点在所述界面中的相对坐标。
在一个实施例中,组件尺寸包括组件的形状以及组件的形状的大小,其中所述形状的大小不超过所述界面的尺寸。
在一个实施例中,组件所需要的资源比如模型或者图片等等,组件所需的资源可以是相关资源的超链接,也可以是该资源的存储位置等等。
在一个实施例中,还可以通过数据文件来定义界面的大小、界面的位置、组件形状的大小和组件的位置,这样在配置文件中只需要定义所有的组件类型,配置文件更加具有通用性,是使用的时候,只需要将数据文件跟配置文件相对应,从配置文件中解析出数据文件所需要的组件类型即可。
在一个实施例中,设置了多个配置文件,每个配置文件与一个界面节点对应,这样在读取步骤S1之前,具有步骤S0,如图1所示,需要获取当前界面的节点ID;并基于当前界面的节点ID,获取与当前界面对应的配置文件。然后再进行配置文件的读取操作。
在一个优选的实施例中,直接在一个配置文件中配置多个子界面,这样使用一个配置文件也可以生成整个界面。
在一个实施例中,当界面中的组件接收到数据时,将所述数据回传至配置文件中;处理程序从所述配置文件中读取所述数据,其中所述处理程序与接收到数据的组件相对应。
据。即生成的界面仅仅是一个显示界面,该界面上的组件与其功能代码并没有关联,通过配置文件可以传送数据,比如在界面中的输入框中输入一个数字8,那么这个8与配置文件产生关联,而内存中的程序与配置文件也相关联,通过配置文件将数字8关联到内存中的程序中。从而将通过界面输入的数据传送需要该数据的程序中,提高用户体验。
在一个实施例中,构成所述界面的所有节点形成树形结构,所述布局属性还包括:所述界面的子界面位置和尺寸,所述界面的节点为所述子界面的子节点的父节点。即本发明的方法生成的界面的所有节点组织成树形结构,树中的每个节点对应一个配置文件,当遍历树时,读取对应的配置文件,因为树是从根节点开始遍历,因此可以在配置文件中定义子界面的位置和大小,先将子界面的轮廓绘制出来。
在另一个实施例中,如图2所示,在步骤S1读取配置文件之前,还包括:步骤S0’,接收布局属性设置命令,基于所述布局属性设置命令创建配置文件。该步骤S0’用于创建配置文件。在生成界面后,可以在显示装置上实时显示基于所述布局属性和数据生成所述界面的预览。提高了界面的生成效率,使得生成的界面易于修改和复用,进一步提高了用户体验。即配置文件的是采用可视化方式生成的,配置文件可以由专门的程序生成,该程序包括多个可视化配置控件,可以配置界面的属性,并且可以在显示屏上实时预览配置后的界面,最后生成配置文件。图2中步骤S1-S5与图1中的步骤S1-S5相同,在图1的介绍中已经对步骤S1-S5进行了详细介绍,不再赘述。
本领域技术人员应清楚,上述对应方式并非穷举,本领域技术人员在上述所列方式的基础上还可以进行简单变换或等同替换,这些简单变换或等同替换也应包含在本公开的保护范围之内。
在上文中,虽然按照上述的顺序描述了界面的自动生成方法实施例中的各个步骤,本领域技术人员应清楚,本公开实施例中的步骤并不必然按照上述顺序执行,其也可以倒序、并行、交叉等其他顺序执行,而且,在上述步骤的基础上,本领域技术人员也可以再加入其他步骤,这些明显变型或等同替换的方式也应包含在本公开的保护范围之内,在此不再赘述。
下面为本公开装置实施例,本公开装置实施例可用于执行本公开方法实施例实现的步骤,为了便于说明,仅示出了与本公开实施例相关的部分,具体技术细节未揭示的,请参照本公开方法实施例。
为了解决如何提高界面的生成效率及使得生成后的界面易于修改和复用并提高用户体验的技术问题,本公开实施例提供一种界面的自动生成装置,如图3所示,其包括:
配置文件读取模块31,用于读取配置文件,所述配置文件包括所述界面的布局属性;
数据文件读取模块32,用于读取数据文件,所述数据文件与所述配置文件对应
配置文件解析模块33,用于解析所述配置文件,从所述配置文件中解析所述布局属性;
数据文件解析模块34,用于解析所述数据文件,从所述数据文件中解析出数据
界面生成模块35,用于基于所述布局属性和数据,生成所述界面。
配置文件是数据文件与UI控件之间的桥梁。当想要操作数据文件时,想要通过在UI上对各个数据进行编辑,不同类型的数据对应不同类型的控件。比如bool类型的数据使用勾选框或按钮,浮点数类型的数据使用输入框或挂动杆编辑,配置文件的作用就是将不同的数据对应上想要的编辑方方式。使用配置文件的优点是不用将数据与控件的对应信息硬编码到程序,由外部灵活配置。
在一个实施例中,配置文件的类型为json类型(也称为格式)的配置文件,JSON(JavaScriptObjectNotation,JS对象简谱)是一种轻量级的数据交换格式。它基于ECMAScript(欧洲计算机协会制定的JS规范)的一个子集,采用完全独立于编程语言的文本格式来存储和表示数据。简洁和清晰的层次结构使得JSON成为理想的数据交换语言。易于人阅读和编写,同时也易于机器解析和生成,并有效地提升网络传输效率。Json类型的配置文件中包括有描述界面的参数,比如界面中包括哪些控件、控件的位置以及大小等等。
Json类型的配置文件定义的控件分为两类:section类和property类。section表示一组控件,section可以嵌套section,property表示原子化控件,无法再细分,一个section由其他section和property组成,最终与一个数据对应的是property类型的控件。把一个section想象成一棵树,最终的叶子就是property,其他的节点都是section。
section有多种类型,有的是直接展示其树状结构的所有控件,有的是可对其下控件展开隐藏等,由配置文件中的sectionType定义,形如“ESSectionType***”。section类型控件的主要配置参数:sectionType是类型。"components"是一组子控件,可以是其他的section或property,"components"其下"type"如果是“ESSection”,表示这个子控件是另一个"section","name"表示这个"section"子控件的名字,在配置文件最顶层去查找该子控件配置,如果"components"其下的"type"是"ESPropType***",表示该子控件是一个property类型,参数配置直接写出来。
property也有多种类型,处理整数、浮点数、bool、枚举等,由字段type定义,形如“ESPropType***”。property控件主要配置参数:由于类型多样,很多参数都是特定property独有的,并不具有通用性。"label"表示控件显示的文字说明,"value"表示具体值,"options"表示复选框的值,"optionLabels"复选框文文案,"defaultValue"缺省值等。
字段"array"说明:代表该组件用来表示一组数据,根据数据文件中的对应数据多少个,决定该控件有多少个。
配置文件是json格式时,其<Key,Value>具体含义主要是<自定义控件名,控件参数设置>,<参数名,参数值>。且所有的section类型控件的<Key,Value>都在最顶层,配置文件解析入口在"ESEntry"。
在一个可选的实施例中,配置文件可以使用xml、文本或excel格式的文件,这些类型的配置文件中同样包括有描述界面的参数,比如界面中包括哪些控件、控件的位置以及大小等等。
配置文件解析模块32完成配置文件的解析,在一个实施例中,以Json类型的配置文件为例,描述了如何从Json类型的配置文件中解析布局属性,首先,确定配置文件解析入口"ESEntry",然后进入配置文件,根据控件的格式解析出控件<自定义控件名,控件参数设置>,<参数名,参数值>。如下述Json类型的配置文件的一部分:
{
"type":"ESPropTypeLabelButton",
"id":"clickValue",
"label":"素材",
"buttonText":"导入入序列帧"
}。
对其进行解析,可以获得控件的类型、ID、标签及该控件上显示的文本。
对于其他类型的文件,根据文件类型进行具体的解析,在此不再赘述。
界面生成模块33完成界面的生成,在生成界面时,通过调用程序获取与布局属性对应的数据,将数据填充到对应控件,最终自动生成整个界面。
本实施例通过采取该技术方案,可以获取配置文件和数据后进行解析得到布局属性和数据,然后,基于布局属性和数据生成界面,提高了界面的生成效率。
在一个实施例中,所述布局属性包括:界面的位置和尺寸,用于定义界面本身在显示屏中的位置和大小,比如定义采用坐标(x,y)定义界面的位置,采用高(H)和宽(W)定义界面的大小。
在一个实施例中,所述布局属性还可以包括:所述界面中的组件类型、组件位置、组件尺寸和/或组件所需资源。组件的类型包括输入组件、下拉组件、滑动组件、点击组件或选择组件等等。
在一个实施例中,组件的位置为组件的中心点在显示屏上的坐标;或者组件位置为组件的中心点在所述界面中的相对坐标。
在一个实施例中,组件尺寸包括组件的形状以及组件的形状的大小,其中所述形状的大小不超过所述界面的尺寸。
在一个实施例中,组件所需要的资源比如模型或者图片等等,组件所需的资源可以是相关资源的超链接,也可以是该资源的存储位置等等。
在一个实施例中,设置了多个配置文件,每个配置文件与一个界面节点对应,这样该装置包括配置文件获取模块30,如图3所示,配置文件获取模块30在配置文件读取模块31读取配置文件之前,获取当前界面的节点ID;并基于当前界面的节点ID,获取与当前界面对应的配置文件。然后再进行配置文件的读取操作。
在一个优选的实施例中,直接在一个配置文件中配置多个子界面,这样使用一个配置文件也可以生成整个界面。
在一个实施例中,当界面中的组件接收到数据时,将所述数据回传至配置文件中;与接收数据的组件相对应的处理程序从配置文件中读取所述数据。即生成的界面仅仅是一个显示界面,该界面上的组件与其功能代码并没有关联,通过配置文件可以传送数据,比如在界面中的输入框中输入一个数字8,那么这个8与配置文件产生关联,而内存中的程序与配置文件也相关联,通过配置文件将数字8关联到内存中的程序中。从而将通过界面输入的数据传送需要该数据的程序中,提高用户体验。
在一个实施例中,构成所述界面的所有节点形成树形结构,所述布局属性还包括:所述界面的子界面位置和尺寸,所述界面的节点为所述子界面的子节点的父节点。即本发明的方法生成的界面的所有节点组织成树形结构,树中的每个节点对应一个配置文件,当遍历树时,读取对应的配置文件,因为树是从根节点开始遍历,因此可以在配置文件中定义子界面的位置和大小,先将子界面的轮廓绘制出来。
在另一个实施例中,如图4所示,该装置包括布局属性设置命令接收模块30’,布局属性设置命令接收模块30’在配置文件读取模块31读取配置文件之前,接收布局属性设置命令,基于所述布局属性设置命令创建配置文件。布局属性设置命令接收模块30’用于创建配置文件。在生成界面后,可以在显示装置上实时显示基于所述布局属性和数据生成所述界面的预览。提高了界面的生成效率,使得生成的界面易于修改和复用,进一步提高了用户体验。即配置文件的是采用可视化方式生成的,配置文件可以由专门的程序生成,该程序包括多个可视化配置控件,可以配置界面的属性,并且可以在显示屏上实时预览配置后的界面,最后生成配置文件。图4中模块31-35与图3中的模块31-35相同,在图3的介绍中已经对模块31-35进行了详细介绍,不再赘述。
图5是图示根据本公开的实施例的电子设备的硬件框图。如图5所示,根据本公开实施例的电子设备50包括存储器51和处理器52。
该存储器51用于存储非暂时性计算机可读指令。具体地,存储器51可以包括一个或多个计算机程序产品,该计算机程序产品可以包括各种形式的计算机可读存储介质,例如易失性存储器和/或非易失性存储器。该易失性存储器例如可以包括随机存取存储器(RAM)和/或高速缓冲存储器(cache)等。该非易失性存储器例如可以包括只读存储器(ROM)、硬盘、闪存等。
该处理器52可以是中央处理单元(CPU)或者具有数据处理能力和/或指令执行能力的其它形式的处理单元,并且可以控制电子设备50中的其它组件以执行期望的功能。在本公开的一个实施例中,该处理器52用于运行该存储器51中存储的该计算机可读指令,使得该电子设备50执行前述的本公开各实施例的界面的自动生成方法的全部或部分步骤。
本领域技术人员应能理解,为了解决如何获得良好用户体验效果的技术问题,本实施例中也可以包括诸如通信总线、接口等公知的结构,这些公知的结构也应包含在本公开的保护范围之内。
有关本实施例的详细说明可以参考前述各实施例中的相应说明,在此不再赘述。
图6是图示根据本公开的实施例的计算机可读存储介质的示意图。如图6所示,根据本公开实施例的计算机可读存储介质60,其上存储有非暂时性计算机可读指令61。当该非暂时性计算机可读指令61由处理器运行时,执行前述的本公开各实施例的界面的自动生成方法的全部或部分步骤。
上述计算机可读存储介质60包括但不限于:光存储介质(例如:CD-ROM和DVD)、磁光存储介质(例如:MO)、磁存储介质(例如:磁带或移动硬盘)、具有内置的可重写非易失性存储器的媒体(例如:存储卡)和具有内置ROM的媒体(例如:ROM盒)。
有关本实施例的详细说明可以参考前述各实施例中的相应说明,在此不再赘述。
本公开提出的界面的自动生成方法的各种实施方式可以以使用例如计算机软件、硬件或其任何组合的计算机可读介质来实施。对于硬件实施,本公开提出的界面的自动生成方法的各种实施方式可以通过使用特定用途集成电路(ASIC)、数字信号处理器(DSP)、数字信号处理装置(DSPD)、可编程逻辑装置(PLD)、现场可编程门阵列(FPGA)、处理器、控制器、微控制器、微处理器、被设计为执行这里描述的功能的电子单元中的至少一种来实施。
有关本实施例的详细说明可以参考前述各实施例中的相应说明,在此不再赘述。
以上结合具体实施例描述了本公开的基本原理,但是,需要指出的是,在本公开中提及的优点、优势、效果等仅是示例而非限制,不能认为这些优点、优势、效果等是本公开的各个实施例必须具备的。另外,上述公开的具体细节仅是为了示例的作用和便于理解的作用,而非限制,上述细节并不限制本公开为必须采用上述具体的细节来实现。
本公开中涉及的器件、装置、设备、系统的方框图仅作为例示性的例子并且不意图要求或暗示必须按照方框图示出的方式进行连接、布置、配置。如本领域技术人员将认识到的,可以按任意方式连接、布置、配置这些器件、装置、设备、系统。诸如“包括”、“包含”、“具有”等等的词语是开放性词汇,指“包括但不限于”,且可与其互换使用。这里所使用的词汇“或”和“和”指词汇“和/或”,且可与其互换使用,除非上下文明确指示不是如此。这里所使用的词汇“诸如”指词组“诸如但不限于”,且可与其互换使用。
另外,如在此使用的,在以“至少一个”开始的项的列举中使用的“或”指示分离的列举,以便例如“A、B或C的至少一个”的列举意味着A或B或C,或AB或AC或BC,或ABC(即A和B和C)。此外,措辞“示例的”不意味着描述的例子是优选的或者比其他例子更好。
还需要指出的是,在本公开的系统和方法中,各部件或各步骤是可以分解和/或重新组合的。这些分解和/或重新组合应视为本公开的等效方案。
可以不脱离由所附权利要求定义的教导的技术而进行对在此所述的技术的各种改变、替换和更改。此外,本公开的权利要求的范围不限于以上所述的处理、机器、制造、事件的组成、手段、方法和动作的具体方面。可以利用与在此所述的相应方面进行基本相同的功能或者实现基本相同的结果的当前存在的或者稍后要开发的处理、机器、制造、事件的组成、手段、方法或动作。因而,所附权利要求包括在其范围内的这样的处理、机器、制造、事件的组成、手段、方法或动作。
提供所公开的方面的以上描述以使本领域的任何技术人员能够做出或者使用本公开。对这些方面的各种修改对于本领域技术人员而言是非常显而易见的,并且在此定义的一般原理可以应用于其他方面而不脱离本公开的范围。因此,本公开不意图被限制到在此示出的方面,而是按照与在此公开的原理和新颖的特征一致的最宽范围。
为了例示和描述的目的已经给出了以上描述。此外,此描述不意图将本公开的实施例限制到在此公开的形式。尽管以上已经讨论了多个示例方面和实施例,但是本领域技术人员将认识到其某些变型、修改、改变、添加和子组合。
Claims (13)
1.一种界面的自动生成方法,其特征在于,包括:
读取配置文件,所述配置文件包括所述界面的布局属性;
读取数据文件,所述数据文件与所述配置文件对应;
解析所述配置文件,从所述配置文件中解析所述布局属性;
解析所述数据文件,从所述数据文件中解析出数据;
基于所述布局属性和数据,生成所述界面。
2.如权利要求1所述的界面的自动生成方法,其特征在于,所述布局属性包括:
所述界面的位置和尺寸;
所述界面中的组件类型、组件位置、组件尺寸和/或组件所需资源。
3.如权利要求1所述的界面的自动生成方法,其特征在于,在读取配置文件之前,还包括:
获取当前界面的节点ID;
基于所述当前界面的节点ID,获取与当前界面对应的配置文件。
4.如权利要求2所述的界面的自动生成方法,其特征在于:
所述组件类型包括输入组件、下拉组件、滑动组件、点击组件或选择组件。
5.如权利要求2所述的界面的自动生成方法,其特征在于:
所述组件位置为组件的中心点在显示屏上的坐标;或者,
所述组件位置为组件的中心点在所述界面中的相对坐标。
6.如权利要求2所述的界面的自动生成方法,其特征在于:
所述组件尺寸包括组件的形状以及组件的形状的大小,其中所述形状的大小不超过所述界面的尺寸。
7.如权利要求2所述的界面的自动生成方法,其特征在于:
当所述界面中的组件接收到数据时,将所述数据回传至所述配置文件中;
处理程序从所述配置文件中读取所述数据,其中所述处理程序与接收到数据的组件相对应。
8.如权利要求2所述的界面的自动生成方法,其特征在于,构成所述界面的所有节点形成树形结构,所述布局属性还包括:
所述界面的子界面位置和尺寸,所述界面的节点为所述子界面的子节点的父节点。
9.如权利要求1所述的界面的自动生成方法,其特征在于,在读取配置文件之前,还包括:
接收布局属性设置命令,基于所述布局属性设置命令创建配置文件。
10.如权利要求1所述的界面的自动生成方法,其特征在于:
在显示装置上实时显示基于所述布局属性和数据生成所述界面的预览。
11.一种界面的自动生成装置,其特征在于,包括:
配置文件读取模块,用于读取配置文件,所述配置文件包括所述界面的布局属性;
数据文件读取模块,用于读取数据文件,所述数据文件与所述配置文件对应
配置文件解析模块,用于解析所述配置文件,从所述配置文件中解析所述布局属性;
数据文件解析模块,用于解析所述数据文件,从所述数据文件中解析出数据
界面生成模块,用于基于所述布局属性和数据,生成所述界面。
12.一种电子设备,其特征在于,所述电子设备包括:
至少一个处理器;以及,
与所述至少一个处理器通信连接的存储器;其中,
所述存储器存储有能被所述至少一个处理器执行的指令,所述指令被所述至少一个处理器执行,以使所述至少一个处理器能够执行权利要求1-10任一所述的界面的自动生成方法。
13.一种非暂态计算机可读存储介质,其特征在于,该非暂态计算机可读存储介质存储计算机指令,该计算机指令用于使计算机执行权利要求1-10任一所述的界面的自动生成方法。
Priority Applications (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN201810733105.6A CN109101304A (zh) | 2018-07-05 | 2018-07-05 | 界面的自动生成方法、装置、电子设备和计算机可读介质 |
Applications Claiming Priority (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN201810733105.6A CN109101304A (zh) | 2018-07-05 | 2018-07-05 | 界面的自动生成方法、装置、电子设备和计算机可读介质 |
Publications (1)
Publication Number | Publication Date |
---|---|
CN109101304A true CN109101304A (zh) | 2018-12-28 |
Family
ID=64845512
Family Applications (1)
Application Number | Title | Priority Date | Filing Date |
---|---|---|---|
CN201810733105.6A Pending CN109101304A (zh) | 2018-07-05 | 2018-07-05 | 界面的自动生成方法、装置、电子设备和计算机可读介质 |
Country Status (1)
Country | Link |
---|---|
CN (1) | CN109101304A (zh) |
Cited By (11)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN109992269A (zh) * | 2019-04-04 | 2019-07-09 | 睿驰达新能源汽车科技(北京)有限公司 | 一种运维平台的开发方法及装置 |
CN110109727A (zh) * | 2019-04-30 | 2019-08-09 | 上海掌门科技有限公司 | 应用的配置方法和装置 |
CN110275735A (zh) * | 2019-06-24 | 2019-09-24 | 深圳乐信软件技术有限公司 | 一种界面配置方法、装置、终端和存储介质 |
CN110989996A (zh) * | 2019-12-02 | 2020-04-10 | 北京电子工程总体研究所 | 一种基于Qt脚本语言的目标轨迹数据产生方法 |
CN111176644A (zh) * | 2019-12-24 | 2020-05-19 | 深圳市优必选科技股份有限公司 | 操作界面的自动化布局方法、装置及其响应方法和装置 |
CN111443912A (zh) * | 2020-03-25 | 2020-07-24 | 平安医疗健康管理股份有限公司 | 基于组件的页面渲染方法、装置、计算机设备和存储介质 |
CN112083920A (zh) * | 2020-09-01 | 2020-12-15 | 北京锐安科技有限公司 | 一种前端页面设计方法、装置、存储介质及设备 |
CN112494940A (zh) * | 2020-12-15 | 2021-03-16 | 网易(杭州)网络有限公司 | 用户界面的制作方法、装置、存储介质及计算机设备 |
CN112579144A (zh) * | 2019-09-30 | 2021-03-30 | 杭州海康机器人技术有限公司 | 数据处理方法及装置 |
CN112947954A (zh) * | 2019-12-11 | 2021-06-11 | 北京中关村科金技术有限公司 | 一种界面更新方法、装置和存储介质 |
CN113687872A (zh) * | 2021-07-19 | 2021-11-23 | 北京鸿腾智能科技有限公司 | 选择组件控制方法、设备、存储介质及装置 |
Citations (9)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN101398754A (zh) * | 2007-09-26 | 2009-04-01 | 中国科学院声学研究所 | 一种嵌入式设备的交互系统 |
CN102375733A (zh) * | 2010-08-24 | 2012-03-14 | 北大方正集团有限公司 | 一种便捷的界面布局方法 |
CN103365855A (zh) * | 2012-03-28 | 2013-10-23 | 腾讯科技(深圳)有限公司 | 生成网页的方法及服务器 |
US20140013247A1 (en) * | 2012-07-03 | 2014-01-09 | salesforce.com,inc. | Systems and methods for providing a customized user interface for publishing into a feed |
CN105354013A (zh) * | 2014-08-18 | 2016-02-24 | 阿里巴巴集团控股有限公司 | 应用界面渲染方法及装置 |
CN105511843A (zh) * | 2014-09-22 | 2016-04-20 | 普天信息技术有限公司 | 一种生成应用程序界面的方法和装置 |
CN106201507A (zh) * | 2016-07-07 | 2016-12-07 | 蓝网科技股份有限公司 | 一种医学叫号系统的图形界面生成及显示方法 |
CN106648555A (zh) * | 2015-10-28 | 2017-05-10 | 阿里巴巴集团控股有限公司 | 一种页面的生成方法及装置 |
CN107992301A (zh) * | 2017-11-27 | 2018-05-04 | 腾讯科技(上海)有限公司 | 用户界面实现方法、客户端及存储介质 |
-
2018
- 2018-07-05 CN CN201810733105.6A patent/CN109101304A/zh active Pending
Patent Citations (9)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN101398754A (zh) * | 2007-09-26 | 2009-04-01 | 中国科学院声学研究所 | 一种嵌入式设备的交互系统 |
CN102375733A (zh) * | 2010-08-24 | 2012-03-14 | 北大方正集团有限公司 | 一种便捷的界面布局方法 |
CN103365855A (zh) * | 2012-03-28 | 2013-10-23 | 腾讯科技(深圳)有限公司 | 生成网页的方法及服务器 |
US20140013247A1 (en) * | 2012-07-03 | 2014-01-09 | salesforce.com,inc. | Systems and methods for providing a customized user interface for publishing into a feed |
CN105354013A (zh) * | 2014-08-18 | 2016-02-24 | 阿里巴巴集团控股有限公司 | 应用界面渲染方法及装置 |
CN105511843A (zh) * | 2014-09-22 | 2016-04-20 | 普天信息技术有限公司 | 一种生成应用程序界面的方法和装置 |
CN106648555A (zh) * | 2015-10-28 | 2017-05-10 | 阿里巴巴集团控股有限公司 | 一种页面的生成方法及装置 |
CN106201507A (zh) * | 2016-07-07 | 2016-12-07 | 蓝网科技股份有限公司 | 一种医学叫号系统的图形界面生成及显示方法 |
CN107992301A (zh) * | 2017-11-27 | 2018-05-04 | 腾讯科技(上海)有限公司 | 用户界面实现方法、客户端及存储介质 |
Cited By (14)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN109992269A (zh) * | 2019-04-04 | 2019-07-09 | 睿驰达新能源汽车科技(北京)有限公司 | 一种运维平台的开发方法及装置 |
CN110109727A (zh) * | 2019-04-30 | 2019-08-09 | 上海掌门科技有限公司 | 应用的配置方法和装置 |
CN110275735A (zh) * | 2019-06-24 | 2019-09-24 | 深圳乐信软件技术有限公司 | 一种界面配置方法、装置、终端和存储介质 |
CN112579144A (zh) * | 2019-09-30 | 2021-03-30 | 杭州海康机器人技术有限公司 | 数据处理方法及装置 |
CN110989996A (zh) * | 2019-12-02 | 2020-04-10 | 北京电子工程总体研究所 | 一种基于Qt脚本语言的目标轨迹数据产生方法 |
CN112947954A (zh) * | 2019-12-11 | 2021-06-11 | 北京中关村科金技术有限公司 | 一种界面更新方法、装置和存储介质 |
CN111176644A (zh) * | 2019-12-24 | 2020-05-19 | 深圳市优必选科技股份有限公司 | 操作界面的自动化布局方法、装置及其响应方法和装置 |
CN111176644B (zh) * | 2019-12-24 | 2024-05-03 | 深圳市优必选科技股份有限公司 | 操作界面的自动化布局方法、装置及其响应方法和装置 |
CN111443912A (zh) * | 2020-03-25 | 2020-07-24 | 平安医疗健康管理股份有限公司 | 基于组件的页面渲染方法、装置、计算机设备和存储介质 |
CN112083920A (zh) * | 2020-09-01 | 2020-12-15 | 北京锐安科技有限公司 | 一种前端页面设计方法、装置、存储介质及设备 |
CN112494940A (zh) * | 2020-12-15 | 2021-03-16 | 网易(杭州)网络有限公司 | 用户界面的制作方法、装置、存储介质及计算机设备 |
CN112494940B (zh) * | 2020-12-15 | 2024-05-14 | 网易(杭州)网络有限公司 | 用户界面的制作方法、装置、存储介质及计算机设备 |
CN113687872A (zh) * | 2021-07-19 | 2021-11-23 | 北京鸿腾智能科技有限公司 | 选择组件控制方法、设备、存储介质及装置 |
CN113687872B (zh) * | 2021-07-19 | 2024-03-29 | 三六零数字安全科技集团有限公司 | 选择组件控制方法、设备、存储介质及装置 |
Similar Documents
Publication | Publication Date | Title |
---|---|---|
CN109101304A (zh) | 界面的自动生成方法、装置、电子设备和计算机可读介质 | |
Antkiewicz et al. | FeaturePlugin: Feature modeling plug-in for Eclipse | |
CN101645006B (zh) | 一种Eclipse的属性页的动态生成方法及装置 | |
CN104267962A (zh) | 一种基于描述的界面ui控件配置方法 | |
CN111625226A (zh) | 一种基于原型的人机交互设计实现方法及系统 | |
CN112099792A (zh) | 一种可视化ui样式设计方法及系统 | |
CN104267966A (zh) | 软件的程序代码的生成方法及装置 | |
Engel et al. | A Concerted Model-driven and Pattern-based Framework for Developing User Interfaces of Interactive Ubiquitous Applications. | |
Jones et al. | The AXIOM model framework: Transforming requirements to native code for cross-platform mobile applications | |
CN109144511A (zh) | 数值模拟图形用户界面自动生成方法及系统 | |
CN112685025A (zh) | 快速搭建前端页面的方法及系统 | |
Ermel et al. | Animated simulation of integrated UML behavioral models based on graph transformation | |
CN105488052B (zh) | 将结构化数据转为版式表单文件的方法及系统 | |
CN112306622A (zh) | 一种vnf模板的构建方法及装置 | |
Pleuss et al. | Integrating heterogeneous tools into model-centric development of interactive applications | |
Taylor | Digital Engineering: Recognizing and Honing Our 6th Sense with respect to Digital Thread | |
de Lange et al. | Collaborative wireframing for model-driven web engineering | |
Ermel et al. | Scenario animation for visual behavior models: A generic approach | |
Brambilla et al. | A transformation framework to bridge domain specific languages to MDA | |
CN114527979A (zh) | 一种生成多端表单交互页面的方法及系统 | |
Klein et al. | Constructing SDEs with the IPSEN meta environment | |
JP2019528485A (ja) | フォントの生成方法及びその方法を記録した記録媒体並びにフォントの生成装置 | |
Vanderdonckt | Animated transitions for empowering interactive information systems | |
Garzotto et al. | Supporting reusable web design with HDM-Edit | |
Fadhlillah et al. | Generating adaptable user interface in SPLE: using delta-oriented programming and interaction flow modeling 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 |