CN111258577A - 页面渲染方法、装置、电子设备和存储介质 - Google Patents

页面渲染方法、装置、电子设备和存储介质 Download PDF

Info

Publication number
CN111258577A
CN111258577A CN201911215498.2A CN201911215498A CN111258577A CN 111258577 A CN111258577 A CN 111258577A CN 201911215498 A CN201911215498 A CN 201911215498A CN 111258577 A CN111258577 A CN 111258577A
Authority
CN
China
Prior art keywords
page
layout
data structure
rendering
style
Prior art date
Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
Granted
Application number
CN201911215498.2A
Other languages
English (en)
Other versions
CN111258577B (zh
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.)
Taikang Asset Management Co ltd
Taikang Insurance Group Co Ltd
Original Assignee
Taikang Asset Management Co ltd
Taikang Insurance Group 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 Taikang Asset Management Co ltd, Taikang Insurance Group Co Ltd filed Critical Taikang Asset Management Co ltd
Priority to CN201911215498.2A priority Critical patent/CN111258577B/zh
Publication of CN111258577A publication Critical patent/CN111258577A/zh
Application granted granted Critical
Publication of CN111258577B publication Critical patent/CN111258577B/zh
Active legal-status Critical Current
Anticipated expiration legal-status Critical

Links

Images

Classifications

    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F8/00—Arrangements for software engineering
    • G06F8/30—Creation or generation of source code
    • G06F8/38—Creation or generation of source code for implementing user interfaces
    • 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)
  • General Engineering & Computer Science (AREA)
  • Human Computer Interaction (AREA)
  • Physics & Mathematics (AREA)
  • General Physics & Mathematics (AREA)
  • Information Transfer Between Computers (AREA)
  • Document Processing Apparatus (AREA)

Abstract

本发明实施例提供了一种页面渲染方法和装置，包括：从服务器中提取页面描述文件；从页面描述文件中提取属性标签，并按照移动终端的当前操作系统将属性标签映射为对应的页面对象；按特定数据结构保存页面对象；按特定数据结构渲染页面对象。在本发明实施例中，不同的操作系统可以通过从服务器获取相同的页面描述文件，来渲染得到相同的页面，从而无需根据操作系统的不同来编写多套代码，实现页面描述文件的跨平台使用。此外，通过在服务器上部署按预定义规则生成的页面描述文件的方式，使得移动终端可以实时获取页面描述文件的更新信息，实现页面的动态更新。

Description

