CN107870703B - 图片全屏展示的方法、系统及终端设备 - Google Patents

Abstract

本发明公开一种图片全屏展示的方法、系统及终端设备。该方法包括：对当前屏幕进行截图；对截图进行逐渐放大同时对截图的位置进行调整直到使得截图中需要全屏的图片的略缩图最终实现全屏；将所述图片全屏展示在屏幕上，同时隐藏截图。本发明由于先对截图进行动画全屏，然后再展示图片，增加了动画的平滑度，使得全屏图片时，视觉上过渡非常自然。

Description

图片全屏展示的方法、系统及终端设备

技术领域

本发明涉及终端显示领域，具体涉及一种图片全屏展示的方法、系统及终端设备。

背景技术

随着移动互联网的发展，在移动设备上阅读内容的场景越来越多，而图片是内容占比很大一部分。由于移动设备相比PC来说屏幕较小，所以也经常需要对图片进行全屏展示。图片在非全屏展示到全屏展示的过程当中，加上缓和过渡效果的动画，会让用户对阅读全屏图片更舒适。

现有技术通过图片慢慢放大的动画进行全屏。具体过程结合附图1详细描述如下。

1、监控图片的点击事件：主要是监控内容中所有图片的点击事件。

2、计算图片全屏所需缩放的比例：此步骤主要是针对图片的大小以及屏幕的大小，计算当前图片在当前屏幕能全屏展示的的比例，计算方法如下。

a)计算图片宽与屏幕宽的比例，记为X。

b)计算图片高与屏幕高的比例，记为Y。

c)若X大于或等于Y，则全屏所需缩放的比例为X，否则为Y，结果记为Z。

3、计算图片全屏时居中展示的坐标：此步骤主要是计算在图片全屏后，即计算图片左上角坐标的位置。计算方法如下：

a)取出上一步的结果，比较X和Y

i.若X大于或等于Y，则图片全屏后的横坐标为0，纵坐标＝(屏幕高-图片高*X)/2注：*为乘号，/为除号，最终坐标结果记为(A，B)，A为横坐标，B为纵坐标。

ii.若X大于或等于Y，则图片全屏后的纵坐标为0，横坐标＝(屏幕宽-图片宽*Y)/2注：*为乘号，/为除号，最终坐标结果记为(A，B)，A为横坐标，B为纵坐标。

b)图片所需移动的距离

i.水平方向所需移动距离＝A-当前图片左上角横向坐标，记为C

ii.垂直方向所需移动距离＝B-当前图片左上角纵向坐标，记为D。

4、启动动画，启动动画前，给图片背后增加一个透明的全屏背景(背景颜色为黑色，大小与屏幕大小一致，透明度为全透明，图层层叠位置上，图片放在背景上方)，开启动画，动画内容含：

a)图片的大小，即缩放Z倍；

b)图片水平移动C距离；

c)图片垂直移动D距离；

d)背景色透明度从全透明到不透明。

5、监控全屏后图片的点击事件：监控全屏后的图片的点击事件。

6、发生点击图片事件，启动动画：

a)图片慢慢缩放到图片原来大小(即缩放倍数为Z分之一)

b)图片位置移动到原来位置(即水平移动-C距离，垂直移动-D距离)

c)背景色由不透明变为全透明

d)最后移除背景。

上述现有技术的缺点来自动画部分，即步骤4和步骤6，图片放大和缩小的过程中，都是直接对图片直接缩放，在视觉上动画不够平缓，在思绪的连贯性上有所卡滞。

因此，需要一种图片全屏展示的方法。

在所述背景技术部分公开的上述信息仅用于加强对本发明的背景的理解，因此它可以包括不构成对本领域普通技术人员已知的现有技术的信息。

发明内容

本发明公开一种图片全屏展示的方法、系统及终端设备，能够使得全屏图片时，视觉上过渡非常自然。

本发明的其他特性和优点将通过下面的详细描述变得显然，或部分地通过本发明的实践而习得。

根据本发明的一方面，公开一种图片全屏展示的方法，包括：

对当前屏幕进行截图；

对截图进行逐渐放大同时对截图的位置进行调整直到使得截图中需要全屏的图片的略缩图最终实现全屏；

将所述图片全屏展示在屏幕上，同时隐藏截图。

根据本发明的一实施方式，所述图片全屏展示的方法，还包括：

监控全屏后所述图片的点击事件；

当发生点击事件时，隐藏所述图片，同时显示截图；

