CN115098092A - 一种页面生成方法、装置、设备和存储介质 - Google Patents

一种页面生成方法、装置、设备和存储介质 Download PDF

Info

Publication number
CN115098092A
CN115098092A CN202210744475.6A CN202210744475A CN115098092A CN 115098092 A CN115098092 A CN 115098092A CN 202210744475 A CN202210744475 A CN 202210744475A CN 115098092 A CN115098092 A CN 115098092A
Authority
CN
China
Prior art keywords
target
page
template
configuration
configuration information
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
Application number
CN202210744475.6A
Other languages
English (en)
Inventor
王光辉
Current Assignee (The listed assignees may be inaccurate. Google has not performed a legal analysis and makes no representation or warranty as to the accuracy of the list.)
Jingdong Technology Information Technology Co Ltd
Original Assignee
Jingdong Technology Information Technology Co Ltd
Priority date (The priority date 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 date listed.)
Filing date
Publication date
Application filed by Jingdong Technology Information Technology Co Ltd filed Critical Jingdong Technology Information Technology Co Ltd
Priority to CN202210744475.6A priority Critical patent/CN115098092A/zh
Publication of CN115098092A publication Critical patent/CN115098092A/zh
Pending legal-status Critical Current

Links

Images

Classifications

    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F8/00Arrangements for software engineering
    • G06F8/30Creation or generation of source code
    • G06F8/34Graphical or visual programming
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F8/00Arrangements for software engineering
    • G06F8/30Creation or generation of source code
    • G06F8/38Creation or generation of source code for implementing user interfaces
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F8/00Arrangements for software engineering
    • G06F8/40Transformation of program code
    • G06F8/41Compilation
    • G06F8/44Encoding
    • G06F8/447Target code generation

Landscapes

  • Engineering & Computer Science (AREA)
  • General Engineering & Computer Science (AREA)
  • Software Systems (AREA)
  • Theoretical Computer Science (AREA)
  • Physics & Mathematics (AREA)
  • General Physics & Mathematics (AREA)
  • Human Computer Interaction (AREA)
  • Stored Programmes (AREA)

Abstract

本发明实施例公开了一种页面生成方法、装置、设备和存储介质,该方法包括:解压目标页面的设计文件得到解析数据,根据所述解析数据确定所述设计文件对应的页面模板;从服务端获取所述目标页面的配置信息,并基于所述配置信息调整所述页面模板得到目标模板;解析所述目标模板得到目标代码,基于所述目标代码生成所述目标页面。上述技术方案,通过解压设计文件得到的解析数据确定页面模板,实现零代码确定页面模板,基于配置信息对页面模板进行配置得到目标模板,提升页面模板的开发效率,对目标模板进行解析得到目标代码,并根据目标代码生成目标页面,降低目标页面开发的工作量,提升页面开发效率。

Description

