CN104978756B - 一种嵌入互动组件的页面的无缝缩放方法及装置 - Google Patents

Abstract

本发明提供一种嵌入互动组件的页面的无缝缩放方法及装置，包括：根据页面的格式加载页面和嵌入互动组件，令所述嵌入互动组件和所述页面在视图层次结构中处于同一层级；根据页面的格式进行缩放，同时利用缩放时的空间变换矩阵对所述嵌入互动组件的基视图坐标系进行空间变换，实现页面和嵌入互动组件的同步无缝缩放。本发明可以利用缩放页面的空间变换矩阵对嵌入互动组件进行同步缩放，实现二者无缝缩放的技术效果，提高了用户体验，具有较高的实际应用价值。

Description

一种嵌入互动组件的页面的无缝缩放方法及装置

技术领域

本发明涉及数字技术领域，尤其涉及一种嵌入互动组件的页面的无缝缩放方法及装置。

背景技术

随着受众在移动终端上的阅读习惯逐渐形成，数字图书的阅读率正在不断上升。数字图书并非单纯将纸质内容照抄照搬到移动终端上，还可以添加一些经过精心设计和编辑的视频片段、更加丰富的美图、以及幻灯片等多种交互式组件的元素，这些都将提升数字图书的整体呈现品质，给读者带来沉浸式的阅读体验。

值得注意的是，数字图书的版式设计对阅读者的重要程度与日俱增。在排版上，尽量采取精细化排版，简约式处理的方法，这样用户在阅读时既可以与传统图书有所差异，又能一目了然。但是，在实际的数字内容制作时，出版社、报社、杂志社多是将纸质出版物所使用的排版文件（图片文件或者PDF文件）直接用作数字图书的版面呈现，进一步地，还期望能在其上添加一些互动元素，这样可以大幅度减少数字内容的制作成本。

目前市面上的移动阅读应用，基本上都不支持既可以嵌入互动组件，又同时无缝缩放页面的功能。比如在数字杂志市场占有率最高的VIVA应用，其主要是在不同的移动设备方向，分别呈现原版式的内容和互动内容，但是这样做，无疑使得编辑人员的工作量翻了一倍。还有进入数字图书领域比较早的天智通达阅读器，虽然支持原版式的缩放，但是并不支持在其上添加互动效果，这样对用户的阅读体验来说就比较枯燥了一些。因此，如何在有限的屏幕上清晰完整地展示印刷级别的版式文件，同时又能带来丰富的互动体验，达到页面的无缝缩放，成为了目前移动阅读应用共同需要面对的问题。

发明内容

（一）要解决的技术问题

本发明提供一种嵌入互动组件的页面的无缝缩放方法及装置，以解决现有技术中无法在页面上嵌入互动组件的同时实现无缝缩放的技术问题。

（二）技术方案

为解决上述技术问题，本发明提供一种嵌入互动组件的页面的无缝缩放方法，包括：

根据页面的格式加载页面和嵌入互动组件，令所述嵌入互动组件和所述页面在视图层次结构中处于同一层级；

根据页面的格式进行缩放，同时利用缩放时的空间变换矩阵对所述嵌入互动组件的基视图坐标系进行空间变换，实现页面和嵌入互动组件的同步无缝缩放。

进一步地，所述根据页面的格式加载页面包括：

当页面的格式为点阵描述格式时，直接将页面的图像点阵进行存储加载；

当页面的格式为矢量描述格式时，对页面进行解析和渲染，根据不同的显示分辨率生成页面内容。

进一步地，所述根据页面的格式进行缩放包括：

当页面的格式为点阵描述格式时，根据不同的缩放范围来加载不同尺寸的页面图像；

当页面的格式为矢量描述格式时，根据不同的缩放比来光栅化页面内容点阵，并分块进行页面内容的绘制。

进一步地，所述利用缩放时的空间变换矩阵对所述嵌入互动组件的基视图坐标系进行空间变换包括：

根据页面缩放时的缩放比和XY方向的偏移量得到2D空间变换矩阵，将所述空间变换矩阵左乘所述嵌入互动组件的基视图坐标系进行空间变换。

进一步地，所述方法还包括：