并使得截图逐渐缩小至原始大小并移至原始位置。

根据本发明的一实施方式，所述图片全屏展示的方法，还包括：

在所述对当前屏幕进行截图后，给截图背后增加一个透明的全屏背景；

在所述将所述图片全屏展示在屏幕上时，将所述全屏背景设置为不透明；

在所述隐藏所述图片同时显示截图后，移除所述全屏背景。

根据本发明的一实施方式，所述全屏背景为黑色，大小与屏幕一致。

根据本发明的一实施方式，所述对当前屏幕进行截图包括：调用系统应用程序接口对当前屏幕内容进行截图并保存图片。

根据本发明的一实施方式，所述将所述图片全屏展示在屏幕上包括：将所述图片放大至等同于截图最终放大倍数的倍数并进行与截图同样的位置调整后全屏展示在屏幕上。

根据本发明的第二方面，公开一种图片全屏展示系统，包括：

截屏模块，对当前屏幕进行截图；

截图动画模块，对截图进行逐渐放大同时对截图的位置进行调整直到使得截图中需要全屏的图片的略缩图最终实现全屏；

全屏展示模块，将所述图片全屏展示在屏幕上，同时隐藏截图。

根据本发明的一实施方式，所述图片全屏展示系统还包括：点击监控模块，监控全屏后的图片的点击事件。

根据本发明的一实施方式，所述图片全屏展示系统还包括：

全屏退出模块，当发生点击事件时，隐藏所述图片，同时显示截图，并使得截图逐渐缩小至原始大小并移至原始位置。

根据本发明的第三方面，公开一种终端设备，包括：

处理器；

存储器，存储用于所述处理器控制以下操作的指令：

对当前屏幕进行截图；

对截图进行逐渐放大同时对截图的位置进行调整直到使得截图中需要全屏的图片的略缩图最终实现全屏；

将所述图片全屏展示在屏幕上，同时隐藏截图。

根据本发明的一些实施方式，由于先对截图进行动画全屏，然后再展示图片，增加了动画的平滑度，使得全屏图片时，视觉上过渡非常自然。

根据本发明的一些实施方式，退出全屏时隐藏图片，同时显示截图，并使得截图慢慢缩小至原始大小并移至原始位置，让客户的视觉体验更加舒适。

应当理解的是，以上的一般描述和后文的细节描述仅是示例性的，并非用于限制本发明。

附图说明

通过参照附图详细描述其示例实施例，本发明的上述和其它目标、特征及优点将变得更加显而易见。

图1示出根据现有技术的一图片全屏展示方法的流程图。

图2示出根据本发明示例实施方式的一图片全屏展示方法的流程图。

图3示出根据本发明另一示例实施方式的一图片全屏展示方法的流程图。

图4示出根据本发明示例实施方式的一图片全屏展示系统的方框图。

图5示出根据本发明一示例实施方式的终端设备。

具体实施方式

现在将参考附图更全面地描述示例实施方式。然而，示例实施方式能够以多种形式实施，且不应被理解为限于在此阐述的范例；相反，提供这些实施方式使得本发明的描述将更加全面和完整，并将示例实施方式的构思全面地传达给本领域的技术人员。附图仅为本发明的示意性图解，并非一定是按比例绘制。图中相同的附图标记表示相同或类似的部分，因而将省略对它们的重复描述。

此外，所描述的特征、结构或特性可以以任何合适的方式结合在一个或更多实施方式中。在下面的描述中，提供许多具体细节从而给出对本发明的实施方式的充分理解。然而，本领域技术人员将意识到，可以实践本发明的技术方案而省略所述特定细节中的一个或更多，或者可以采用其它的方法、组元、步骤等。在其它情况下，不详细示出或描述公知结构、方法、实现或者操作以避免喧宾夺主而使得本发明的各方面变得模糊。

附图中所示的一些方框图是功能实体，不一定必须与物理或逻辑上独立的实体相对应。可以采用软件形式来实现这些功能实体，或在一个或多个硬件模块或集成电路中实现这些功能实体，或在不同网络和/或处理器装置和/或微控制器装置中实现这些功能实体。

本发明对当前屏幕进行截图；对截图进行逐渐放大同时对截图的位置进行调整直到使得截图中需要全屏的图片的略缩图最终实现全屏；将所述图片全屏展示在屏幕上，同时隐藏截图。本发明由于先对截图进行动画全屏，然后再展示图片，增加了动画的平滑度，使得全屏图片时，视觉上过渡非常自然。另外，退出全屏时隐藏图片，同时显示截图，并使得截图慢慢缩小至原始大小并移至原始位置，让客户的视觉体验更加舒适。