一种页面生成方法、装置、设备和存储介质
技术领域
本发明实施例涉及计算机技术领域,尤其涉及一种页面生成方法、装置、设备和存储介质。
背景技术
在开发应用程序时,通常需要单独开发应用程序中的各个页面。页面不仅可以提供文字和图片,还可以提供更加生动的动态内容以及交互内容。在对页面进行开发时,往往需要研发人员根据业务需求以大量复杂的代码编写页面。随着页面需求的提升,页面开发所需的代码也愈发复杂。
现有技术中,研发人员可以预先开发多种页面模板,并在低代码平台中根据业务需求组装页面模板,实现页面开发。
在实现本发明的过程中,发明人发现现有技术中至少存在以下技术问题:
页面模板的开发同样需要大量复杂的代码,导致页面开发效率较低。
发明内容
本发明提供一种页面生成方法、装置、设备和存储介质,以实现提升页面开发效率。
第一方面,本发明实施例提供了一种页面生成方法,包括:
解压目标页面的设计文件得到解析数据,根据所述解析数据确定所述设计文件对应的页面模板;
从服务端获取所述目标页面的配置信息,并基于所述配置信息调整所述页面模板得到目标模板;
解析所述目标模板得到目标代码,基于所述目标代码生成所述目标页面。
第二方面,本发明实施例还提供了一种页面生成装置,包括:
解压模块,用于解压目标页面的设计文件得到解析数据,根据所述解析数据确定所述设计文件对应的页面模板;
获取模块,用于从服务端获取所述目标页面的配置信息,并基于所述配置信息调整所述页面模板得到目标模板;
执行模块,用于解析所述目标模板得到目标代码,基于所述目标代码生成所述目标页面。
第三方面,本发明实施例还提供了一种计算机设备,包括存储器、处理器及存储在存储器上并可在处理器上运行的计算机程序,所述处理器执行所述程序时实现如权第一方面中任一所述的页面生成方法。
第四方面,本发明实施例还提供了一种包含计算机可执行指令的存储介质,所述计算机可执行指令在由计算机处理器执行时用于执行如第一方面中任一所述的页面生成方法。
上述发明中的实施例具有如下优点或有益效果:
本发明实施例提供一种页面生成方法,包括:解压目标页面的设计文件得到解析数据,根据所述解析数据确定所述设计文件对应的页面模板;从服务端获取所述目标页面的配置信息,并基于所述配置信息调整所述页面模板得到目标模板;解析所述目标模板得到目标代码,基于所述目标代码生成所述目标页面。上述技术方案,首先可以解压目标页面的设计文件得到解析数据,并根据解析数据确定页面模板,实现了零代码确定页面模板,其次从服务端获取配置信息,以基于配置信息对页面模板进行配置,得到目标模板,提升目标模板的开发效率,还可以对目标模板进行解析,得到目标代码,进而根据目标代码可以生成目标页面,进一步降低目标页面开发的工作量,提升页面开发效率。
附图说明
图1为本发明实施例提供的一种页面生成过程示意图;
图2为本发明实施例提供的一种页面生成方法的流程图;
图3为本发明实施例提供的另一种页面生成方法的流程图;
图4为本发明实施例提供的另一种页面生成方法中飞码渲染引擎的界面图;
图5为本发明实施例提供的另一种页面生成方法中步骤350的流程图;
图6为本发明实施例提供的另一种页面生成方法中对页面模板的一种配置示意图;
图7为本发明实施例提供的另一种页面生成方法中对页面模板的另一种配置示意图;
图8为本发明实施例提供的另一种页面生成方法中对页面模板的又一种配置示意图;
图9为本发明实施例提供的另一种页面生成方法中对页面模板的又一种配置的示意图;
图10为本发明实施例提供的一种页面生成装置的结构示意图;
图11为本发明实施例提供的一种计算机设备的结构示意图。
具体实施方式
下面结合附图和实施例对本发明作进一步的详细说明。可以理解的是,此处所描述的具体实施例仅仅用于解释本发明,而非对本发明的限定。另外还需要说明的是,为了便于描述,附图中仅示出了与本发明相关的部分而非全部结构。
在更加详细地讨论示例性实施例之前应当提到的是,一些示例性实施例被描述成作为流程图描绘的处理或方法。虽然流程图将各项操作(或步骤)描述成顺序的处理,但是其中的许多操作可以被并行地、并发地或者同时实施。此外,各项操作的顺序可以被重新安排。当其操作完成时所述处理可以被终止,但是还可以具有未包括在附图中的附加步骤。所述处理可以对应于方法、函数、规程、子例程、子程序等等。此外,在不冲突的情况下,本发明中的实施例及实施例中的特征可以相互组合。
图1为本发明实施例提供的一种页面生成过程示意图,如图1所示,具体可以在模板脚手架封装库中确定模板脚手架,并对模板脚手架进行模板初始化以进行模板申请得到模板申请结果,在根据项目库确定表单可视化平台后,在表单可视化平台根据模板申请结果生成页面模板。前述步骤的实现均需要代码的参与,执行复杂度较高。当然,还可以在可视化平台中对页面模板进行渲染,生成目标页面。但是,上述页面生成过程中,根据页面模板生成目标页面实现了零代码,但是生成页面模板的过程需要高代码参与,导致页面生成效率较低。
因此,本发明实施例提供一种页面生成方法,以低代码生成页面模板,再根据页面模板生成目标模板,进而生成目标页面,实习低代码页面开发,提升页面开发效率。
下面将结合实施例以及示图对本发明实施例提供的页面生成方法进行详细的描述。
图2为本发明实施例提供的一种页面生成方法的流程图,本发明实施例可适用于低代码生成页面的情况。该方法可以由页面生成装置来执行,该装置可以由软件和/或硬件的方式来实现。如图2所述,该方法具体包括以下步骤:
步骤210、解压目标页面的设计文件得到解析数据,根据所述解析数据确定所述设计文件对应的页面模板。
其中,设计文件可以为sketch格式的设计文件。从sketch中导出界面设计师根据业务需求绘制的设计图,可以得到sketch格式的设计文件。
具体地,在对sketch格式的设计文件进行解压缩包后,可以得到json格式的解析数据。解析数据可以包括容器格式的设计图、文本格式的设计图、集合格式的设计图、遮罩格式的设计图、图片格式的设计图和可缩放矢量图格式的设计图中至少一种。当然,容器格式的设计图、文本格式的设计图、集合格式的设计图、遮罩格式的设计图、图片格式的设计图和可缩放矢量图格式的设计图可以作为设计容器允许在其内部添加其他控件,以丰富页面模板的展示状态,进而将页面模板配置为目标模板。
将上述至少一种格式的设计文件导入渲染软件中,具体可以导入飞码渲染引擎中,飞码渲染引擎可以将容器格式的设计文件、文本格式的设计文件、集合格式的设计文件、遮罩格式的设计文件、图片格式的设计文件和可缩放矢量图格式的设计文件确定为容器,并为各容器添加各种控件,进而得到页面模板。页面模板包括可以添加控件的容器,因此,页面模板具备添加动态属性的能力。
飞码渲染引擎可以包括组件区、画布区和配置区。因此,飞码渲染引擎可以在组件区展示六种格式的设计文件,也可以在画布区展示设计文件对应的页面模板。
本发明实施例中,通过对sketch格式的设计文件进行解析,并在飞码渲染引擎中将解析得到的解析数据作为控件,并为其添加控件,以确定设计文件对应的页面模板,实现零代码确定设计文件对应的页面模板,提升了页面模板的生成效率。
步骤220、从服务端获取所述目标页面的配置信息,并基于所述配置信息调整所述页面模板得到目标模板。
其中,飞码渲染引擎可以和服务端通信连接,服务端存储有预先设置的配置信息,该配置信息用于对页面模板进行配置,以得到目标模板。
具体地,研发人员可以在飞码渲染引擎的配置区内基于配置信息对页面模板进行调整。具体而言,飞码渲染引擎可以接收研发人员基于配置区触发的获取请求,并将该获取请求发送至服务端。服务端可以根据获取请求确定配置信息,并将配置信息发送至飞码渲染引擎,飞码渲染引擎可以基于key-value形式在配置区展示配置信息。
配置信息可以包括用于调整页面模板的整体页面显示的页面配置信息和用于调整页面模板所包含组件的组件配置信息,组件配置信息可以包括样式配置、属性配置、事件配置和数据配置。飞码渲染引擎在获取到配置信息后,可以基于页面配置信息调整页面模板的整体页面显示,具体而言,可以对页面模板进行渲染,以使得页面显示更加符合实际需求;也可以基于组件配置信息所包含的样式配置对页面模板的样式进行微调,以使得样式模板更加美观;还可以基于组件配置信息所包含的属性配置对页面模板所包含各组件形状进行调整,以得到页面模板所包含的组件更符合实际需求;还可以基于组件配置信息所包含的事件配置对页面模板所包含各组件的展示状态进行调整,以使得页面模板以动态的形式进行展示;还可以基于组件配置信息所包含的数据配置对页面模板内的数据内容进行调整,以使得页面模板所包含的数据内容更符合当前需求。
基于页面配置信息和组件配置信息对页面模板进行调整后,可以得到目标模板。需要说明的是,基于页面配置信息和组件配置信息对页面模板进行调整的顺序在此不做具体限定,可以根据实际需求进行确定。当然,基于组件配置信息对页面模板进行调整的过程中,基于样式配置、属性配置、事件配置和数据配置对页面模板进行调整的顺序在此也不做具体限定,同样可以根据实际需求进行确定。
在实际应用中,通过事件配置对页面模板所包含各组件的展示状态进行调整,可以使得各组件以弹框、跳转、滚动或者请求接口等其他动态形式展示在目标模板中,对静态的页面模板进行动态化处理得到可以动态展示的目标模板。
本发明实施例中,从服务端获取到的配置信息,可以用于对页面模板的样式、页面模板所包含组件的形状、页面模板所包含组件的展示状态以及页面模板内的数据内容进行调整,实现了零代码或者低代码调整页面模板,进而可以将调整后的页面模板确定为目标模板,实现了零代码或者低代码确定目标模板。
步骤230、解析所述目标模板得到目标代码,基于所述目标代码生成所述目标页面。
其中,目标代码可以为领域特定语言(Domain Specific Language,DSL)。
具体地,在确定目标模板后,可以对目标模板进行解析得到DSL代码。进而可以在开发工具中将DSL代码拷贝至SDK代码中,得到DSL代码对应的目标页面。
在实际应用中,开发工具可以为软件开发工具包。软件开发工具包通常为研发人员为特定的软件包、软件框架、硬件平台、操作系统等建立应用软件时的开发工具的集合。本发明实施例中开发工具可以为软件框架。
本发明实施例中,通过对目标模板进行解析,得到了目标代码,进而在开发工具中根据目标代码确定目标页面,实现了对目标页面的开发。
本发明实施例提供的一种页面生成方法,包括:解压目标页面的设计文件得到解析数据,根据所述解析数据确定所述设计文件对应的页面模板;从服务端获取所述目标页面的配置信息,并基于所述配置信息调整所述页面模板得到目标模板;解析所述目标模板得到目标代码,基于所述目标代码生成所述目标页面。上述技术方案,首先可以解压目标页面的设计文件得到解析数据,并根据解析数据确定页面模板,实现了零代码确定页面模板,其次从服务端获取配置信息,以基于配置信息对页面模板进行配置,得到目标模板,提升目标模板的开发效率,还可以对目标模板进行解析,得到目标代码,进而根据目标代码可以生成目标页面,进一步降低目标页面开发的工作量,提升页面开发效率。另外,如果需要对目标页面进行调整,仅需在飞码渲染引擎内,再次对页面模板进行配置,以实现对目标页面的再次更新。
图3为本发明实施例提供的另一种页面生成方法的流程图,本发明实施例可适用于低代码生成页面的情况。本发明实施例在上述实施例的基础上,在解压目标页面的设计图得到解析数据之后,增加了“将所述图片格式的设计图确定为基础模板。”,其中与上述各实施例相同或相应的术语的解释在此不再赘述。参见图3,本发明实施例提供的页面生成方法包括:
步骤310、解压目标页面的设计文件得到解析数据。
其中,设计文件可以为从sketch中导出的界面设计师根据业务需求绘制的设计图。
一种实施方式中,步骤310具体可以包括:
对所述目标页面的所述设计文件进行解压,得到容器格式的设计文件、文本格式的设计文件、集合格式的设计文件、遮罩格式的设计文件、图片格式的设计文件和可缩放矢量图格式的设计文件中至少一种。
具体地,在对sketch格式的设计文件进行解压缩包后,可以生成对应的json格式的解析数据,该解析数据可以包括Container(容器)、Text(文本)、Group(集合)、Mask(遮罩)、Image(图片)和Path(svg)中至少一种,即容器格式的设计文件、文本格式的设计文件、集合格式的设计文件、遮罩格式的设计文件、图片格式的设计文件和可缩放矢量图格式的设计文件中至少一种。
本发明实施例中,对设计文件进行解压缩包得到的六种格式的设计文件,均可以作为容器进行开发适配,为基于配置信息对设计文件对应的页面模板进行调整时提供父级容器,以便于将配置信息配置于页面模板中。
步骤320、将所述图片格式的设计文件确定为基础模板。
本发明实施例中,图片格式的设计文件可以作为基础模板配置页面模板,具体可以将基础模板作为跳转界面或者弹框配置页面模板,提升了页面模板配置的效率。
步骤330、根据所述解析数据确定所述设计文件对应的页面模板。
一种实施方式中,步骤330具体可以包括:将容器格式的设计文件、文本格式的设计文件、集合格式的设计文件、遮罩格式的设计文件、图片格式的设计文件和可缩放矢量图格式的设计文件中至少一种确定为设计容器,并为各所述设计容器添加控件,得到所述页面模板。
具体地,可以将解析数据发送至飞码渲染引擎,以使得飞码渲染引擎根据解析数据确定设计文件对应的页面模板。图4为本发明实施例提供的另一种页面生成方法中飞码渲染引擎的界面图,如图4所示,飞码渲染引擎可以包括组件区、画布区和配置区。将解压目标页面的设计文件得到的解析数据导入至飞码渲染引擎后,飞码渲染引擎可以基于组件区展示解析数据所包含的容器格式的设计图、文本格式的设计图、集合格式的设计图、遮罩格式的设计图、图片格式的设计图和可缩放矢量图格式的设计图。飞码渲染引擎还可以将六种格式的设计文件确定为设计容器,设计容器可以添加控件以进行开发适配,该设计容器可以为基于配置信息对设计文件对应的页面模板进行调整时提供父级容器,以便于将配置信息配置于页面模板中。
本发明实施例中,将解析数据导入飞码渲染引擎,在飞码渲染引擎的组件区中可以展示解析数据,飞码渲染引擎还可以根据解析数据确定设计文件对应的页面模板,并在飞码渲染引擎的画布区展示页面模板。
在实际应用中,步骤320和步骤330可以同时执行。
步骤340、从服务端获取所述目标页面的配置信息。
同样地,飞码渲染引擎可以接收研发人员基于配置区触发的获取请求,并将该获取请求发送至服务端。服务端可以根据获取请求确定配置信息,并将配置信息发送至飞码渲染引擎,飞码渲染引擎可以基于key-value形式在配置区展示配置信息。
步骤350、基于所述配置信息和基础模板调整所述页面模板得到目标模板。
一种实施方式中,配置信息包括组件配置信息,组件配置信息包括样式配置、属性配置、事件配置和数据配置。组件配置信息可以用于对页面模板所包含的初始组件进行调整。
图5为本发明实施例提供的另一种页面生成方法中步骤350的流程图,如图5所示,步骤350具体可以包括:
步骤3510、基于所述样式配置和所述属性配置调整所述页面模板所包含初始组件的初始静态属性,得到目标组件。
其中,初始静态属性包括初始样式和初始形状。
步骤3510具体可以包括:基于所述样式配置调整各所述初始组件的所述初始样式,基于所述属性配置调整各所述初始组件的所述初始形状,得到所述目标组件。
具体地,可以基于样式配置调整初始组件的样式,以使得组件更加美观,也可以基于属性配置调整初始组件的形状,例如,可以将长方形的组件调整为长方形加两个半圆形的组件,以使得组件更加圆滑,提升视觉效果。
本发明实施例中,根据样式配置和属性配置,可以实现低代码调整初始组件的初始静态属性,即调整初始组件的样式和形状,可以得到更符合实际需求的目标组件。
步骤3520、基于所述事件配置和所述数据配置调整所述目标组件的初始动态属性,得到目标展示状态。
步骤3520具体可以包括:根据所述事件配置确定目标展示方式,根据所述数据配置确定目标展示内容;基于所述目标展示方式和所述目标展示内容调整所述目标组件的所述初始动态属性,得到所述目标展示状态。
目标展示方式可以包括弹框展示、跳转展示、滚动展示或者选择展示等,以使得目标模板中可以弹框展示、跳转展示、滚动展示或者选择展示目标模板所包含的目标组件。目标展示内容可以用于确定目标模板中的内容。
具体地,在根据事件配置确定目标展示方式,以及根据数据配置确定目标展示内容后,可以基于目标展示方式调整目标组件的展示方式,基于目标展示内容调整目标组件的展示内容以及页面模板中的展示内容,得到目标展示状态。
其中,事件配置包括事件详情、事件类型和事件时间。
进而,根据所述事件配置确定目标展示方式,包括:根据所述事件详情确定展示规格,根据所述事件类型确定展示类型,根据所述事件时间确定展示时间;将所述展示规格、所述展示类型和所述展示时间确定为所述目标展示方式。
其中,展示规则可以表明展示目标组件时目标组件的尺寸信息,例如,弹框的尺寸信息等;展示类型可以表明展示目标组件时目标组件的展示方式,例如,弹框展示、跳转展示、滚动展示等;展示时间可以表明目标组件的展示时间,例如,展示两秒。
具体地,根据从服务端获取的配置信息所包含的事件配置确定目标组件的展示规格、展示类型和展示时间,进而根据展示规格、展示类型和展示时间确定目标展示方式。
另外,根据所述数据配置确定目标展示内容,包括:根据所述数据配置更新所述页面模板所包含初始组件的初始展示内容,得到所述目标展示内容。
具体地,根据从服务端获取的配置信息所包含的数据配置确定展示内容,并基于该展示内容更新目标组件中的初始展示内容。当然,还可以基于该展示内容更新页面模板中的初始展示内容,在更新目标组件中的初始展示内容和页面模板中的初始展示内容后,可以得到目标展示内容。
目标展示方式和目标展示内容可以作为目标展示状态配置页面模板。
在实际应用中,根据图片格式的设计文件确定的基础模板也可以作为目标组件对页面模板进行配置。
本发明实施例中,根据事件配置和数据配置,实现了低代码调整目标组件的初始动态属性,即确定目标组件的目标展示状态,可以更符合实际需求展示目标组件。
步骤3530、基于所述目标组件和所述目标展示状态配置所述页面模板,得到所述目标模板。
图6为本发明实施例提供的另一种页面生成方法中页面模板的一种配置示意图,如图6所示,可以在飞码渲染引擎的配置区的组件配置中对组件进行事件配置,选定组件对应的事件ID后,开启事件编辑,进而可以调用事件配置所包含的事件详情、事件类型和事件时间对页面模板所包含的初始组件进行配置。
图7为本发明实施例提供的另一种页面生成方法中对页面模板的另一种配置示意图,如图7所示,点击图6中的事件编辑后,可以通过图7中的API接口调用配置信息,以实现基于对话框形式调用组件,该组件可以以弹框、跳转或者滑动的方式接入页面模板,还通过API接口调用配置信息,以实现基于信息形式调用组件,该组件可以以静态组件的方式接入页面模板。
图8为本发明实施例提供的另一种页面生成方法中对页面模板的又一种配置示意图,如图8所示,可以在事件详情中配置被调用组件的长度和宽度以及距离页面模板的边框的距离,当然,还可以配置调用组件的显示效果。例如,可以配置弹框的长度、宽度以及距离页面模板的边框的距离,还可以配置弹框的底部视图和局部视图等。
另一种实施方式中,配置信息包括页面配置信息。
步骤350具体可以包括:基于所述页面配置信息调整所述页面模板的形状信息和/或颜色信息,得到所述目标模板。
具体地,可以在飞码渲染引擎的配置区的页面配置内调用从服务端获取到的页面配置信息,进而根据页面配置信息可以调整页面模板的形状和颜色信息,以根据实际需求对页面模板进行渲染,得到目标模板。
本发明实施例中,通过页面配置信息零代码实现了对页面模板的配置。
又一种实施方式中,配置信息包括逻辑配置信息。
步骤350具体可以包括:接收用户输入的与所述逻辑配置信息对应的代码数据;基于所述代码数据调整所述页面模板得到目标模板。
图9为本发明实施例提供的另一种页面生成方法中对页面模板的又一种配置的示意图,如图9所示,逻辑配置可以为较为复杂的业务逻辑,需要研发人员输入与逻辑配置对应的代码数据,该代码数据用于进一步调整页面模板得到目标模板。例如,逻辑配置可以为根据用户选择显示对应的数字,研发人员在确定与逻辑配置对应的代码数据后,将代码数据以js脚本的形式基于接口接入页面模板,实现根据代码数据在飞码渲染引擎中对页面模板的调整,得到目标模板。
又一种实施方式中,步骤350具体可以包括:将所述基础模板确定为目标组件;基于所述配置信息确定所述目标组件的动态属性,得到目标展示状态;基于所述目标组件和所述目标展示状态配置所述页面模板,得到所述目标模板。
具体地,可以将基础模板确定为目标组件,并基于前述步骤3520同样的方式,根据配置信息包含的事件配置和数据配置调整目标组件的初始动态属性,得到目标展示状态,进而基于前述步骤3530同样的方式,基于目标组件和目标展示状态配置页面模板,得到目标模板。
在实际应用中,也可以根据基础模板确定预设的第一部分目标组件,基于前述步骤3510同样的方式,根据样式配置和属性配置调整页面模板所包含初始组件的初始静态属性,得到第二部分目标组件。
本发明实施例中,从服务端获取到的配置信息,可以用于对页面模板的样式、页面模板所包含组件的形状、页面模板所包含组件的展示状态以及页面模板内的数据内容进行调整,实现了零代码或者低代码调整页面模板,进而可以将调整后的页面模板确定为目标模板,实现了零代码或者低代码确定目标模板。另外,页面模板实现了组件的可视化展示,通过对页面模板进行配置,解决了H5页面中包括逻辑问题的各种场景问题。
步骤360、解析所述目标模板得到目标代码,基于所述目标代码生成所述目标页面。
如前所述,在确定目标模板后,可以对目标模板进行解析得到DSL代码。进而可以将DSL代码拷贝至SDK代码中,得到DSL代码对应的目标页面。
本发明实施例中,通过对目标模板进行解析,得到了目标代码,进而在开发工具中根据目标代码确定目标页面,实现了对目标页面的开发。
本发明实施例提供的一种页面生成方法,包括:解压目标页面的设计文件得到解析数据;将所述图片格式的设计文件确定为基础模板;根据所述解析数据确定所述设计文件对应的页面模板;从服务端获取所述目标页面的配置信息;基于所述配置信息和基础模板调整所述页面模板得到目标模板;解析所述目标模板得到目标代码,基于所述目标代码生成所述目标页面。上述技术方案,首先可以解压设计文件得到解析数据,并将解析数据所包含的基础模板图片格式的设计文件确定为基础模板,在飞码渲染引擎中确定解析数据对应的页面模板,实现零代码确定页面模板,其次从服务端获取配置信息,以基于配置信息和基础模板对页面模板进行配置,实现低代码确定目标模板,提升目标模板的开发效率,还可以对目标模板进行解析,得到目标代码,进而在开发工具中根据目标代码可以生成目标页面,进一步降低目标页面开发的工作量,提升页面开发效率。
图10为本发明实施例提供的一种页面生成装置的结构示意图。该装置与上述各实施例的页面生成方法属于同一个发明构思,在页面生成装置的实施例中未详尽描述的细节内容,可以参考上述页面生成方法的实施例。
该页面生成装置的具体结构如图10所示,包括:
解压模块1010,用于解压目标页面的设计文件得到解析数据,根据所述解析数据确定所述设计文件对应的页面模板;
获取模块1020,用于从服务端获取所述目标页面的配置信息,并基于所述配置信息调整所述页面模板得到目标模板;
执行模块1030,用于解析所述目标模板得到目标代码,基于所述目标代码生成所述目标页面。
在上述实施例的基础上,解压模块1010,具体用于:
对所述目标页面的所述设计文件进行解压,得到容器格式的设计文件、文本格式的设计文件、集合格式的设计文件、遮罩格式的设计文件、图片格式的设计文件和可缩放矢量图格式的设计文件中至少一种;
将容器格式的设计文件、文本格式的设计文件、集合格式的设计文件、遮罩格式的设计文件、图片格式的设计文件和可缩放矢量图格式的设计文件中至少一种确定为设计容器,并为各所述设计容器添加控件,得到所述页面模板。
在上述实施例的基础上,该装置还包括:
确定模块,用于将所述图片格式的设计图确定为基础模板。
在上述实施例的基础上,获取模块1020,具体用于:
从所述服务端获取所述目标页面的配置信息,并基于所述配置信息和基础模板确定所述目标模板。
在上述实施例的基础上,所述配置信息包括组件配置信息,所述组件配置信息包括样式配置、属性配置、事件配置和数据配置,相应地,获取模块830,具体用于:
从所述服务端获取所述目标页面的配置信息;
基于所述样式配置和所述属性配置调整所述页面模板所包含初始组件的初始静态属性,得到目标组件;
基于所述事件配置和所述数据配置调整所述目标组件的初始动态属性,得到目标展示状态;
基于所述目标组件和所述目标展示状态配置所述页面模板,得到所述目标模板。
进一步地,所述初始静态属性包括初始样式和初始形状,相应地,基于所述样式配置和所述属性配置调整所述页面模板所包含初始组件的初始静态属性,得到目标组件,包括:
基于所述样式配置调整各所述初始组件的所述初始样式,基于所述属性配置调整各所述初始组件的所述初始形状,得到所述目标组件。
进一步地,基于所述事件配置和所述数据配置调整所述目标组件的初始动态属性,得到目标展示状态,包括:
根据所述事件配置确定目标展示方式,根据所述数据配置确定目标展示内容;基于所述目标展示方式和所述目标展示内容调整所述目标组件的所述初始动态属性,得到所述目标展示状态。
进一步地,所述事件配置包括事件详情、事件类型和事件时间,相应地,根据所述事件配置确定目标展示方式,包括:
根据所述事件详情确定展示规格,根据所述事件类型确定展示类型,根据所述事件时间确定展示时间;将所述展示规格、所述展示类型和所述展示时间确定为所述目标展示方式。
进一步地,根据所述数据配置确定目标展示内容,包括:
根据所述数据配置更新所述页面模板所包含初始组件的初始展示内容,得到所述目标展示内容。
在上述实施例的基础上,所述配置信息包括页面配置信息,相应地,获取模块1020,具体用于:
从所述服务端获取所述目标页面的配置信息;基于所述页面配置信息调整所述页面模板的形状信息和/或颜色信息,得到所述目标模板。
在上述实施例的基础上,所述配置信息包括逻辑配置,相应地,相应地,获取模块1020,具体用于:
从所述服务端获取所述目标页面的配置信息;接收用户输入的与所述逻辑配置信息对应的代码数据;基于所述代码数据调整所述页面模板得到目标模板。
在上述实施例的基础上,获取模块1020具体用于:从所述服务端获取所述目标页面的配置信息;将所述基础模板确定为目标组件;基于所述配置信息确定所述目标组件的动态属性,得到目标展示状态;基于所述目标组件和所述目标展示状态配置所述页面模板,得到所述目标模板。
本发明实施例所提供的页面生成装置可执行本发明任意实施例所提供的页面生成方法,具备执行页面生成方法相应的功能模块和有益效果。
值得注意的是,上述页面生成装置的实施例中,所包括的各个单元和模块只是按照功能逻辑进行划分的,但并不局限于上述的划分,只要能够实现相应的功能即可;另外,各功能单元的具体名称也只是为了便于相互区分,并不用于限制本发明的保护范围。
图11为本发明实施例提供的一种计算机设备的结构示意图。图11示出了适于用来实现本发明实施方式的示例性计算机设备11的框图。图11显示的计算机设备11仅仅是一个示例,不应对本发明实施例的功能和使用范围带来任何限制。
如图11所示,计算机设备11以通用计算计算机设备的形式表现。计算机设备11的组件可以包括但不限于:一个或者多个处理器或者处理单元16,系统存储器28,连接不同系统组件(包括系统存储器28和处理单元16)的总线18。
总线18表示几类总线结构中的一种或多种,包括存储器总线或者存储器控制器,外围总线,图形加速端口,处理器或者使用多种总线结构中的任意总线结构的局域总线。举例来说,这些体系结构包括但不限于工业标准体系结构(ISA)总线,微通道体系结构(MAC)总线,增强型ISA总线、视频电子标准协会(VESA)局域总线以及外围组件互连(PCI)总线。
计算机设备11典型地包括多种计算机系统可读介质。这些介质可以是任何能够被计算机设备11访问的可用介质,包括易失性和非易失性介质,可移动的和不可移动的介质。
系统存储器28可以包括易失性存储器形式的计算机系统可读介质,例如随机存取存储器(RAM)30和/或高速缓存存储器32。计算机设备11可以进一步包括其它可移动/不可移动的、易失性/非易失性计算机系统存储介质。仅作为举例,存储系统34可以用于读写不可移动的、非易失性磁介质(图11未显示,通常称为“硬盘驱动器”)。尽管图11中未示出,可以提供用于对可移动非易失性磁盘(例如“软盘”)读写的磁盘驱动器,以及对可移动非易失性光盘(例如CD-ROM,DVD-ROM或者其它光介质)读写的光盘驱动器。在这些情况下,每个驱动器可以通过一个或者多个数据介质接口与总线18相连。系统存储器28可以包括至少一个程序产品,该程序产品具有一组(例如至少一个)程序模块,这些程序模块被配置以执行本发明各实施例的功能。
具有一组(至少一个)程序模块42的程序/实用工具40,可以存储在例如系统存储器28中,这样的程序模块42包括但不限于操作系统、一个或者多个应用程序、其它程序模块以及程序数据,这些示例中的每一个或某种组合中可能包括网络环境的实现。程序模块42通常执行本发明所描述的实施例中的功能和/或方法。
计算机设备11也可以与一个或多个外部设备14(例如键盘、指向设备、显示器24等)通信,还可与一个或者多个使得用户能与该计算机设备11交互的设备通信,和/或与使得该计算机设备11能与一个或多个其它计算设备进行通信的任何设备(例如网卡,调制解调器等等)通信。这种通信可以通过输入/输出(I/O)接口22进行。并且,计算机设备11还可以通过网络适配器20与一个或者多个网络(例如局域网(LAN),广域网(WAN)和/或公共网络,例如因特网)通信。如图11所示,网络适配器20通过总线18与计算机设备11的其它模块通信。应当明白,尽管图11中未示出,可以结合计算机设备11使用其它硬件和/或软件模块,包括但不限于:微代码、设备驱动器、冗余处理单元、外部磁盘驱动阵列、RAID系统、磁带驱动器以及数据备份存储系统等。
处理单元16通过运行存储在系统存储器28中的程序,从而执行各种功能应用以及页面显示,例如实现本发实施例所提供的页面生成方法,该方法包括:
解压目标页面的设计文件得到解析数据,根据所述解析数据确定所述设计文件对应的页面模板;
从服务端获取所述目标页面的配置信息,并基于所述配置信息调整所述页面模板得到目标模板;
解析所述目标模板得到目标代码,基于所述目标代码生成所述目标页面。
当然,本领域技术人员可以理解,处理器还可以实现本发明任意实施例所提供的页面生成方法的技术方案。
本发明实施例提供了一种计算机可读存储介质,其上存储有计算机程序,该程序被处理器执行时实现例如本发实施例所提供的页面生成方法,该方法包括:
解压目标页面的设计文件得到解析数据,根据所述解析数据确定所述设计文件对应的页面模板;
从服务端获取所述目标页面的配置信息,并基于所述配置信息调整所述页面模板得到目标模板;
解析所述目标模板得到目标代码,基于所述目标代码生成所述目标页面。
本发明实施例的计算机存储介质,可以采用一个或多个计算机可读的介质的任意组合。计算机可读介质可以是计算机可读信号介质或者计算机可读存储介质。计算机可读存储介质例如可以是但不限于:电、磁、光、电磁、红外线、或半导体的系统、装置或器件,或者任意以上的组合。计算机可读存储介质的更具体的例子(非穷举的列表)包括:具有一个或多个导线的电连接、便携式计算机磁盘、硬盘、随机存取存储器(RAM)、只读存储器(ROM)、可擦式可编程只读存储器(EPROM或闪存)、光纤、便携式紧凑磁盘只读存储器(CD-ROM)、光存储器件、磁存储器件、或者上述的任意合适的组合。在本文件中,计算机可读存储介质可以是任何包含或存储程序的有形介质,该程序可以被指令执行系统、装置或者器件使用或者与其结合使用。
计算机可读的信号介质可以包括在基带中或者作为载波一部分传播的数据信号,其中承载了计算机可读的程序代码。这种传播的数据信号可以采用多种形式,包括但不限于电磁信号、光信号或上述的任意合适的组合。计算机可读的信号介质还可以是计算机可读存储介质以外的任何计算机可读介质,该计算机可读介质可以发送、传播或者传输用于由指令执行系统、装置或者器件使用或者与其结合使用的程序。
计算机可读介质上包含的程序代码可以用任何适当的介质传输,包括但不限于:无线、电线、光缆、RF等等,或者上述的任意合适的组合。
可以以一种或多种程序设计语言或其组合来编写用于执行本发明操作的计算机程序代码,程序设计语言包括面向对象的程序设计语言,诸如Java、Smalltalk、C++,还包括常规的过程式程序设计语言—诸如“C”语言或类似的程序设计语言。程序代码可以完全地在用户计算机上执行、部分地在用户计算机上执行、作为一个独立的软件包执行、部分在用户计算机上部分在远程计算机上执行、或者完全在远程计算机或服务器上执行。在涉及远程计算机的情形中,远程计算机可以通过任意种类的网络,包括局域网(LAN)或广域网(WAN),连接到用户计算机,或者,可以连接到外部计算机(例如利用因特网服务提供商来通过因特网连接)。
本发明中对数据的获取、存储、使用、处理等均符合国家法律法规的相关规定。
本领域普通技术人员应该明白,上述的本发明的各模块或各步骤可以用通用的计算装置来实现,它们可以集中在单个计算装置上,或者分布在多个计算装置所组成的网络上,可选地,他们可以用计算机装置可执行的程序代码来实现,从而可以将它们存储在存储装置中由计算装置来执行,或者将它们分别制作成各个集成电路模块,或者将它们中的多个模块或步骤制作成单个集成电路模块来实现。这样,本发明不限制于任何特定的硬件和软件的结合。
注意,上述仅为本发明的较佳实施例及所运用技术原理。本领域技术人员会理解,本发明不限于这里的特定实施例,对本领域技术人员来说能够进行各种明显的变化、重新调整和替代而不会脱离本发明的保护范围。因此,虽然通过以上实施例对本发明进行了较为详细的说明,但是本发明不仅仅限于以上实施例,在不脱离本发明构思的情况下,还可以包括更多其他等效实施例,而本发明的范围由所附的权利要求范围决定。