页面渲染方法、装置、电子设备和存储介质
技术领域
本发明涉及渲染技术领域，特别是涉及一种页面渲染方法和一种页面渲染装置。
背景技术
现有的APP页面在开发时，一般都是基于操作系统提供的原生UI框架来开发APP页面。在这种情况下，如果开发人员想要开发一个可以在iOS系统与安卓系统上运行的APP页面时，便需要使用iOS系统与安卓系统的UI框架，分别用Objective-C与Java语言，编写两份代码。
此外编写完成的代码需要经过编译、打包，生成APP安装包，并发布到应用商店；用户才可以通过在应用商店上下载并安装该安装包，进而渲染生成APP的使用页面。
然而，这种传统的、使用手机原生UI框架开发APP页面的方式，需要根据不同的操作系统编写不同的代码，并将代码编译后才可以被用户下载并安装；终端再对代码进行渲染才能生成APP的页面，开发效率低，发布周期长，无法动态部署。
发明内容
鉴于上述问题，提出了本发明实施例以便提供一种克服上述问题或者至少部分地解决上述问题的一种页面渲染方法和相应的一种页面渲染装置。
为了解决上述问题，本发明实施例公开了一种页面渲染方法，应用于移动终端，所述方法包括：
从所述服务器中提取页面描述文件；
从所述页面描述文件中提取属性标签，并按照所述移动终端的当前操作系统将所述属性标签映射为对应的页面对象；
按特定数据结构保存所述页面对象；
按所述特定数据结构渲染所述页面对象。
可选地，所述移动终端从所述服务器中提取所述页面描述文件，包括：
当打开一个页面时，所述移动终端获取与所述页面描述文件对应的统一资源定位符；
从所述服务器中提取与所述统一资源定位符对应的页面描述文件。
可选地，所述页面描述文件包括页面布局文件；所述属性标签包括布局项标签；所述页面对象包括布局项对象；所述从所述页面描述文件中提取属性标签，并按照当前操作系统将所述属性标签映射为对应的页面对象的步骤，包括：
从所述页面布局文件中提取所述布局项标签；
解析所述布局项标签，并按照当前操作系统将所述布局项标签映射为对应的布局项对象。
可选地，所述属性标签还包括页脚标签；所述页面对象还包括页脚对象；所述从所述页面描述文件中提取属性标签，并按照当前操作系统将所述属性标签映射为对应的页面对象的步骤，还包括：
从所述页面布局文件中提取页脚标签；
解析所述页脚标签，并按照当前操作系统将所述页脚标签映射为对应的页脚对象。
可选地，所述页面描述文件还包括页面样式文件；所述属性标签还包括页面样式标签；所述页面对象还包括页面样式对象，所述从所述页面描述文件中提取属性标签，并按照当前操作系统将所述属性标签映射为对应的页面对象的步骤，还包括：
从所述页面样式文件中提取页面样式标签；
解析所述页面样式标签，并按照当前操作系统将所述页面样式标签映射为对应的页面样式对象。
所述特定数据结构包括树形数据结构，所述页面对象包括布局项对象，所述按特定数据结构保存所述页面对象，包括：
按所述树形数据结构保存所述布局项对象；
或者，所述特定数据结构包括字典数据结构，所述页面对象包括页面样式对象，所述按特定数据结构保存所述页面对象，包括：
按所述字典数据结构保存所述页面样式对象。
可选地，所述特定数据结构包括布局树形数据结构；所述按特定数据结构保存所述页面对象，包括：
按布局树形数据结构保存所述布局项对象。
可选地，所述特定数据结构还包括页脚树形数据结构；所述按特定数据结构保存所述页面对象，还包括：
按页脚树形数据结构保存所述页脚对象。
可选地，所述特定数据结构还包括字典数据结构；所述按特定数据结构保存所述页面对象，还包括：
按字典数据结构保存所述页面样式对象。
可选地，所述布局树形数据结构具有布局节点，每个布局节点包括布局子节点；所述布局项对象具有对应的基本组件对象；所述按布局树形数据结构保存所述布局项对象，包括：
将每个布局项对象，分别保存为所述布局树形数据结构中的一个布局节点；
将每个布局项对象对应的基本组件对象，分别保存为所述布局项对象对应的布局节点下的一个布局子节点。
可选地，所述页脚树形数据结构具有页脚节点，每个页脚节点包括页脚子节点；所述页脚对象具有对应的基本组件对象；所述按页脚树形数据结构保存所述页脚对象，包括：
将每个页脚对象，分别保存为所述页脚树形数据结构中的一个页脚节点；
将每个页脚对象对应的基本组件对象，分别保存为所述页脚对象对应的页脚节点下的一个页脚子节点。
可选地，所述页面样式对象具有样式名称，所述按字典数据结构保存所述页面样式对象，包括：
获取所述页面样式对象与对应的样式之间的关联关系；
将所述关联关系保存在字典数据结构中。
可选地，所述按所述特定数据结构渲染所述页面对象，包括：
当所述特定数据结构为树形数据结构时，
循环获取所述树形数据结构顶层的所述页面对象；
确定所述页面对象的布局形式；
按照所述布局形式渲染所述页面对象。
可选地，当所述当前操作系统为iOS系统时，所述页面为表格数据展示视图UITableView，所述表格数据展示视图UITableView具有多个内容单元Cell；所述按照所述布局形式渲染所述页面对象，包括：
按照所述布局形式，将每一个所述页面对象分别渲染为所述表格数据展示视图UITableView中的一个内容单元Cell。
可选地，当所述当前操作系统为安卓系统时，所述页面为列表视图ListView；所述列表视图ListView具有多个列表条目Item；所述按照所述布局形式渲染所述页面对象，包括：
按照所述布局形式，将每一个所述页面对象分别渲染为所述列表视图ListView中的一个列表条目Item。
可选地，所述按照所述布局形式渲染所述页面对象，包括：
当所述布局形式为流式布局时，将所述页面对象对应的基本组件对象，按照预设顺序渲染至所述页面中。
可选地，所述按照所述布局形式渲染所述页面对象，包括：
当所述布局形式为轮播布局时，在所述页面中绘制轮播组件；
确定多个所述页面对象的子布局形式；所述子布局形式包括流式布局或格栅布局；
在所述轮播组件中，将多个所述页面对象按照所述流式布局，或，所述格栅布局渲染至所述页面中。
可选地，所述按照所述布局形式渲染所述页面对象，包括：
当所述布局形式为格栅布局时，计算每个所述页面对象的列宽；
将每个所述页面对象以对应的列宽渲染至所述页面中，并将每个所述页面对象对应的基本组件对象，按照预设顺序渲染至所述页面中。
可选地，所述按所述特定数据结构渲染所述页面对象，包括：
当所述特定数据结构为字典数据结构时，
在所述字典数据结构中，查找所述页面样式对象对应的样式；
采用所述样式渲染所述页面样式对象。
本发明实施例还公开了一种页面渲染装置，应用于移动终端，所述装置包括：
页面描述文件提取模块，用于从所述服务器中提取页面描述文件；
页面对象映射模块，用于从所述页面描述文件中提取属性标签，并按照所述移动终端的当前操作系统将所述属性标签映射为对应的页面对象；
页面对象保存模块，用于按特定数据结构保存所述页面对象；
页面对象渲染模块，用于按所述特定数据结构渲染所述页面对象。
可选地，所述页面描述文件提取模块，包括：
统一资源定位符获取子模块，用于当打开一个页面时，所述移动终端获取与所述页面描述文件对应的统一资源定位符；
页面描述文件提取子模块，用于从所述服务器中提取与所述统一资源定位符对应的页面描述文件。
可选地，所述页面描述文件包括页面布局文件；所述属性标签包括布局项标签；所述页面对象包括布局项对象；所述页面对象映射模块，包括：
布局项标签提取子模块，用于从所述页面布局文件中提取所述布局项标签；
布局项对象映射子模块，用于解析所述布局项标签，并按照当前操作系统将所述布局项标签映射为对应的布局项对象。
可选地，所述属性标签还包括页脚标签；所述页面对象还包括页脚对象；所述页面对象映射模块，还包括：
页脚标签提取子模块，用于从所述页面布局文件中提取页脚标签；
页脚对象映射子模块，用于解析所述页脚标签，并按照当前操作系统将所述页脚标签映射为对应的页脚对象。
可选地，所述页面描述文件还包括页面样式文件；所述属性标签还包括页面样式标签；所述页面对象还包括页面样式对象，所述页面对象映射模块，包括：
页面样式标签提取子模块，用于从所述页面样式文件中提取页面样式标签；
页面样式对象映射子模块，用于解析所述页面样式标签，并按照当前操作系统将所述页面样式标签映射为对应的页面样式对象。
可选地，所述特定数据结构包括布局树形数据结构；所述页面对象保存模块，包括：
布局项对象保存子模块，用于按布局树形数据结构保存所述布局项对象。
可选地，所述特定数据结构还包括页脚树形数据结构；所述页面对象保存模块，还包括：
页脚对象保存子模块，用于按页脚树形数据结构保存所述页脚对象。
可选地，所述特定数据结构还包括字典数据结构；所述页面对象保存模块，还包括：
页面样式保存子模块，用于按字典数据结构保存所述页面样式对象。
可选地，所述布局树形数据结构具有布局节点，每个布局节点包括布局子节点；所述布局项对象具有对应的基本组件对象；所述布局项对象保存模块，包括：
布局节点保存单元，用于将每个布局项对象，分别保存为所述布局树形数据结构中的一个布局节点；
布局子节点保存单元，用于将每个布局项对象对应的基本组件对象，分别保存为所述布局项对象对应的布局节点下的一个布局子节点。
可选地，所述页脚树形数据结构具有页脚节点，每个页脚节点包括页脚子节点；所述页脚对象具有对应的基本组件对象；所述页脚对象保存子模块，包括：
页脚节点保存单元，用于将每个页脚对象，分别保存为所述页脚树形数据结构中的一个页脚节点；
页脚子节点保存单元，用于将每个页脚对象对应的基本组件对象，分别保存为所述页脚对象对应的页脚节点下的一个页脚子节点。
可选地，所述页面样式对象具有样式名称，所述页面样式对象保存子模块，包括：
关联关系获取单元，用于获取所述页面样式对象与对应的样式之间的关联关系；
关联关系保存单元，用于将所述关联关系保存在字典数据结构中。
可选地，所述页面对象渲染模块，包括：
顶层页面对象获取子模块，用于当所述特定数据结构为树形数据结构时，循环获取所述树形数据结构顶层的所述页面对象；
布局形式确定子模块，用于确定所述页面对象的布局形式；
页面对象渲染子模块，用于按照所述布局形式渲染所述页面对象。
可选地，当所述当前操作系统为iOS系统时，所述页面为表格数据展示视图UITableView，所述表格数据展示视图UITableView具有多个内容单元Cell；所述页面对象渲染子模块，包括：
Cell渲染单元，用于按照所述布局形式，将每一个所述页面对象分别渲染为所述表格数据展示视图UITableView中的一个内容单元Cell。
可选地，当所述当前操作系统为安卓系统时，所述页面为列表视图ListView；所述列表视图ListView具有多个列表条目Item；所述页面对象渲染子模块，包括：
Item渲染单元，用于按照所述布局形式，将每一个所述页面对象分别渲染为所述列表视图ListView中的一个Item。
可选地，所述页面对象渲染子模块，包括：
第一顶层页面渲染单元，用于当所述布局形式为流式布局时，将所述页面对象对应的基本组件对象，按照预设顺序渲染至所述页面中。
可选地，所述页面对象渲染子模块，包括：
轮播组件绘制单元，用于当所述布局形式为轮播布局时，在所述页面中绘制轮播组件；
子布局形式确定单元，用于确定多个所述页面对象的子布局形式；所述子布局形式包括流式布局或格栅布局；
第二顶层页面对象渲染单元，用于在所述轮播组件中，将多个所述顶层页面对象按照所述流式布局，或，所述格栅布局渲染至所述页面中。
可选地，所述页面对象渲染子模块，包括：
列宽计算单元，用于当所述布局形式为格栅布局时，计算每个所述页面对象的列宽；
第三顶层页面对象渲染单元，用于将每个所述页面对象以对应的列宽渲染至所述页面中，并将每个所述页面对象对应的基本组件对象，按照预设顺序渲染至所述页面中。
可选地，所述页面对象渲染模块，包括：
样式查找子模块，用于当所述特定数据结构为字典数据结构时，在所述字典数据结构中，查找所述页面样式对象对应的样式；
页面样式对象渲染子模块，用于采用所述样式渲染所述页面样式对象。
本发明实施例还公开了一种装置，包括：
一个或多个处理器；和
其上存储有指令的一个或多个机器可读介质，当由所述一个或多个处理器执行时，使得所述装置执行如上所述的一个或多个的方法。
本发明实施例还公开了一个或多个机器可读介质，其上存储有指令，当由一个或多个处理器执行时，使得所述处理器执行如上所述的一个或多个的方法。
本发明实施例包括以下优点：本发明实施例提供了一种页面渲染方法，包括：从服务器中提取页面描述文件；再从页面描述文件中提取属性标签，并按当前操作系统将属性标签映射为对应的页面对象；接着按特定数据结构保存页面对象，最后按该特定数据结构渲染页面对象。在本发明实施例中，不同的操作系统可以通过从服务器获取相同的页面描述文件，来渲染得到相同的页面；从而无需根据操作系统的不同来编写多套代码，实现了页面描述文件的跨平台使用。此外，通过在服务器上部署按预定义规则生成的页面描述文件的方式，使得移动终端可以实时获取页面描述文件的更新信息，实现页面的动态更新。
附图说明
图1是本发明的一种页面渲染方法实施例的步骤流程图；
图2是本发明的一种页面渲染方法的另一种实施例的步骤流程图；
图3a是本发明的一种流式布局渲染生成的页面的示意图；
图3b是本发明的一种轮播布局渲染生成的页面的示意图；
图3c是本发明的一种格栅布局渲染生成的页面的示意图；
图4是本发明的一种页面渲染装置实施例的结构框图。
具体实施方式
为使本发明的上述目的、特征和优点能够更加明显易懂，下面结合附图和具体实施方式对本发明作进一步详细的说明。
本发明实施例的核心构思之一在于，在服务器上部署可分别被部署在iOS系统和安卓系统上的解析引擎解析的页面描述文件；使得iOS系统和安卓系统可基于对应的解析规则从相同的页面描述文件中，渲染出适用于自身的页面。
以下通过具体实施例进行说明：
参照图1，示出了本发明的一种页面渲染方法实施例的步骤流程图，应用于移动终端，所述移动终端配置有对应的操作系统；所述移动终端与服务器连接，所述服务器部署有按预定义规则生成的页面描述文件，所述方法具体可以包括如下步骤：
步骤101，从所述服务器中提取页面描述文件；
页面描述文件，是指以代码的形式编写，用于描述页面内容及样式的文件。在本发明实施例中，在服务器上部署页面描述文件之前，需要预先按照预定义规则生成页面描述文件。
在具体实现中，可以预先为iOS系统和安卓系统制定统一的页面描述模板，通过该页面描述模板来编写页面描述文件。在一个示例中，可以通过标准的HTMI语言来制定页面描述模板。
在页面描述模板中，定义了页面的结构、页面的布局形式、以及包含在布局形式下的页面的基本组件。
其中，页面结构可以包括配置信息、导航、布局项、页脚四部分构成。
配置信息可以定义页面需要导入的资源文件，其中，资源文件中可以包括存储页面布局代码的文件和存储页面样式表代码的文件。页面布局代码可以使用<script>标签导入，其中src属性的值为资源文件的具体路径。页面样式表代码可以使用<link>标签导入，其中href属性的值为资源文件的具体路径。页面布局代码影响页面布局，页面样式表代码影响页面样式。
导航可以用于配置页面标题。
布局项定义了页面的布局内容和布局形式。
页脚定义了每个页面的页脚信息，如页码等。
页面描述模板所定义的页面布局形式可以包括流式布局、轮播布局、格栅布局。
流式布局是指按顺序从上到下布局。在一个示例中，可以使用<li class＝“detail”>定义流式布局项，其中，流式布局项可以包含<div class＝“text”>文本标签、<img>图片标签。
轮播布局是指以左右轮播的形式展示布局项。在一个示例中，可以使用<li class＝“paging”>定义轮播布局，其下包含需要进行轮播展示的流式布局项目或者格栅布局项目。
格栅布局是由行和列组成，使用<div class＝“row”>标记表示一行，其下紧跟一个或者若干个<div class＝“col-md-X”>形式的项目，用以标记一列。在一个row中，每一个<div class＝“col-md-X”>项目代表一列，X的数字为该列的宽度比例。
基本组件可以包含在流式布局或格栅布局中，包括文本、图片、按钮、输入框等。
通过流式布局、轮播布局、格栅布局以及包含在其中的文本、图片、按钮、输入框等各种基本组件的有机结合，用户便可以使用本发明实施例定义的模板语言，编写出任意形式排版的移动终端页面。
当服务器上部署了页面描述文件后，移动终端便可以通过HTTP协议从服务器下载页面描述文件。
步骤102，从所述页面描述文件中提取属性标签，并按照所述移动终端的当前操作系统将所述属性标签映射为对应的页面对象；
属性标签标识了页面描述文件中各段代码的含义。
在本发明实施例中，在获取了页面描述文件后，可以从页面描述文件中提取属性标签，根据移动终端当前操作系统的不同，可以将属性标签映射为iOS系统或安卓系统对应的页面对象。
步骤103，按特定数据结构保存所述页面对象；
数据结构是计算机存储、组织数据的方式；是指相互之间存在一种或多种特定关系的数据元素的集合。
在本发明实施例中，可以使用特定的数据结构保存页面对象。
步骤104，按所述特定数据结构渲染所述页面对象。
在得到保存了页面对象的特定数据结构后，可以按照该特定数据结构渲染页面对象。
在本发明实施例中，移动终端从服务器中提取页面描述文件；再从页面描述文件中提取属性标签，并按当前操作系统将属性标签映射为对应的页面对象；接着按特定数据结构保存页面对象，最后按该特定数据结构渲染页面对象。在本发明实施例中，不同的操作系统可以通过从服务器获取相同的页面描述文件，来渲染得到相同的页面，从而无需根据操作系统的不同来编写多套代码，实现页面描述文件的跨平台使用。此外，通过在服务器上部署按预定义规则生成的页面描述文件的方式，使得移动终端可以实时获取页面描述文件的更新信息，实现页面的动态更新。
参照图2，示出了本发明的一种页面渲染方法的另一种实施例的步骤流程图，具体可以包括如下步骤：
步骤201，当打开一个页面时，所述移动终端获取与所述页面描述文件对应的统一资源定位符；
统一资源定位符(Uniform Resource Locator，URL)，是对可以从互联网上得到的资源的位置和访问方法的一种简洁的表示，是互联网上标准资源的地址。互联网上的每个文件都有一个唯一的URL，它包含的信息指出文件的位置以及应该怎么处理它。
当用户打开一个页面时，部署在移动终端上，适用于移动终端上的操作系统的解析引擎，将接收到一个页面描述文件URL。该URL可用于获取对应的页面描述文件。
步骤202，从所述服务器中提取与所述统一资源定位符对应的页面描述文件；
在获取到统一资源定位符RUL后，可以通过HTTP协议，从服务器上指定的URL下载页面描述文件。
在一个示例中，在获取到统一资源定位符后，解析引擎还可以先在移动终端本地缓存的文件中，查找是否有已经缓存过的页面描述文件，如果已缓存过对应的页面描述文件，则可以调用已缓存的页面描述文件。
步骤203，从所述页面描述文件中提取属性标签，并按照当前操作系统将所述属性标签映射为对应的页面对象；
在本发明实施例中，在获取了页面描述文件后，可以从页面描述文件中提取属性标签，根据移动终端当前操作系统的不同，可以将属性标签映射为iOS系统或安卓系统对应的页面对象。
在本发明实施例中，所述页面描述文件包括页面布局文件；所述属性标签包括布局项标签；所述页面对象包括布局项对象；步骤203可以包括以下子步骤：
子步骤S11，从所述页面布局文件中提取所述布局项标签；
在本发明实施例中，可以从页面布局文件中提取布局项标签。
子步骤S12，解析所述布局项标签，并按照当前操作系统将所述布局项标签映射为对应的布局项对象。
在获取到布局项标签后，可以对所得到的布局项标签进行解析，并根据操作系统的不同将布局项标签映射为对应的布局项对象。
在本发明实施例中，所述属性标签还包括页脚标签；所述页面对象还包括页脚对象；步骤203还可以包括以下子步骤：
子步骤S13，从所述页面布局文件中提取页脚标签；
在本发明实施例中，可以从页面布局文件中提取页脚标签。
子步骤S14，解析所述页脚标签，并按照当前操作系统将所述页脚标签映射为对应的页脚对象。
在获取到页脚标签后，可以对所得到的页脚标签进行解析，并根据操作系统的不同将页脚标签映射为对应的页脚对象。
所述页面描述文件还包括页面样式文件；所述属性标签还包括页面样式标签；所述页面对象还包括页面样式对象，步骤203还可以包括以下子步骤：
子步骤S15，从所述页面样式文件中提取页面样式标签；
在本发明实施例中，可以从页面布局文件中提取页面样式标签。
子步骤S16，解析所述页面样式标签，并按照当前操作系统将所述页面样式标签映射为对应的页面样式对象。
在获取到页面样式标签后，可以对所得到的页面样式标签进行解析，并根据操作系统的不同将页面样式标签映射为对应的页面样式对象。
步骤204，按特定数据结构保存所述页面对象；
数据结构是计算机存储、组织数据的方式；是指相互之间存在一种或多种特定关系的数据元素的集合。
在本发明实施例中，可以使用特定的数据结构保存页面对象。
在本发明实施例中，特定数据结构可以包括布局树形数据结构，页脚树形数据结构和字典数据结构。根据页面对象的不同，可以将不同的页面对象保存在不同的数据结构中。例如，将布局项对象保存在布局树形数据结构中；将页脚对象保存在页脚树形数据结构中；将页面样式对象保存在字典数据结构中。
其中，树形数据结构是一类非线性数据结构，用来模拟具有树状结构性质的数据集合。它是由n(n>0)个有限节点(每个节点有零个或多个子节点)组成一个具有层次关系的集合。树形数据结构中，每一个元素均为一个对象，对象中映射了相应XML元素中的所有属性。
其中，字典数据结构是一种以“键-值对”形式存储数据的数据结构，通过“键”可以去获取对应的“值”。
在本发明实施例中，所述布局树形数据结构具有布局节点，每个布局节点包括布局子节点；所述布局项对象具有对应的基本组件对象；所述按布局树形数据结构保存布局项对象，可以包括以下子步骤：
子步骤S21，将每个布局项对象，分别保存为所述布局树形数据结构中的一个布局节点；
每个布局树形数据结构从层次上看具有同层级的布局节点和从属于布局节点的布局子节点，在本发明实施例中，可以将每个布局项对象保存为布局树形数据结构的一个布局节点。
子步骤S22，将每个布局项对象对应的基本组件对象，分别保存为所述布局项对象对应的布局节点下的一个布局子节点。
在部署好布局树形数据结构的布局节点后，可以将每个布局项对象下包含的基本组件对象，保存为从属于保存有布局项对象的布局节点下的一个布局子节点。
在本发明实施例中，所述页脚树形数据结构具有页脚节点，每个页脚节点包括页脚子节点；所述页脚对象具有对应的基本组件对象；所述按页脚树形数据结构保存所述页脚对象，可以包括以下子步骤：
子步骤S31，将每个页脚对象，分别保存为所述页脚树形数据结构中的一个页脚节点；
参照布局树形数据结构可以构建页脚树形数据结构，每个页脚树形数据结构从层次上看具有同层级的页脚节点和从属于页脚节点的页脚子节点，在本发明实施例中，可以将每个页脚对象保存为布局树形数据结构的一个页脚节点。
子步骤S32，将每个页脚对象对应的基本组件对象，分别保存为所述页脚对象对应的页脚节点下的一个页脚子节点。
在部署好页脚树形数据结构的页脚节点后，可以将每个页脚对象下包含的基本组件对象，保存为从属于保存有页脚对象的页脚节点下的一个页脚子节点。
在本发明实施例中，对于使用形如<link href＝“/assets/native/style.css”rel＝“stylesheet”></link>描述的资源文件，其中，包含页面上的颜色、文字大小、位置、尺寸相关的样式描述，下载完成后，将其作为样式表解析。将解析结果保存在字典数据结构中。所述按字典数据结构保存所述页面样式对象，可以包括以下子步骤：
子步骤S41，获取所述页面样式对象与对应的样式之间的关联关系；
在本发明实施例中，可以从页面样式对象的属性中获取对应的样式，建立页面样式对象与样式之间的关联关系。
子步骤S42，将所述关联关系保存在字典数据结构中。
将页面样式对象与样式之间的关联关系以“键-值对”的形式保存在字典数据结构中，以便于通过字典数据结构中“键”，获取保存在样式表中的对应的样式。例如，通过页面样式对象的class属性中的title、content的名称，和样式表中的“.title”、“.content”的字典“键”关联，使得通过“键”即可从样式表中获取到对应的样式。
此外，在本发明实施例中，页面描述文件还包含有导航项，解析引擎拿到一个页面描述文件后，可以将其作为一个XML文件进行解析。
首先查找html->head下的外部资源(script与link)元素，如果存在外部资源，则另开启一个线程下载外部资源。
然后查找html->body->div[class＝“head”]->div[class＝“title”]元素，将其中的内容，作为页面导航条标题。
步骤205，按所述特定数据结构渲染所述页面对象。
在得到保存了页面对象的特定数据结构后，可以按照该特定数据结构渲染页面对象。
在本发明实施例中，步骤205可以包括以下子步骤：
子步骤S51，当所述特定数据结构为树形数据结构时，循环获取所述树形数据结构顶层的所述页面对象；
在本发明实施例中，在对树形数据结构进行渲染时，移动终端中的渲染引擎循环获取布局树中的所有顶层对象，包括流式布局对象(DetailItem)、轮播布局对象(PagingItem)、格栅布局对象(RowItem)。
子步骤S52，确定所述页面对象的布局形式；
在获取到顶层页面对象后，可以确定所获取的页面对象的布局形式是流式布局，还是轮播布局，还是格栅布局。
子步骤S53，按照所述布局形式渲染所述页面对象。
在确定了布局形式后，便可以根据布局形式，将每个顶层的页面对象作为一个独立的View进行渲染，然后作为列表视图的一行，添加到页面上。
在一个示例中，当所述操作系统为iOS系统时，所述页面为表格数据展示视图UITableView，所述UITableView具有多个内容单元Cell；所述按照所述布局形式渲染所述页面对象，可以包括：
按照所述布局形式，将每一个顶层的页面对象分别渲染为所述UITableView中的一个Cell。
在iOS系统中，整个页面是一个UITableView，树形数据结构中第一层的每一个DetailItem、PagingItem、RowItem，作为UITableView的一个Cell。
在一个示例中，当所述操作系统为安卓系统时，所述页面为列表视图ListView；所述ListView具有多个列表条目Item；所述按照所述布局形式渲染所述页面对象，包括：
按照所述布局形式，将每一个顶层页面对象分别渲染为所述ListView中的一个Item。
在安卓系统中，整个页面是一个ListView，树形数据结构中的每一层的每一个DetailItem、PagingItem、RowItem，作为ListViewAdapter中一个Item对应的View。
由上述示例可知，无论是iOS系统还是安卓系统，均使用列表视图渲染页面，而列表视图中的一行，即是树形数据结构中的一个顶层元素(DetailItem、PagingItem、RowItem)，对应到页面描述文件来说，列表图中的一行，即是<ul class＝“list”>下的一个顶层标签。
在本发明实施例中，所述按照所述布局形式渲染所述页面对象，包括：
当所述布局形式为流式布局时，将所述顶层页面对象对应的基本组件对象，按照预设顺序渲染至所述页面中。
流式布局的DetailItem对象，作为一个包含各种组件的容器，使用一个基础View渲染，各系统对应关系如下：
Figure BDA0002299384720000171
渲染引擎循环读取流式布局中的每一个顶层对象，从上到下依次使用原生组件添加到布局的View中。
在添加了顶层对象之后，再将每个顶层对象下的基本组件对象渲染到页面中，具体渲染方法如下：
Figure BDA0002299384720000172
Figure BDA0002299384720000181
参照图3a，示出了本发明实施例的一种流式布局渲染页面示意图。
如图3a所示，“第一行文字”，“第二行文字”，“第三行文字”即是以流式布局的形式渲染至页面中的。
在本发明实施例中，所述按照所述布局形式渲染所述页面对象，可以包括：
子步骤S61，当所述布局形式为轮播布局时，在所述页面中绘制轮播组件；
在本发明实施例中，当布局形式为轮播布局时，首先需要在页面中绘制轮播组件。
子步骤S62，确定多个顶层页面对象的子布局形式；所述子布局形式包括流式布局或格栅布局；
轮播组件可以轮播不同的顶层页面对象，轮播方式主要可以包括通过流式布局由上到下轮播页面对象，以及通过格栅布局左右轮播页面对象。因此，在绘制后轮播组件后，需要确定需要进行轮播的多个顶层页面对象的子布局形式。
子步骤S63，在所述轮播组件中，将多个所述顶层页面对象按照所述流式布局，或，所述格栅布局渲染至所述页面中。
在确定了多个顶层页面对象的子布局形式后，可以将多个顶层页面对象按照流式布局或者格栅布局的形式渲染至页面中。
在实际应用中，轮播布局的PagingItem，使用可以横向滚动的View渲染，对应关系如下：
Figure BDA0002299384720000182
Figure BDA0002299384720000191
轮播布局中所包含的子项目，作为一个独立的流式或者格栅布局渲染。
参照图3b，示出了本发明实施例的一种轮播布局渲染页面示意图。
如图所示，“第四行文字”，“第五行文字”，“第六行文字”以流式布局的形式渲染在页面中，“图片A”与左侧的文字以格栅布局的形式呈现。
在本发明实施例中，所述按照所述布局形式渲染所述页面对象，可以包括以下子步骤：
子步骤S71，当所述布局形式为格栅布局时，计算每个所述页面对象的列宽；
格栅布局中，每一个页面对象都具有相应的列宽，而每一个页面对象的列宽，可以由整个屏幕的宽度，以及class＝“col-md-X”中的X计算而来，具体的计算过程可以为，将整个屏幕的宽度分为12等分，X的数字代表该列占了其中的几份。
子步骤S72，将每个所述顶层页面对象以对应的列宽渲染至所述页面中，并将每个所述页面对象对应的基本组件对象，按照预设顺序渲染至所述页面中。
在确定了每个顶层页面对象的列宽后，便可以将每个所述页面对象以对应的列宽渲染至页面中。
此外，列对象中包含的基本组件对象，可以使用流式布局的方式进行渲染，即每一个列对象可以对应一个小的流式布局。
流式布局中基本组件对象的渲染方式可以参照以下示例：
Figure BDA0002299384720000192
Figure BDA0002299384720000201
在实际应用中，格栅布局RowItem，作为一个外层容器，使用一个基础View渲染，RowItem中包含列对象ColumnItem，每一个列对象使用一个独立的View渲染。
参照图3c，示出了本发明实施例的一种格栅布局渲染页面示意图。
如图所示，将页面列宽划分为12等分，图标1、图标2、图标3以不同的3、4、3的列宽排列。左右两侧各预留1份的空白。
此外，通过配置基本组件对象的属性，可以控制渲染时的位置、尺寸、颜色等视觉效果。
其中，基本组件对象可以包括文本标签、图片、复选框、文本输入框、按钮等。以下分别是各个基本组件对象的渲染方法和对应的属性列表：
基本组件对象渲染-文本标签：
Figure BDA0002299384720000202
Figure BDA0002299384720000211
属性列表：
data-color 颜色 #ff0000
data-align 对齐方式 center left right
data-size 文字大小单位pt 18
data-marginBottom 底部外边距 10
data-marginTop 顶外边距 10
data-paddingLeft 左内边距 10
data-paddingRight 右内边距 10
data-background 背景颜色RGB #ff0000
data-borderColor 边框颜色RGB #ff0000
data-radius 边框圆角半径 3
data-relativeWidth 相对宽度 90％
data-height 高度单位pt 30
data-width 宽度单位pt 120
data-bold 加粗 bold
基本组件对象渲染-图片
Figure BDA0002299384720000212
Figure BDA0002299384720000221
属性列表：
data-align 对齐方式 center left right
data-marginBottom 底部外边距 10
data-marginTop 顶外边距 10
data-height 高度单位pt 30
data-width 宽度单位pt 120
data-paddingLeft 左内边距 10
data-paddingRight 右内边距 10
data-relativeWidth 相对宽度 90％
src 图片地址
基本组件对象渲染-复选框
Figure BDA0002299384720000222
属性列表：
Figure BDA0002299384720000223
Figure BDA0002299384720000231
基本组件对象渲染-文本输入框
Figure BDA0002299384720000232
属性列表：
Figure BDA0002299384720000233
Figure BDA0002299384720000241
基本组件渲染-按钮
组件 模版描述 映射对象 iOS渲染组件 安卓渲染组件
按钮 <button> ButtonElement UIButton Button
属性列表：
data-color 颜色 #ff0000
data-align 对齐方式 center left right
data-size 文字大小单位pt 18
data-marginBottom 底部外边距 10
data-marginTop 顶外边距 10
data-paddingLeft 左内边距 10
data-paddingRight 右内边距 10
data-background 背景颜色RGB #ff0000
data-borderColor 边框颜色RGB #ff0000
data-radius 边框圆角半径 3
data-relativeWidth 相对宽度 90％
data-height 高度单位pt 30
data-width 宽度单位pt 120
data-bold 加粗 bold
在本发明实施例中，所述按所述特定数据结构渲染所述页面对象，可以包括：
子步骤S81，当所述特定数据结构为字典数据结构时，在所述字典数据结构中，查找所述页面样式对象对应的样式；
字典数据结构中存储了页面样式对象与对应的样式之间的关联关系，当要通过字典数据结构对页面样式对象进行渲染时，可以在字典数据结构中查找页面样式对象对应的样式。
子步骤S82，采用所述样式渲染所述页面样式对象。
在获取到页面样式对象对应的样式后，可以采用该样式渲染页面样式对象。
在本发明实施例中，移动终端从服务器中提取页面描述文件；再从页面描述文件中提取属性标签，并按当前操作系统将属性标签映射为对应的页面对象；接着按特定数据结构保存页面对象，并按该特定数据结构渲染页面对象。在本发明实施例中，不同的操作系统可以通过从服务器获取相同的页面描述文件，来渲染得到相同的页面，从而无需根据操作系统的不同而编写多套代码，实现页面描述文件的跨平台使用。此外，通过在服务器上部署按预定义规则生成的页面描述文件，使得移动终端可以实时获取页面描述文件的更新信息，实现页面的动态更新。
需要说明的是，对于方法实施例，为了简单描述，故将其都表述为一系列的动作组合，但是本领域技术人员应该知悉，本发明实施例并不受所描述的动作顺序的限制，因为依据本发明实施例，某些步骤可以采用其他顺序或者同时进行。其次，本领域技术人员也应该知悉，说明书中所描述的实施例均属于优选实施例，所涉及的动作并不一定是本发明实施例所必须的。
参照图4，示出了本发明的一种页面渲染装置实施例的结构框图，具体可以包括如下模块：
页面描述文件提取模块401，用于从所述服务器中提取页面描述文件；
页面对象映射模块402，用于从所述页面描述文件中提取属性标签，并按照所述移动终端的当前操作系统将所述属性标签映射为对应的页面对象；
页面对象保存模块403，用于按特定数据结构保存所述页面对象；
页面对象渲染模块404，用于按所述特定数据结构渲染所述页面对象。
在本发明实施例中，所述页面描述文件提取模块，包括：
统一资源定位符获取子模块，用于当打开一个页面时，所述移动终端获取与所述页面描述文件对应的统一资源定位符；
页面描述文件提取子模块，用于从所述服务器中提取与所述统一资源定位符对应的页面描述文件。
在本发明实施例中，所述页面描述文件包括页面布局文件；所述属性标签包括布局项标签；所述页面对象包括布局项对象；所述页面对象映射模块，包括：
布局项标签提取子模块，用于从所述页面布局文件中提取所述布局项标签；
布局项对象映射子模块，用于解析所述布局项标签，并按照当前操作系统将所述布局项标签映射为对应的布局项对象。
在本发明实施例中，所述属性标签还包括页脚标签；所述页面对象还包括页脚对象；所述页面对象映射模块，还包括：
页脚标签提取子模块，用于从所述页面布局文件中提取页脚标签；
页脚对象映射子模块，用于解析所述页脚标签，并按照当前操作系统将所述页脚标签映射为对应的页脚对象。
在本发明实施例中，所述页面描述文件还包括页面样式文件；所述属性标签还包括页面样式标签；所述页面对象还包括页面样式对象，所述页面对象映射模块，包括：
页面样式标签提取子模块，用于从所述页面样式文件中提取页面样式标签；
页面样式对象映射子模块，用于解析所述页面样式标签，并按照当前操作系统将所述页面样式标签映射为对应的页面样式对象。
在本发明实施例中，所述特定数据结构包括布局树形数据结构；所述页面对象保存模块，包括：
布局项对象保存子模块，用于按布局树形数据结构保存所述布局项对象。
在本发明实施例中，所述特定数据结构还包括页脚树形数据结构；所述页面对象保存模块，还包括：
页脚对象保存子模块，用于按页脚树形数据结构保存所述页脚对象。
在本发明实施例中，所述特定数据结构还包括字典数据结构；所述页面对象保存模块，还包括：
页面样式保存子模块，用于按字典数据结构保存所述页面样式对象。
在本发明实施例中，所述布局树形数据结构具有布局节点，每个布局节点包括布局子节点；所述布局项对象具有对应的基本组件对象；所述布局项对象保存模块，包括：
布局节点保存单元，用于将每个布局项对象，分别保存为所述布局树形数据结构中的一个布局节点；
布局子节点保存单元，用于将每个布局项对象对应的基本组件对象，分别保存为所述布局项对象对应的布局节点下的一个布局子节点。
在本发明实施例中，所述页脚树形数据结构具有页脚节点，每个页脚节点包括页脚子节点；所述页脚对象具有对应的基本组件对象；所述页脚对象保存子模块，包括：
页脚节点保存单元，用于将每个页脚对象，分别保存为所述页脚树形数据结构中的一个页脚节点；
页脚子节点保存单元，用于将每个页脚对象对应的基本组件对象，分别保存为所述页脚对象对应的页脚节点下的一个页脚子节点。
在本发明实施例中，所述页面样式对象具有样式名称，所述页面样式对象保存子模块，包括：
关联关系获取单元，用于获取所述页面样式对象与对应的样式之间的关联关系；
关联关系保存单元，用于将所述关联关系保存在字典数据结构中。
在本发明实施例中，所述页面对象渲染模块，包括：
顶层页面对象获取子模块，用于当所述特定数据结构为树形数据结构时，循环获取所述树形数据结构顶层的页面对象；
布局形式确定子模块，用于确定所述页面对象的布局形式；
页面对象渲染子模块，用于按照所述布局形式渲染所述页面对象。
在本发明实施例中，当所述当前操作系统为iOS系统时，所述页面为表格数据展示视图UITableView，所述UITableView具有多个内容单元Cell；所述页面对象渲染子模块，包括：
Cell渲染单元，用于按照所述布局形式，将每一个所述页面对象分别渲染为所述UITableView中的一个Cell。
在本发明实施例中，当所述当前操作系统为安卓系统时，所述页面为列表视图ListView；所述ListView具有多个列表条目Item；所述页面对象渲染子模块，包括：
Item渲染单元，用于按照所述布局形式，将每一个所述页面对象分别渲染为所述ListView中的一个Item。
在本发明实施例中，所述页面对象渲染子模块，包括：
第一顶层页面渲染单元，用于当所述布局形式为流式布局时，将所述页面对象对应的基本组件对象，按照预设顺序渲染至所述页面中。
在本发明实施例中，所述页面对象渲染子模块，包括：
轮播组件绘制单元，用于当所述布局形式为轮播布局时，在所述页面中绘制轮播组件；
子布局形式确定单元，用于确定多个所述页面对象的子布局形式；所述子布局形式包括流式布局或格栅布局；
第二顶层页面对象渲染单元，用于在所述轮播组件中，将多个所述页面对象按照所述流式布局，或，所述格栅布局渲染至所述页面中。
在本发明实施例中，所述页面对象渲染子模块，包括：
列宽计算单元，用于当所述布局形式为格栅布局时，计算每个所述页面对象的列宽；
第三顶层页面对象渲染单元，用于将每个所述页面对象以对应的列宽渲染至所述页面中，并将每个所述页面对象对应的基本组件对象，按照预设顺序渲染至所述页面中。
在本发明实施例中，所述页面对象渲染模块，包括：
样式查找子模块，用于当所述特定数据结构为字典数据结构时，在所述字典数据结构中，查找所述页面样式对象对应的样式；
页面样式对象渲染子模块，用于采用所述样式渲染所述页面样式对象。
对于装置实施例而言，由于其与方法实施例基本相似，所以描述的比较简单，相关之处参见方法实施例的部分说明即可。
本发明实施例还提供了一种电子设备，包括：
一个或多个处理器；和
其上存储有指令的一个或多个计算机存储介质，当由所述一个或多个处理器执行时，使得所述装置执行本发明实施例所述的方法。
本发明实施例还提供了一个或多个计算机存储介质，其上存储有指令，当由一个或多个处理器执行时，使得所述处理器执行本发明实施例所述的方法。
本说明书中的各个实施例均采用递进的方式描述，每个实施例重点说明的都是与其他实施例的不同之处，各个实施例之间相同相似的部分互相参见即可。
本领域内的技术人员应明白，本发明实施例的实施例可提供为方法、装置、或计算机程序产品。因此，本发明实施例可采用完全硬件实施例、完全软件实施例、或结合软件和硬件方面的实施例的形式。而且，本发明实施例可采用在一个或多个其中包含有计算机可用程序代码的计算机可用存储介质(包括但不限于磁盘存储器、CD-ROM、光学存储器等)上实施的计算机程序产品的形式。
本发明实施例是参照根据本发明实施例的方法、终端设备(系统)、和计算机程序产品的流程图和/或方框图来描述的。应理解可由计算机程序指令实现流程图和/或方框图中的每一流程和/或方框、以及流程图和/或方框图中的流程和/或方框的结合。可提供这些计算机程序指令到通用计算机、专用计算机、嵌入式处理机或其他可编程数据处理终端设备的处理器以产生一个机器，使得通过计算机或其他可编程数据处理终端设备的处理器执行的指令产生用于实现在流程图一个流程或多个流程和/或方框图一个方框或多个方框中指定的功能的装置。
这些计算机程序指令也可存储在能引导计算机或其他可编程数据处理终端设备以特定方式工作的计算机可读存储器中，使得存储在该计算机可读存储器中的指令产生包括指令装置的制造品，该指令装置实现在流程图一个流程或多个流程和/或方框图一个方框或多个方框中指定的功能。
这些计算机程序指令也可装载到计算机或其他可编程数据处理终端设备上，使得在计算机或其他可编程终端设备上执行一系列操作步骤以产生计算机实现的处理，从而在计算机或其他可编程终端设备上执行的指令提供用于实现在流程图一个流程或多个流程和/或方框图一个方框或多个方框中指定的功能的步骤。
尽管已描述了本发明实施例的优选实施例，但本领域内的技术人员一旦得知了基本创造性概念，则可对这些实施例做出另外的变更和修改。所以，所附权利要求意欲解释为包括优选实施例以及落入本发明实施例范围的所有变更和修改。
最后，还需要说明的是，在本文中，诸如第一和第二等之类的关系术语仅仅用来将一个实体或者操作与另一个实体或操作区分开来，而不一定要求或者暗示这些实体或操作之间存在任何这种实际的关系或者顺序。而且，术语“包括”、“包含”或者其任何其他变体意在涵盖非排他性的包含，从而使得包括一系列要素的过程、方法、物品或者终端设备不仅包括那些要素，而且还包括没有明确列出的其他要素，或者是还包括为这种过程、方法、物品或者终端设备所固有的要素。在没有更多限制的情况下，由语句“包括一个……”限定的要素，并不排除在包括所述要素的过程、方法、物品或者终端设备中还存在另外的相同要素。
以上对本发明所提供的一种页面渲染方法和一种页面渲染装置，进行了详细介绍，本文中应用了具体个例对本发明的原理及实施方式进行了阐述，以上实施例的说明只是用于帮助理解本发明的方法及其核心思想；同时，对于本领域的一般技术人员，依据本发明的思想，在具体实施方式及应用范围上均会有改变之处，综上所述，本说明书内容不应理解为对本发明的限制。