图2示出根据本发明示例实施方式的一图片全屏展示方法的流程图。该方法可用于终端设备。终端设备可为手机、平板电脑，笔记本电脑，台式电脑，PDA等，但本发明不限于此。

如图2所示，在S202，对当前屏幕进行截图。

根据一实施例，在全屏开始时，调用系统API即系统应用程序接口对当前屏幕内容进行截图并保存图片。

在S204，对截图进行逐渐放大同时对截图的位置进行调整直到使得截图中需要全屏的图片的略缩图最终实现全屏。

略缩图最终实现全屏时截图所需的缩放的比例以及所需移动的距离如下所述。

计算略缩图全屏所需缩放的比例：主要是针对略缩图的大小以及屏幕的大小，计算略缩图在当前屏幕能全屏展示的的比例，计算方法如下。

a)计算略缩图宽与屏幕宽的比例，记为X。

b)计算略缩图高与屏幕高的比例，记为Y。

c)若X大于或等于Y，则全屏所需缩放的比例为X，否则为Y，结果记为Z。

计算略缩图全屏时居中展示的坐标从而得到略缩图所需移动的距离：此步骤主要是计算在略缩图全屏后，即计算略缩图左上角坐标的位置。计算方法如下：

a)取出上一步的结果，比较X和Y

i.若X大于或等于Y，则略缩图全屏后的横坐标为0，纵坐标＝(屏幕高-略缩图高*X)/2注：*为乘号，/为除号，最终坐标结果记为(A，B)，A为横坐标，B为纵坐标。

ii.若X大于或等于Y，则略缩图全屏后的纵坐标为0，横坐标＝(屏幕宽-略缩图宽*Y)/2注：*为乘号，/为除号，最终坐标结果记为(A，B)，A为横坐标，B为纵坐标。

b)略缩图或截图所需移动的距离

i.水平方向所需移动距离＝A-略缩图左上角横向坐标，记为C

ii.垂直方向所需移动距离＝B-略缩图左上角纵向坐标，记为D。

需要指出的是，在这里由于只是对截图中需要全屏的图片的略缩图进行放大，即只是通过简单的将略缩图相邻像素的间距扩大来进行放大，因此其分辨率必然会越来越低即图像越来越模糊；这与本文一般所述的“图片放大”不同，本文所述的“图片放大”是指对原始图片的放大，通常原始图片的分辨率都远大于略缩图的分辨率(即原始图片实际包含的像素数远大于略缩图显示出来的像素数)，甚至也会大于显示器的分辨率，所以随着放大的进行原来没有显示的像素会被显示出来从而保证图片的分辨率不会降低即图像不会越来越模糊，除非放大倍数过大到使得单位面积内显示的原始图片包含的像素点数小于显示设备包含的像素点数。

在S206，将所述图片全屏展示在屏幕上，同时隐藏截图。

根据本发明的一实施方式，将所述图片放大至等同于截图最终放大倍数的倍数并进行与截图同样的位置调整后全屏展示在屏幕上，同时隐藏截图。

实际上也就是说用清晰的放大后的图片替换了模糊的放大后的略缩图从而最终实现了图片的全屏展示

根据本发明的另一实施方式，所述方法还包括监控全屏后所述图片的点击事件，当发生点击事件时，隐藏所述图片，同时显示截图，并使得截图逐渐缩小至原始大小并移至原始位置。

图3示出根据本发明另一示例实施方式的一图片全屏展示方法的流程图。

如图3所示，S302-S306与S202-S206相同，在此不再赘述。

在S308，监控全屏后所述图片的点击事件，即监控是否有退出全屏命令发生。

在S310，当发生点击事件时，隐藏所述图片，同时显示截图。

在S312，使得截图逐渐缩小至原始大小并移至原始位置。即截图逐渐缩小为全屏时的Z分之一，并水平移动-C距离，垂直移动-D距离。

根据本发明的一实施方式，所述方法还包括在所述对当前屏幕进行截图后，给截图背后增加一个透明的全屏背景；在所述将所述图片全屏展示在屏幕上时，将所述全屏背景设置为不透明；在所述隐藏所述图片同时显示截图后，移除所述全屏背景。