Claims (13)

1.一种页面生成方法,其特征在于,包括:
解压目标页面的设计文件得到解析数据,根据所述解析数据确定所述设计文件对应的页面模板;
从服务端获取所述目标页面的配置信息,并基于所述配置信息调整所述页面模板得到目标模板;
解析所述目标模板得到目标代码,基于所述目标代码生成所述目标页面。
2.根据权利要求1所述的页面生成方法,其特征在于,解压目标页面的设计文件得到解析数据,根据所述解析数据确定所述设计文件对应的页面模板,包括:
对所述目标页面的所述设计文件进行解压,得到容器格式的设计文件、文本格式的设计文件、集合格式的设计文件、遮罩格式的设计文件、图片格式的设计文件和可缩放矢量图格式的设计文件中至少一种;
将容器格式的设计文件、文本格式的设计文件、集合格式的设计文件、遮罩格式的设计文件、图片格式的设计文件和可缩放矢量图格式的设计文件中至少一种确定为设计容器,并为各所述设计容器添加控件,得到所述页面模板。
3.根据权利要求1所述的页面生成方法,其特征在于,所述配置信息包括组件配置信息,所述组件配置信息包括样式配置、属性配置、事件配置和数据配置,相应地,基于所述配置信息调整所述页面模板得到目标模板,包括:
基于所述样式配置和所述属性配置调整所述页面模板所包含初始组件的初始静态属性,得到目标组件;
基于所述事件配置和所述数据配置调整所述目标组件的初始动态属性,得到目标展示状态;
基于所述目标组件和所述目标展示状态配置所述页面模板,得到所述目标模板。
4.根据权利要求3所述的页面生成方法,其特征在于,所述初始静态属性包括初始样式和初始形状,相应地,基于所述样式配置和所述属性配置调整所述页面模板所包含初始组件的初始静态属性,得到目标组件,包括:
基于所述样式配置调整各所述初始组件的所述初始样式,基于所述属性配置调整各所述初始组件的所述初始形状,得到所述目标组件。
5.根据权利要求3所述的页面生成方法,其特征在于,基于所述事件配置和所述数据配置调整所述目标组件的初始动态属性,得到目标展示状态,包括:
根据所述事件配置确定目标展示方式,根据所述数据配置确定目标展示内容;
基于所述目标展示方式和所述目标展示内容调整所述目标组件的所述初始动态属性,得到所述目标展示状态。
6.根据权利要求5所述的页面生成方法,其特征在于,所述事件配置包括事件详情、事件类型和事件时间,相应地,根据所述事件配置确定目标展示方式,包括:
根据所述事件详情确定展示规格,根据所述事件类型确定展示类型,根据所述事件时间确定展示时间;
将所述展示规格、所述展示类型和所述展示时间确定为所述目标展示方式。
7.根据权利要求5所述的页面生成方法,其特征在于,根据所述数据配置确定目标展示内容,包括:
根据所述数据配置更新所述页面模板所包含初始组件的初始展示内容,得到所述目标展示内容。
8.根据权利要求1所述的页面生成方法,其特征在于,所述配置信息包括页面配置信息,相应地,基于所述配置信息调整所述页面模板得到目标模板,包括:
基于所述页面配置信息调整所述页面模板的形状信息和/或颜色信息,得到所述目标模板。
9.根据权利要求1所述的页面生成方法,其特征在于,所述配置信息包括逻辑配置信息,相应地,基于所述配置信息调整所述页面模板得到目标模板,包括:
接收用户输入的与所述逻辑配置信息对应的代码数据;
基于所述代码数据调整所述页面模板得到目标模板。
10.根据权利要求2所述的页面生成方法,其特征在于,在解压目标页面的设计图得到解析数据之后,还包括:
将所述图片格式的设计图确定为基础模板;
相应地,基于所述配置信息调整所述页面模板得到目标模板,包括:
将所述基础模板确定为目标组件;
基于所述配置信息确定所述目标组件的动态属性,得到目标展示状态;
基于所述目标组件和所述目标展示状态配置所述页面模板,得到所述目标模板。
11.一种页面生成装置,其特征在于,包括:
解压模块,用于解压目标页面的设计文件得到解析数据,根据所述解析数据确定所述设计文件对应的页面模板;
获取模块,用于从服务端获取所述目标页面的配置信息,并基于所述配置信息调整所述页面模板得到目标模板;
执行模块,用于解析所述目标模板得到目标代码,基于所述目标代码生成所述目标页面。
12.一种计算机设备,包括存储器、处理器及存储在存储器上并可在处理器上运行的计算机程序,其特征在于,所述处理器执行所述程序时实现如权利要求1-10中任一所述的页面生成方法。
13.一种包含计算机可执行指令的存储介质,所述计算机可执行指令在由计算机处理器执行时用于执行如权利要求1-10中任一所述的页面生成方法。
CN202210744475.6A 2022-06-27 2022-06-27 一种页面生成方法、装置、设备和存储介质 Pending CN115098092A (zh)