将嵌入互动组件的所有子视图参照基视图坐标系根据视图层级的嵌套关系进行空间变换，以保留所述嵌入互动组件的状态和触发区域。

另一方面，本发明还提供一种嵌入互动组件的页面的无缝缩放装置，包括：

加载单元，用于根据页面的格式加载页面和嵌入互动组件，令所述嵌入互动组件和所述页面在视图层次结构中处于同一层级；

缩放单元，用于根据页面的格式进行缩放，同时利用缩放时的空间变换矩阵对所述嵌入互动组件的基视图坐标系进行空间变换，实现页面和嵌入互动组件的同步无缝缩放。

进一步地，所述加载单元还用于：

当页面的格式为点阵描述格式时，直接将页面的图像点阵进行存储加载；

当页面的格式为矢量描述格式时，对页面进行解析和渲染，根据不同的显示分辨率生成页面内容。

进一步地，所述缩放单元还用于：

当页面的格式为点阵描述格式时，根据不同的缩放范围来加载不同尺寸的页面图像；

当页面的格式为矢量描述格式时，根据不同的缩放比来光栅化页面内容点阵，并分块进行页面内容的绘制。

进一步地，所述缩放单元还用于：

根据页面缩放时的缩放比和XY方向的偏移量得到2D空间变换矩阵，将所述空间变换矩阵左乘所述嵌入互动组件的基视图坐标系进行空间变换。

进一步地，所述装置还包括：

子视图变换单元，与所述缩放单元相连，用于将嵌入互动组件的所有子视图参照基视图坐标系根据视图层级的嵌套关系进行空间变换，以保留所述嵌入互动组件的状态和触发区域。

（三）有益效果

在本发明提供的嵌入互动组件的页面的无缝缩放方法及装置中，将页面和嵌入互动组件置于视图层次结构中的同一层级，页面的缩放在页面视图上完成，并不会影响到同一层级的组件视图，在页面缩放的同时，可以利用缩放页面的空间变换矩阵对嵌入互动组件进行同步缩放，实现二者无缝缩放的技术效果，提高了用户体验，具有较高的实际应用价值。

附图说明

为了更清楚地说明本发明实施例或现有技术中的技术方案，下面将对实施例或现有技术描述中所需要使用的附图作一简单地介绍，显而易见地，下面描述中的附图是本发明的一些实施例，对于本领域普通技术人员来讲，在不付出创造性劳动的前提下，还可以根据这些附图获得其他的附图。

图1是本发明实施例嵌入互动组件的页面的无缝缩放方法的基本流程示意图；

图2是本发明实施例1嵌入互动组件的页面的无缝缩放方法的流程示意图；

图3是本发明实施例嵌入互动组件的页面的无缝缩放装置的基本结构示意图；

图4是本发明实施例嵌入互动组件的页面的无缝缩放装置的一个优选结构示意图。

具体实施方式

为使本发明实施例的目的、技术方案和优点更加清楚，下面将结合本发明实施例中的附图，对本发明实施例中的技术方案进行清楚、完整地描述，显然，所描述的实施例是本发明一部分实施例，而不是全部的实施例。基于本发明中的实施例，本领域普通技术人员在没有作出创造性劳动前提下所获得的所有其他实施例，都属于本发明保护的范围。

本发明实施例首先提供了一种嵌入互动组件的页面的无缝缩放方法，参见图1，包括：

步骤101：根据页面的格式加载页面和嵌入互动组件，令所述嵌入互动组件和所述页面在视图层次结构中处于同一层级。

步骤102：根据页面的格式进行缩放，同时利用缩放时的空间变换矩阵对所述嵌入互动组件的基视图坐标系进行空间变换，实现页面和嵌入互动组件的同步无缝缩放。

可见，在本发明实施例提供的嵌入互动组件的页面的无缝缩放方法中，将页面和嵌入互动组件置于视图层次结构中的同一层级，页面的缩放在页面视图上完成，并不会影响到同一层级的组件视图，在页面缩放的同时，可以利用缩放页面的空间变换矩阵对嵌入互动组件进行同步缩放，实现二者无缝缩放的技术效果，提高了用户体验，具有较高的实际应用价值。