Claims (10)

1.一种页面渲染方法，其特征在于，应用于移动终端，所述方法包括：
从服务器中提取页面描述文件；
从所述页面描述文件中提取属性标签，并按照所述移动终端的当前操作系统将所述属性标签映射为对应的页面对象；
按特定数据结构保存所述页面对象；
按所述特定数据结构渲染所述页面对象。
2.根据权利要求1所述的方法，其特征在于，从所述服务器中提取所述页面描述文件，包括：
当打开一个页面时，所述移动终端获取与所述页面描述文件对应的统一资源定位符；
从所述服务器中提取与所述统一资源定位符对应的页面描述文件。
3.根据权利要求1或2所述的方法，其特征在于，所述特定数据结构包括树形数据结构，所述页面对象包括布局项对象，所述按特定数据结构保存所述页面对象，包括：
按所述树形数据结构保存所述布局项对象；
或者，所述特定数据结构包括字典数据结构，所述页面对象包括页面样式对象，所述按特定数据结构保存所述页面对象，包括：
按所述字典数据结构保存所述页面样式对象。
4.根据权利要求3所述的方法，其特征在于，所述按所述特定数据结构渲染所述页面对象，包括：
当所述特定数据结构为树形数据结构时，
循环获取所述树形数据结构顶层的所述页面对象；
确定所述页面对象的布局形式；
按照所述布局形式渲染所述页面对象。
5.根据权利要求4所述的方法，其特征在于，当所述当前操作系统为iOS系统时，所述页面为表格数据展示视图，所述表格数据展示视图具有多个内容单元；所述按照所述布局形式渲染所述页面对象，包括：
按照所述布局形式，将每一个所述页面对象分别渲染为所述表格数据展示视图中的一个内容单元；
或者，当所述当前操作系统为安卓系统时，所述页面为列表视图；所述列表视图具有多个列表条目；所述按照所述布局形式渲染所述页面对象，包括：
按照所述布局形式，将每一个所述页面对象分别渲染为所述列表视图中的一个列表条目。
6.根据权利要求4所述的方法，其特征在于，所述按照所述布局形式渲染所述页面对象，包括：
当所述布局形式为流式布局时，将所述页面对象对应的基本组件对象，按照预设顺序渲染至所述页面中；
当所述布局形式为轮播布局时，在所述页面中绘制轮播组件，确定多个所述页面对象的子布局形式，所述子布局形式包括流式布局或格栅布局，并在所述轮播组件中，将多个所述页面对象按照所述流式布局，或，所述格栅布局渲染至所述页面中；
当所述布局形式为格栅布局时，计算每个所述页面对象的列宽，将每个所述页面对象以对应的列宽渲染至所述页面中，并将每个所述页面对象对应的基本组件对象，按照预设顺序渲染至所述页面中。
7.根据权利要求3所述的方法，其特征在于，所述按所述特定数据结构渲染所述页面对象，包括：
当所述特定数据结构为字典数据结构时，
在所述字典数据结构中，查找所述页面样式对象对应的样式；
采用所述样式渲染所述页面样式对象。
8.一种页面渲染装置，其特征在于，应用于移动终端，所述装置包括：
页面描述文件提取模块，用于从所述服务器中提取页面描述文件；
页面对象映射模块，用于从所述页面描述文件中提取属性标签，并按照所述移动终端的当前操作系统将所述属性标签映射为对应的页面对象；
页面对象保存模块，用于按特定数据结构保存所述页面对象；
页面对象渲染模块，用于按所述特定数据结构渲染所述页面对象。
9.一种电子设备，其特征在于，包括：
一个或多个处理器；和
其上存储有指令的一个或多个计算机存储介质，当由所述一个或多个处理器执行时，使得所述装置执行如权利要求1-7所述的一个或多个的方法。
10.一个或多个计算机存储介质，其上存储有指令，当由一个或多个处理器执行时，使得所述处理器执行如权利要求1-7所述的一个或多个的方法。
CN201911215498.2A 2019-12-02 2019-12-02 页面渲染方法、装置、电子设备和存储介质 Active CN111258577B (zh)