Priority Applications (1)

Application Number Priority Date Filing Date Title
CN202210744475.6A CN115098092A (zh) 2022-06-27 2022-06-27 一种页面生成方法、装置、设备和存储介质

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
CN202210744475.6A CN115098092A (zh) 2022-06-27 2022-06-27 一种页面生成方法、装置、设备和存储介质

Publications (1)

Publication Number Publication Date
CN115098092A true CN115098092A (zh) 2022-09-23

Family

ID=83294866

Family Applications (1)

Application Number Title Priority Date Filing Date
CN202210744475.6A Pending CN115098092A (zh) 2022-06-27 2022-06-27 一种页面生成方法、装置、设备和存储介质

Country Status (1)

Country Link
CN (1) CN115098092A (zh)

Cited By (1)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN117667076A (zh) * 2023-12-06 2024-03-08 北京波士山信息技术有限公司 一种面向动态页面的跨组件消息传递方法及系统

Cited By (1)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN117667076A (zh) * 2023-12-06 2024-03-08 北京波士山信息技术有限公司 一种面向动态页面的跨组件消息传递方法及系统

Similar Documents

Publication Publication Date Title
CN109597617B (zh) 基于模板快速生成业务页面的方法和装置
CN108984174B (zh) 跨平台的应用创建方法、装置、服务器和存储介质
CN107908608B (zh) 文稿的转换及在三维空间中展现的方法、存储介质和设备
CN113126990B (zh) 一种页面开发方法、装置、设备及存储介质
CN113031946B (zh) 一种渲染页面组件的方法和装置
CN111324833A (zh) 页面展示方法、装置、电子设计及计算机可读介质
CN110780874B (zh) 用于生成信息的方法和装置
CN110766772A (zh) 基于Flutter跨平台海报制作方法装置介质和设备
CN111045675A (zh) 一种基于Flutter的页面生成方法、装置、设备和存储介质
CN114077430A (zh) 界面生成方法、装置、电子设备及存储介质
CN111026493B (zh) 界面渲染的处理方法和装置
CN115510347A (zh) 演示文稿的转换方法、装置、电子设备及存储介质
CN115098092A (zh) 一种页面生成方法、装置、设备和存储介质
CN110609981A (zh) 文本处理方法以及装置、电子设备以及计算机可读存储介质
CN110717134A (zh) 产品说明发布方法、装置、存储介质及电子设备
CN111198738A (zh) 移动端页面展示方法、装置及电子设备
US20190102148A1 (en) Development Environment for Real-Time Application Development
CN113296759B (zh) 用户界面处理方法、用户界面处理系统、设备及存储介质
CN116775174A (zh) 一种基于用户界面框架的处理方法、装置、设备及介质
CN113849164A (zh) 数据处理方法、装置、电子设备和存储器
US20180090174A1 (en) Video generation of project revision history
CN113961279A (zh) 页面渲染方法、装置、服务器和存储介质
CN113791783A (zh) 控件生成方法、装置、设备及存储介质
US10607391B2 (en) Automated virtual artifact generation through natural language processing
CN111666068A (zh) 一种平台开发框架、构建方法、设备及介质

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