页面的格式类型主要包含点阵描述格式（图像文件，如JPG、BMP、PNG等）和矢量描述格式（PDF、EDPUB、CEBX等），其中点阵描述格式在加载时不需要解析文档的过程，呈现的效果与设备环境无关，但是可能会因为图像点阵尺寸过大，导致存储需要的空间变大，而且当页面缩放时，因为插值算法的影响，使得页面显示效果质量下降。而矢量描述格式所呈现的效果与尺度无关，可以根据不同的显示分辨率来生成页面内容，但是可能会因为解析和渲染的开销过大，导致在移动设备上的加载速度变慢。这两种页面的格式各有利弊，在实际应用中，优选地，根据页面的格式加载页面可以包括：当页面的格式为点阵描述格式时，直接将页面的图像点阵进行存储加载；当页面的格式为矢量描述格式时，对页面进行解析和渲染，根据不同的显示分辨率生成页面内容。

优选地，根据页面的格式进行缩放可以包括：当页面的格式为点阵描述格式时，根据不同的缩放范围来加载不同尺寸的页面图像；当页面的格式为矢量描述格式时，根据不同的缩放比来光栅化页面内容点阵，并分块进行页面内容的绘制。

页面内容的渲染刷新，并不影响到嵌入互动组件的呈现和交互，由于嵌入互动组件和页面在视图层次结构中处于同一层级，其中一者的改变并不会影响到另一者。嵌入互动组件的缩放是通过对基视图进行空间变换来实现的，其上所有的子视图均放置在一个基视图之上，其变换也都是参照基视图的坐标系来实现地。优选地，具体实施过程为：根据页面缩放时的缩放比和XY方向的偏移量得到2D空间变换矩阵，将空间变换矩阵左乘所述嵌入互动组件的基视图坐标系进行空间变换；将嵌入互动组件的所有子视图参照基视图坐标系根据视图层级的嵌套关系变换多层嵌套视图的空间位置，以保留所述嵌入互动组件的状态和触发区域。

实施例1：

本发明实施例1提供一种嵌入互动组件的页面的无缝缩放方法，以详细说明本发明实施例的具体实现过程，参见图2：

步骤201：根据页面的格式加载页面和嵌入互动组件，令嵌入互动组件和页面在视图层次结构中处于同一层级。

本步骤中，根据页面的格式加载页面并加载嵌入互动组件，将页面和嵌入互动组件置于视图层次结构中的同一层级上。其中两者均被放置在滚动视图这一基视图内。放置的顺序决定其显示的遮挡顺序，页面视图先放置，组件视图后放置。页面的内容被绘制在页面视图上。

当页面内容采用点阵描述的格式时，每一个页面需要保存至少三个不同尺寸，一般情况下是1/4尺寸，1/2尺寸，全尺寸。所谓的全尺寸，一般是指用户按照144DPI生成的页面图像点阵，用户可以从排版软件直接生成，也可以通过光栅化矢量描述文件生成，如PDF。1/4尺寸作为页面的缩略图使用，主要用于页面预览、页面导航等用途。1/2尺寸作为页面适配屏幕的显示来使用，主要用于页面加载后的初始显示状态。全尺寸则是页面的实际尺寸，主要用于页面放大后的高清显示。当然，如果页面放大的倍数很大的话，可以考虑引入更多尺寸的页面图像点阵，比如1.5倍尺寸、2倍尺寸等。但是这样势必会加大数字内容的文件体积，而且也会增加设备内存的消耗。

如果已知数据内容应用的设备类型时，可以将页面点阵按照设备显示区域的宽高比进行生成。对于不符合设备显示区域宽高比的页面点阵按照以下原则进行显示：1、页面宽高比小于设备显示区域宽高比，高度适配设备显示区域高度，宽度等比例缩放并居中显示；2、页面宽高比大于设备显示区域宽高比，宽度适配设备显示区域宽度，高度等比例缩放并居中显示。

当页面被加载时，阅读器首先会在页面视图上显示1/4尺寸图作为页面缩略图，之后会替换上1/2尺寸图。这主要是为了在用户快速滑动翻页的时候，能保证每一页的内容会被快速显示出来，而不是显示空白页。

当页面内容采用矢量描述的格式时，需要对页面进行解析和渲染，根据不同的显示分辨率生成页面内容。页面视图显示的内容都是实时生成的。显示内容对应的尺寸越小，生成的速度越快。