Priority Applications (1)

Application Number Priority Date Filing Date Title
CN201911215498.2A CN111258577B (zh) 2019-12-02 2019-12-02 页面渲染方法、装置、电子设备和存储介质

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
CN201911215498.2A CN111258577B (zh) 2019-12-02 2019-12-02 页面渲染方法、装置、电子设备和存储介质

Publications (2)

Publication Number Publication Date
CN111258577A true CN111258577A (zh) 2020-06-09
CN111258577B CN111258577B (zh) 2024-06-21

Family

ID=70946726

Family Applications (1)

Application Number Title Priority Date Filing Date
CN201911215498.2A Active CN111258577B (zh) 2019-12-02 2019-12-02 页面渲染方法、装置、电子设备和存储介质

Country Status (1)

Country Link
CN (1) CN111258577B (zh)

Cited By (4)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN112114805A (zh) * 2020-08-27 2020-12-22 长沙市到家悠享网络科技有限公司 页面生成方法、装置、设备
CN113031946A (zh) * 2021-02-24 2021-06-25 北京沃东天骏信息技术有限公司 一种渲染页面组件的方法和装置
CN117075992A (zh) * 2023-08-09 2023-11-17 北京网聘信息技术有限公司 AppList组件库设计方法和装置
CN117093218A (zh) * 2023-10-19 2023-11-21 浪潮通用软件有限公司 一种基于界面描述的前端界面渲染方法、设备及介质