背景颜色为黑色，大小与屏幕大小一致，开始时透明度为全透明，从图层层叠位置上来说，图片放在背景上方。

图4示出根据本发明示例实施方式的一图片全屏展示系统的方框图。

所述图片全屏展示系统可以用于手机、平板电脑、计算机、个人数字助理等设备。

如图4所示，图片全屏展示系统400可包括截屏模块402，截图动画模块404和全屏展示模块406。

截屏模块402，对当前屏幕进行截图；

截图动画模块404，对截图进行逐渐放大同时对截图的位置进行调整直到使得截图中需要全屏的图片的略缩图最终实现全屏；

全屏展示模块406，将所述图片全屏展示在屏幕上，同时隐藏截图。

也就是说将所述图片放大至等同于截图最终放大倍数的倍数并进行与截图同样的位置调整后全屏展示在屏幕上，同时隐藏截图。

根据本发明的一实施方式，所述图片全屏展示系统还包括：点击监控模块408，监控全屏后的图片的点击事件，即实时监控是否有退出全屏命令发生。

根据本发明的一实施方式，所述图片全屏展示系统还包括：

全屏退出模块410，当发生点击事件时，隐藏所述图片，同时显示截图，并使得截图逐渐缩小至原始大小并移至原始位置。

图5示出根据本发明一示例实施方式的终端设备。

所述终端设备可以是手机、平板电脑、计算机、个人数字助理等设备，但不限于此。

如图5所示，终端设备500可包括处理器510、存储器520。另外，根据一实施例，终端设备还可包括发射器及接收器。

处理器510可调用存储器520中存储的指令控制相关操作，如控制发射器和接收器进行信号收发等。

根据一实施例，存储器520存储用于处理器510控制以下操作的指令：对当前屏幕进行截图；对截图进行逐渐放大同时对截图的位置进行调整直到使得截图中需要全屏的图片的略缩图最终实现全屏；将所述图片全屏展示在屏幕上，同时隐藏截图。处理器510可调用存储器520中存储的指令控制相关操作。易于理解，存储器520还可存储用于处理器510控制根据本发明实施例的其他操作的指令，这里不再赘述。

通过以上的详细描述，本领域的技术人员易于理解，根据本发明实施例的系统和方法具有以下优点中的一个或多个。

根据本发明的一些实施方式，由于先对截图进行动画全屏，然后再展示图片，增加了动画的平滑度，使得全屏图片时，视觉上过渡非常自然。

根据本发明的一些实施方式，退出全屏时隐藏图片，同时显示截图，并使得截图慢慢缩小至原始大小并移至原始位置，让客户的视觉体验更加舒适。

本领域技术人员在考虑说明书及实践这里公开的发明后，将容易想到本发明的其它实施方案。本申请旨在涵盖本发明的任何变型、用途或者适应性变化，这些变型、用途或者适应性变化遵循本发明的一般性原理并包括本发明未公开的本技术领域中的公知常识或惯用技术手段。说明书和实施例仅被视为示例性的，本发明的真正范围和精神由下面的权利要求指出。

应当理解的是，本发明并不局限于上面已经描述并在附图中示出的精确结构，并且可以在不脱离其范围进行各种修改和改变。本发明的范围仅由所附的权利要求来限制。

Claims (10)

1.一种图片全屏展示的方法，其特征在于，包括：

对当前屏幕进行截图；

对截图进行逐渐放大同时对截图的位置进行调整直到使得截图中需要全屏的图片的略缩图最终实现全屏；

将所述图片全屏展示在屏幕上，同时隐藏截图；

其中，所述略缩图最终实现全屏时的所需的缩放比例以及所需移动的距离的计算过程如下所述，

计算所述略缩图全屏时所需缩放的比例，包括：

计算略缩图宽与屏幕宽的比例，记为X，计算略缩图高与屏幕高的比例，记为Y；

若X大于或等于Y，则全屏所需缩放的比例为X，否则为Y，结果记为Z；

计算所述略缩图全屏时所需移动的距离，包括：

计算略缩图宽与屏幕宽的比例，记为X，计算略缩图高与屏幕高的比例，记为Y，并比较X和Y；

若X大于或等于Y，则略缩图全屏后的横坐标为0，纵坐标＝(屏幕高-略缩图高*X)/2；其中，将所述纵坐标记为B；

若X大于或等于Y，则略缩图全屏后的纵坐标为0，横坐标＝(屏幕宽-略缩图宽*Y)/2；其中，将所述横坐标记为A；

