页面生成方法和装置制造方法及图纸

本发明专利技术涉及一种页面生成方法和装置，该页面生成方法包括：获取页面结构代码和相应的页面样式代码；根据所述页面结构代码，从公共组件库中选择公共组件；根据所述页面样式代码，获取所述公共组件的像素级尺寸相对于显示屏像素级尺寸的相对尺寸；根据所述相对尺寸和当前的显示屏像素级尺寸，确定所述公共组件的像素级尺寸；按照所述公共组件的像素级尺寸绘制所述公共组件，形成页面。本发明专利技术提供的页面生成方法和装置，因采用了相对尺寸，可自适应调整公共组件的尺寸，在不同的显示屏上都可以显示出基本一致的效果，避免了因显示屏差异而导致的在呈现页面时的兼容性问题。

Method and device for generating page

The invention relates to a method and device for generating pages, including the page generation method: get the page structure code and the corresponding page style code; according to the structure of the page code, select the public public component from component library; according to the page style code, obtaining the public components of the pixel level size relative to the size of the display screen pixel size; according to the relative size and current display pixel size, determine the public components of the pixel size; according to the components of the pixel size of public rendering the public group, the formation of the page. The page generation method and device provided by the invention, due to the relative size, can adjust the size of the component of the public, in different display can show consistent results, avoid due to differences in the display page is rendered the compatibility problem.