步骤202：根据页面的格式进行缩放。

当用户对点阵描述格式的页面进行放大处理的时候，当放大超过某一个指定的阈值时，比如放大前显示大小的1.2倍时，页面视图会被替换为全尺寸图像的。需要注意的是，在放大过程中，如果用户没有停止放大的动作，那么就始终用放大前的页面视图显示，而不要进行页面图像替换。缩小页面的过程与放大过程类似，这里就不再赘述了。出于性能方面的考虑，全尺寸页面替换时，仍可能会消耗较多的内存，因此，建议对图像进行分块处理，替换时，只在屏幕显示区域内显示与图像相交或包含的图像块即可。

而在对矢量描述格式的页面进行缩放时，需要进行分块光栅化的处理。这里有很多分块的方法，其中一种便是LOD技术，即多细节层次，这是借鉴图形学上的一个概念。首先需要指定一个缩放比为1:1时的分块大小。然后由两个变量来控制分块渲染的时机和分块大小。一个变量是levelsOfDetail，其含义是指从1：1缩放倍数开始，能够支持细节刷新的缩小级数。每一级是上一级的1/2，所以假设levelsOfDetail=n，那么页面缩小倍数为以下数字时2^（－1）->2^（－2）->…->2^（－n），会对页面内容分块开始绘制，也就是1/2,1/4,1/8,1/16,…,1/2^n。

以上情况下，当页面缩放比大于1/2后就不会再重绘页面了，此时若继续放大页面的话，画面将越来越模糊。这个时候需要引入另一个变量levelsOfDetailBias。当levelsOfDetailBias=m，levelsOfDetail=n时会有如下队列：2^(m－1)->2^(m－2)->2^(m－3)->…->2^(m－n)，即表示缩放比为该队列取值时，需要对页面进行分块重绘。特别地，当levelsOfDetailBias>levelsOfDetail时，则页面缩放每相差2倍就会重绘一下。其中，levelsOfDetail表示一共有多少个重绘级别，levelsOfDetailBias表示缩放比大于1：1的重绘级别个数。而每个缩放级别之间分块的大小也会相差两倍。

步骤203：在页面缩放的同时对嵌入互动组件进行同步无缝缩放。

页面的缩放是在页面视图上完成的。并不会影响到同一层级的组件视图，组件所有的子视图都是放置在一个基视图之上的。因此当页面缩放时，只需要根据缩放比和XY方向的偏移量，即可以算出2D空间变换矩阵，将该变换矩阵左乘嵌入互动组件的基视图坐标系，就能够变换至缩放偏移后的位置。而基视图之上的子视图则都是参照基视图坐标系来进行空间变换的。这样，通过视图层级的嵌套关系可以很方便地变换多层嵌套视图的空间位置，同时仍然保留组件的状态和触发区域。

至此，则完成了本发明实施例1嵌入互动组件的页面的无缝缩放方法的全过程。

本发明实施例还提供一种嵌入互动组件的页面的无缝缩放装置，参见图3，包括：

加载单元301，用于根据页面的格式加载页面和嵌入互动组件，令所述嵌入互动组件和所述页面在视图层次结构中处于同一层级；

缩放单元302，用于根据页面的格式进行缩放，同时利用缩放时的空间变换矩阵对所述嵌入互动组件的基视图坐标系进行空间变换，实现页面和嵌入互动组件的同步无缝缩放。

优选地，加载单元301还可以用于：当页面的格式为点阵描述格式时，直接将页面的图像点阵进行存储加载；当页面的格式为矢量描述格式时，对页面进行解析和渲染，根据不同的显示分辨率生成页面内容。

优选地，缩放单元302还可以用于：当页面的格式为点阵描述格式时，根据不同的缩放范围来加载不同尺寸的页面图像；当页面的格式为矢量描述格式时，根据不同的缩放比来光栅化页面内容点阵，并分块进行页面内容的绘制。

优选地，缩放单元302还可以用于：根据页面缩放时的缩放比和XY方向的偏移量得到2D空间变换矩阵，将所述空间变换矩阵左乘所述嵌入互动组件的基视图坐标系进行空间变换。