略缩图或截图所需移动的距离为：水平方向所需移动距离＝A-略缩图左上角横向坐标，记为C；垂直方向所需移动距离＝B-略缩图左上角纵向坐标，记为D。

2.如权利要求1所述的方法，还包括：

监控全屏后所述图片的点击事件；

当发生点击事件时，隐藏所述图片，同时显示截图；

并使得截图逐渐缩小至原始大小并移至原始位置。

3.如权利要求2所述的方法，还包括：

在所述对当前屏幕进行截图后，给截图背后增加一个透明的全屏背景；

在所述将所述图片全屏展示在屏幕上时，将所述全屏背景设置为不透明；

在所述隐藏所述图片同时显示截图后，移除所述全屏背景。

4.如权利要求3所述的方法，所述全屏背景为黑色，大小与屏幕一致。

5.如权利要求1所述的方法，所述对当前屏幕进行截图包括：调用系统应用程序接口对当前屏幕内容进行截图并保存图片。

6.如权利要求1所述的方法，所述将所述图片全屏展示在屏幕上包括：将所述图片放大至等同于截图最终放大倍数的倍数并进行与截图同样的位置调整后全屏展示在屏幕上。

7.一种图片全屏展示系统，其特征在于，包括：

截屏模块，对当前屏幕进行截图；

截图动画模块，对截图进行逐渐放大同时对截图的位置进行调整直到使得截图中需要全屏的图片的略缩图最终实现全屏；

全屏展示模块，将所述图片全屏展示在屏幕上，同时隐藏截图；

其中，所述截图动画模块包括计算单元，用于计算所述略缩图全屏时所需缩放的比例，包括：

计算略缩图宽与屏幕宽的比例，记为X，计算略缩图高与屏幕高的比例，记为Y；

若X大于或等于Y，则全屏所需缩放的比例为X，否则为Y，结果记为Z；

计算所述略缩图全屏时所需移动的距离，包括：

计算略缩图宽与屏幕宽的比例，记为X，计算略缩图高与屏幕高的比例，记为Y，并比较X和Y；

若X大于或等于Y，则略缩图全屏后的横坐标为0，纵坐标＝(屏幕高-略缩图高*X)/2；其中，将所述纵坐标记为B；

若X大于或等于Y，则略缩图全屏后的纵坐标为0，横坐标＝(屏幕宽-略缩图宽*Y)/2；其中，将所述横坐标记为A；

略缩图或截图所需移动的距离为：水平方向所需移动距离＝A-略缩图左上角横向坐标，记为C；垂直方向所需移动距离＝B-略缩图左上角纵向坐标，记为D。

8.如权利要求7所述的系统，其特征在于，还包括：

点击监控模块，监控全屏后的图片的点击事件。

9.如权利要求8所述的系统，其特征在于，还包括：

全屏退出模块，当发生点击事件时，隐藏所述图片，同时显示截图，并使得截图逐渐缩小至原始大小并移至原始位置。

10.一种终端设备，其特征在于，包括：

处理器；

存储器，存储用于所述处理器控制以下操作的指令：

对当前屏幕进行截图；

对截图进行逐渐放大同时对截图的位置进行调整直到使得截图中需要全屏的图片的略缩图最终实现全屏；

将所述图片全屏展示在屏幕上，同时隐藏截图；

其中，所述略缩图最终实现全屏时的所需的缩放比例以及所需移动的距离的计算过程如下所述，

计算所述略缩图全屏时所需缩放的比例，包括：

计算略缩图宽与屏幕宽的比例，记为X，计算略缩图高与屏幕高的比例，记为Y；

若X大于或等于Y，则全屏所需缩放的比例为X，否则为Y，结果记为Z；

计算所述略缩图全屏时所需移动的距离，包括：

计算略缩图宽与屏幕宽的比例，记为X，计算略缩图高与屏幕高的比例，记为Y，并比较X和Y；

若X大于或等于Y，则略缩图全屏后的横坐标为0，纵坐标＝(屏幕高-略缩图高*X)/2；其中，将所述纵坐标记为B；

若X大于或等于Y，则略缩图全屏后的纵坐标为0，横坐标＝(屏幕宽-略缩图宽*Y)/2；其中，将所述横坐标记为A；

略缩图或截图所需移动的距离为：水平方向所需移动距离＝A-略缩图左上角横向坐标，记为C；垂直方向所需移动距离＝B-略缩图左上角纵向坐标，记为D。

Images