【技术实现步骤摘要】
页面生成方法和装置
本专利技术涉及计算机
，特别是涉及一种页面生成方法和装置。
技术介绍
随着计算机技术的发展，出现了各种类型的终端，这些终端上可以运行应用程序，通过应用程序生成页面，从而通过该页面传递信息并与用户交互，方便了人们的生活和工作。目前，生成页面主要是在页面代码中定义页面元素在页面中以像素为单位的尺寸，从而按照预先定义的以像素为单位的尺寸绘制页面元素，形成页面。然而，当在不同的显示屏上采用相同的以像素为单位的尺寸绘制页面元素时，呈现的页面元素会因显示屏的不同而呈现出不同的效果，兼容性差。
技术实现思路
基于此，有必要针对目前在不同的显示屏上采用相同的以像素为单位的尺寸绘制页面元素兼容性差的问题，提供一种页面生成方法和装置。一种页面生成方法，包括：获取页面结构代码和相应的页面样式代码；根据所述页面结构代码，从公共组件库中选择公共组件；根据所述页面样式代码，获取所述公共组件的像素级尺寸相对于显示屏像素级尺寸的相对尺寸；根据所述相对尺寸和当前的显示屏像素级尺寸，确定所述公共组件的像素级尺寸；按照所述公共组件的像素级尺寸绘制所述公共组件，形成页面。一种页面生成装置，包括：代码获取模块，用于获取页面结构代码和相应的页面样式代码；公共组件选择模块，用于根据所述页面结构代码，从公共组件库中选择公共组件；像素级尺寸确定模块，用于根据所述页面样式代码，获取所述公共组件的像素级尺寸相对于显示屏像素级尺寸的相对尺寸；根据所述相对尺寸和当前的显示屏像素级尺寸，确定所述公共组件的像素级尺寸；绘制模块，用于按照所述公共组件的像素级尺寸绘制所述公共组件，形成页面。上述页面生成方法和装置，根据页面结构代码，可以直接从公共组件库中选择公共组件，而不必在页面结构代码中详细定义每个页面元素，节省页面结构代码的代码量，提高生成页面的效率。而且，根据页面样式代码，获取公共组件相对于显示屏像素级尺寸的相对尺寸，再利用相对尺寸和当前的显示屏像素级尺寸确定公共组件的像素级尺寸，进而据此绘制公共组件。因采用了相对尺寸，可自适应调整公共组件的尺寸，在不同的显示屏上都可以显示出基本一致的效果，避免了因显示屏差异而导致的在呈现页面时的兼容性问题。附图说明图1为一个实施例中页面生成方法的应用环境图；图2为一个实施例中终端的结构框图；图3为一个实施例中页面生成方法的流程示意图；图4为一个实施例中操作系统、母应用程序、子应用程序以及子应用程序的页面之间关系的示意图；图5为另一个实施例中页面生成方法的流程示意图；图6为一个实施例中页面生成装置的结构框图；图7为另一个实施例中页面生成装置的结构框图。具体实施方式为了使本专利技术的目的、技术方案及优点更加清楚明白，以下结合附图及实施例，对本专利技术进行进一步详细说明。应当理解，此处所描述的具体实施例仅仅用以解释本专利技术，并不用于限定本专利技术。图1为一个实施例中页面生成方法的应用环境图。参照图1，本实施例中该页面生成方法应用于一种应用程序管理系统中。该应用程序管理系统包括电子设备110、服务器120和终端130，且电子设备110和终端130均可通过网络连接到服务器120。电子设备110和终端130可以是相同类型或者不同类型的物理设备，如个人计算机或者移动终端等。服务器120可以是独立的物理服务器或者多个物理服务器构成的服务器集群。其中，电子设备110可用于编辑页面结构源代码、页面样式源代码和页面逻辑源代码，并将页面结构源代码、页面样式源代码和页面逻辑源代码发送至服务器120。服务器120将页面结构源代码、页面样式源代码和页面逻辑源代码分别编译，分别获得页面结构代码、页面样式代码和页面逻辑代码。终端130可从服务器120下载包括页面结构代码、页面样式代码和页面逻辑代码的程序包，从而根据程序包中的页面结构代码和页面样式代码生成页面。页面结构代码、页面样式代码和页面逻辑代码均可以是脚本代码，如JavaScript脚本代码。图2为一个实施例中终端130的结构框图。参照图2，该终端130包括通过系统总线连接的处理器、非易失性存储介质、内存储器、网络接口、显示屏和输入装置。其中，终端130的非易失性存储介质存储有操作系统，还存储有一种页面生成装置，该页面生成装置用于实现一种页面生成方法。终端130的处理器用于提供计算和控制能力，支撑整个终端130的运行。终端130中的内存储器为非易失性存储介质中的页面生成装置的运行提供环境。该内存储器中可存储有计算机可读指令，该计算机可读指令被处理器执行时，可使得处理器执行一种页面生成方法。终端130的网络接口用于与服务器进行网络通信，如从服务器下载页面结构代码和相应的页面样式代码等。终端130的显示屏可以是液晶显示屏或者电子墨水显示屏，终端130的输入装置可以是显示屏上覆盖的触摸层，也可以是终端130外壳上设置的按键、轨迹球或触控板，还可以是外接的键盘、触控板或鼠标等。该终端130可以是个人计算机或者移动终端，移动终端包括手机、平板电脑、个人数字助理或者穿戴式设备等中的至少一种。本领域技术人员可以理解，图2中示出的结构，仅仅是与本申请方案相关的部分结构的框图，并不构成对本申请方案所应用于其上的终端的限定，具体的终端可以包括比图中所示更多或更少的部件，或者组合某些部件，或者具有不同的部件布置。图3为一个实施例中页面生成方法的流程示意图。本实施例主要以该方法应用于上述图1中的终端130来举例说明。参照图3，该方法具体包括如下步骤：S302，获取页面结构代码和相应的页面样式代码。其中，页面结构代码是定义页面组成的代码。页面结构代码可包括页面所包括的公共组件的标识。页面样式代码是定义页面样式的代码。页面样式代码至少定义了下述步骤S304和步骤S306中所涉及的相对尺寸。页面样式代码还可以定义公共组件的颜色或背景图像等其它样式。页面结构代码和页面样式代码均对应于相同的页面。页面结构代码和相应的页面样式代码可以记录在不同或者相同的文件中。具体地，终端可从服务器下载程序包，从而从程序包中获取页面结构代码和相应的页面样式代码。终端也可以从本地直接获取页面结构代码和相应的页面样式代码。S304，根据页面结构代码，从公共组件库中选择公共组件。具体地，终端可执行页面结构代码，按照页面结构代码中定义的公共组件的标识，从公共组件库中选择与该标识对应的公共组件。公共组件库存储于终端本地，具体可在首次生成页面时从服务器下载到本地。选择的公共组件是页面结构代码中定义的在生成页面时所需的公共组件。其中，公共组件是不同应用程序的页面所共用的组件，具有视觉形态，是页面的组成单元。公共组件具有唯一的标识，可以是公共组件的名称。公共组件可以是图标、文本容器、进度条、表单组件、导航组件、媒体组件、地图组件或者画布组件。表单组件可以包括按钮、选择框、表单以及开关等。S306，根据页面样式代码，获取公共组件的像素级尺寸相对于显示屏像素级尺寸的相对尺寸。其中，像素级尺寸是指以像素为单位计量的尺寸。像素具体可以是逻辑像素或者物理像素。一个逻辑像素可以包括多于一个的物理像素，比如可以用4个物理像素表示一个逻辑像素。具体地，页面样式代码中，定义了与公共组件的标识对应的相对尺寸(可以用rpx表示相对尺寸的单位)，该相对尺寸表示了公共组件的像素本文档来自技高网...