Citations (10)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US20110023017A1 (en) * 2008-04-28 2011-01-27 Salesforce.Com, Inc. Object-oriented system for creating and managing websites and their content
US20120110437A1 (en) * 2010-10-28 2012-05-03 Microsoft Corporation Style and layout caching of web content
CN102779164A (zh) * 2012-06-20 2012-11-14 深圳市远行科技有限公司 一种业务系统及其动态页面的渲染方法
CN105630902A (zh) * 2015-12-21 2016-06-01 明博教育科技股份有限公司 一种渲染和增量更新网页的方法
CN106569824A (zh) * 2016-11-07 2017-04-19 腾讯科技（深圳）有限公司 页面数据编译的方法和装置、页面渲染的方法和装置
CN107678736A (zh) * 2017-10-09 2018-02-09 用友网络科技股份有限公司 一种业务页面模板的展现方法、系统及计算机装置
CN109101300A (zh) * 2018-06-14 2018-12-28 腾讯科技（深圳）有限公司 一种页面渲染方法、装置及终端
CN109683978A (zh) * 2017-10-17 2019-04-26 阿里巴巴集团控股有限公司 一种流式布局界面渲染的方法、装置以及电子设备
CN109684580A (zh) * 2017-10-18 2019-04-26 中移(苏州)软件技术有限公司 一种动态页面的展示方法及电子设备
CN110221871A (zh) * 2019-04-22 2019-09-10 腾讯科技（深圳）有限公司 网页获取方法、装置、计算机设备及存储介质