优选地，装置还可以包括：子视图变换单元401，见图4，与缩放单元302相连，用于将嵌入互动组件的所有子视图参照基视图坐标系根据视图层级的嵌套关系进行空间变换，以保留所述嵌入互动组件的状态和触发区域。

可见，本发明实施例至少具有如下有益效果：

在本发明实施例提供的嵌入互动组件的页面的无缝缩放方法及装置中，将页面和嵌入互动组件置于视图层次结构中的同一层级，页面的缩放在页面视图上完成，并不会影响到同一层级的组件视图，在页面缩放的同时，可以利用缩放页面的空间变换矩阵对嵌入互动组件进行同步缩放，实现二者无缝缩放的技术效果，提高了用户体验，具有较高的实际应用价值。

最后应说明的是：以上实施例仅用以说明本发明的技术方案，而非对其限制；尽管参照前述实施例对本发明进行了详细的说明，本领域的普通技术人员应当理解：其依然可以对前述各实施例所记载的技术方案进行修改，或者对其中部分技术特征进行等同替换；而这些修改或者替换，并不使相应技术方案的本质脱离本发明各实施例技术方案的精神和范围。

Claims (8)

1.一种嵌入互动组件的页面的无缝缩放方法，其特征在于，包括：

根据页面的格式加载页面和嵌入互动组件，令所述嵌入互动组件和所述页面在视图层次结构中处于同一层级；

根据页面的格式进行缩放，同时根据页面缩放时的缩放比和XY方向的偏移量得到2D空间变换矩阵，将所述空间变换矩阵左乘所述嵌入互动组件的基视图坐标系进行空间变换，实现页面和嵌入互动组件的同步无缝缩放。

2.根据权利要求1所述的嵌入互动组件的页面的无缝缩放方法，其特征在于，所述根据页面的格式加载页面包括：

当页面的格式为点阵描述格式时，直接将页面的图像点阵进行存储加载；

当页面的格式为矢量描述格式时，对页面进行解析和渲染，根据不同的显示分辨率生成页面内容。

3.根据权利要求1所述的嵌入互动组件的页面的无缝缩放方法，其特征在于，所述根据页面的格式进行缩放包括：

当页面的格式为点阵描述格式时，根据不同的缩放范围来加载不同尺寸的页面图像；

当页面的格式为矢量描述格式时，根据不同的缩放比来光栅化页面内容点阵，并分块进行页面内容的绘制。

4.根据权利要求1所述的嵌入互动组件的页面的无缝缩放方法，其特征在于，所述方法还包括：

将嵌入互动组件的所有子视图参照基视图坐标系根据视图层级的嵌套关系进行空间变换，以保留所述嵌入互动组件的状态和触发区域。

5.一种嵌入互动组件的页面的无缝缩放装置，其特征在于，包括：

加载单元，用于根据页面的格式加载页面和嵌入互动组件，令所述嵌入互动组件和所述页面在视图层次结构中处于同一层级；

缩放单元，用于根据页面的格式进行缩放，同时根据页面缩放时的缩放比和XY方向的偏移量得到2D空间变换矩阵，将所述空间变换矩阵左乘所述嵌入互动组件的基视图坐标系进行空间变换，实现页面和嵌入互动组件的同步无缝缩放。

6.根据权利要求5所述的嵌入互动组件的页面的无缝缩放装置，其特征在于，所述加载单元还用于：

当页面的格式为点阵描述格式时，直接将页面的图像点阵进行存储加载；

当页面的格式为矢量描述格式时，对页面进行解析和渲染，根据不同的显示分辨率生成页面内容。

7.根据权利要求5所述的嵌入互动组件的页面的无缝缩放装置，其特征在于，所述缩放单元还用于：

当页面的格式为点阵描述格式时，根据不同的缩放范围来加载不同尺寸的页面图像；

当页面的格式为矢量描述格式时，根据不同的缩放比来光栅化页面内容点阵，并分块进行页面内容的绘制。

8.根据权利要求5所述的嵌入互动组件的页面的无缝缩放装置，其特征在于，所述装置还包括：

子视图变换单元，与所述缩放单元相连，用于将嵌入互动组件的所有子视图参照基视图坐标系根据视图层级的嵌套关系进行空间变换，以保留所述嵌入互动组件的状态和触发区域。