【技术保护点】
一种页面生成方法，包括：获取页面结构代码和相应的页面样式代码；根据所述页面结构代码，从公共组件库中选择公共组件；根据所述页面样式代码，获取所述公共组件的像素级尺寸相对于显示屏像素级尺寸的相对尺寸；根据所述相对尺寸和当前的显示屏像素级尺寸，确定所述公共组件的像素级尺寸；按照所述公共组件的像素级尺寸绘制所述公共组件，形成页面。

【技术特征摘要】
1.一种页面生成方法，包括：获取页面结构代码和相应的页面样式代码；根据所述页面结构代码，从公共组件库中选择公共组件；根据所述页面样式代码，获取所述公共组件的像素级尺寸相对于显示屏像素级尺寸的相对尺寸；根据所述相对尺寸和当前的显示屏像素级尺寸，确定所述公共组件的像素级尺寸；按照所述公共组件的像素级尺寸绘制所述公共组件，形成页面。2.根据权利要求1所述的方法，其特征在于，所述相对尺寸为所述公共组件的像素级尺寸与显示屏像素级尺寸的比值再乘以预设值；所述根据所述相对尺寸和当前的显示屏像素级尺寸，确定所述公共组件的像素级尺寸包括：将所述相对尺寸乘以当前的显示屏像素级尺寸再除以所述预设值，得到所述公共组件的像素级尺寸。3.根据权利要求2所述的方法，其特征在于，所述显示屏像素级尺寸为以像素为单位的显示屏宽度或以像素为单位的显示屏高度。4.根据权利要求1所述的方法，其特征在于，所述根据所述相对尺寸和当前的显示屏像素级尺寸，确定所述公共组件的像素级尺寸之后，所述方法还包括：将所述页面结构代码转换为包括所述公共组件的像素级尺寸的标准样式格式数据；所述按照所述公共组件的像素级尺寸绘制所述公共组件，形成页面，包括：按照所述标准样式格式数据绘制所述公共组件，形成页面。5.根据权利要求4所述的方法，其特征在于，所述页面样式代码根据采用相对尺寸计量所述公共组件的尺寸的自定义样式格式数据生成。6.根据权利要求1所述的方法，其特征在于，所述按照所述公共组件的像素级尺寸绘制所述公共组件，形成页面之后，所述方法还包括：获取用于触发所述公共组件尺寸变化的事件；响应于所述事件，获取所述公共组件尺寸变化后相对于显示屏像素级尺寸的相对尺寸；根据变化后的所述相对尺寸和当前的显示屏像素级尺寸，确定所述变化后的公共组件的像素级尺寸；按照变化后的公共组件的像素级尺寸更新所述页面中的所述公共组件。7.根据权利要求1至6中任一项所述的方法，其特征在于，所述根据所述页面结构代码，从公共组件库中选择公共组件包括：通过子应用程序，并根据所述页面结构代码，从母应用程序所提供的公共组件库中选择公共组件；所述子应用程序运行于所述母应用程序所提供的环境中，且所述母应用程序运行于操作系统上。8.根据权利要求7所述的方法，其特征在于，所述按照所述公共组件的像素级尺寸绘制所述公共组件，形成页面包括：通过所述子应用程序，按照所述公共组件的像素级尺寸，绘制公共组件，形成属于所述子应用程序的页面。9.根据权利要求7所述的方法，其特征在于，所述按照所述公共组件的像素级尺寸绘制所述公共组件，形成页面包括：通过所述子应用程序，生成属于所述子应用程序的页面，并在所述页面中保留与所述公共组件的像素级尺寸匹配的空间；通过所...

【专利技术属性】
技术研发人员：胡浩，胡豪俊，林庆杰，林超，
申请(专利权)人：腾讯科技深圳有限公司，
类型：发明
国别省市：广东,44