Patent Citations (10)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US20110023017A1 (en) * 2008-04-28 2011-01-27 Salesforce.Com, Inc. Object-oriented system for creating and managing websites and their content
US20120110437A1 (en) * 2010-10-28 2012-05-03 Microsoft Corporation Style and layout caching of web content
CN102779164A (zh) * 2012-06-20 2012-11-14 深圳市远行科技有限公司 一种业务系统及其动态页面的渲染方法
CN105630902A (zh) * 2015-12-21 2016-06-01 明博教育科技股份有限公司 一种渲染和增量更新网页的方法
CN106569824A (zh) * 2016-11-07 2017-04-19 腾讯科技（深圳）有限公司 页面数据编译的方法和装置、页面渲染的方法和装置
CN107678736A (zh) * 2017-10-09 2018-02-09 用友网络科技股份有限公司 一种业务页面模板的展现方法、系统及计算机装置
CN109683978A (zh) * 2017-10-17 2019-04-26 阿里巴巴集团控股有限公司 一种流式布局界面渲染的方法、装置以及电子设备
CN109684580A (zh) * 2017-10-18 2019-04-26 中移(苏州)软件技术有限公司 一种动态页面的展示方法及电子设备
CN109101300A (zh) * 2018-06-14 2018-12-28 腾讯科技（深圳）有限公司 一种页面渲染方法、装置及终端
CN110221871A (zh) * 2019-04-22 2019-09-10 腾讯科技（深圳）有限公司 网页获取方法、装置、计算机设备及存储介质

Non-Patent Citations (1)

* Cited by examiner, † Cited by third party
Title
薛联凤: "《信息技术教程》", 30 September 2017, pages: 140 *

Cited By (6)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN112114805A (zh) * 2020-08-27 2020-12-22 长沙市到家悠享网络科技有限公司 页面生成方法、装置、设备
CN113031946A (zh) * 2021-02-24 2021-06-25 北京沃东天骏信息技术有限公司 一种渲染页面组件的方法和装置
CN113031946B (zh) * 2021-02-24 2024-04-05 北京沃东天骏信息技术有限公司 一种渲染页面组件的方法和装置
CN117075992A (zh) * 2023-08-09 2023-11-17 北京网聘信息技术有限公司 AppList组件库设计方法和装置
CN117093218A (zh) * 2023-10-19 2023-11-21 浪潮通用软件有限公司 一种基于界面描述的前端界面渲染方法、设备及介质
CN117093218B (zh) * 2023-10-19 2024-01-26 浪潮通用软件有限公司 一种基于界面描述的前端界面渲染方法、设备及介质

Also Published As

Publication number Publication date
CN111258577B (zh) 2024-06-21

Similar Documents

Publication Publication Date Title
CN111258577B (zh) 页面渲染方法、装置、电子设备和存储介质
US9857959B2 (en) Supporting webpage design and revision irrespective of webpage framework
US8365203B2 (en) Method for creating a native application for mobile communications device in real-time
CN101025738B (zh) 一种免模板动态网站生成方法
CN104881275B (zh) 一种电子报表生成方法及装置
CN103309806B (zh) 一种快速开发测试的装置及方法
CN104820589B (zh) 一种动态适配网页的方法及其装置
US9646004B2 (en) Hierarchical database report generation with automated query generation for placeholders
CN106503212A (zh) 一种网页元素样式的设置方法及装置
US10002117B1 (en) Translating annotation tags into suggested markup
US10489024B2 (en) UI rendering based on adaptive label text infrastructure
CN111382192B (zh) 一种数据列表展示方法、装置和电子设备
CN109460546A (zh) 表单生成方法、装置及电子设备
CN107122187A (zh) 一种业务系统异构操作系统访问设计方法
CN106294504A (zh) 一种网页图标的显示方法和装置
CN111831384A (zh) 语言切换方法和装置、设备及存储介质
CN112417338A (zh) 一种页面适配方法、系统及设备
CN113656000B (zh) 网页的处理方法和装置
CN116009863B (zh) 前端页面渲染方法、设备及存储介质
JP2007115276A (ja) コンテンツデータ生成処理プログラムおよびコンテンツデータ生成処理プログラム記録媒体
JP2003223390A (ja) データ抽出・構造変換処理プログラム、コンテンツ生成処理プログラム、データ抽出・構造変換処理プログラム記録媒体、コンテンツ生成処理プログラム記録媒体、およびコンテンツ再構築処理システム
CN115169292A (zh) 文档处理方法、装置、电子设备及计算机可读存储介质
CN102637290A (zh) 一种基于浏览器的作业系统及编辑方法
CN106484759B (zh) 交互式电子白板存储文件的解析方法和装置
US11921797B2 (en) Computer service for indexing threaded comments with pagination support

Legal Events

Date Code Title Description
PB01 Publication
PB01 Publication
SE01 Entry into force of request for substantive examination
SE01 Entry into force of request for substantive examination
GR01 Patent grant
GR01 Patent grant