CN103136207B - 一种多图浏览提示方法及装置 - Google Patents

Abstract

本发明公开了一种多图浏览提示方法及装置，属于图像界面领域。所述方法包括：加载浏览进度条，当用户切换图片后，获取用户进行切换后得到的当前页的图片的页码，根据所述当前页的图片的页码和所述当前页所属的当前组图片的总页数计算所述变化部分在所述浏览进度条中所占的变化比例，并根据所述变化比例在所述浏览进度条中显示所述变化部分。本发明通过使用浏览进度条对用户浏览多图时进行提示，每切换一张图片，浏览进度条中的变化部分就会按照计算得出的比例进行变化，使用户能够直观的看到图片的总数，并且可以会意到当前的图片大概是第几张，不会受到图片总数的影响，同时也可以很好的过渡横向满屏的图片和下方元素的衔接，不会出现断层现象。

Description

一种多图浏览提示方法及装置

技术领域

本发明涉及图像界面领域，特别涉及一种多图浏览提示方法及装置。

背景技术

目前在很多平台上进行图片浏览时，平台均会提供多图浏览的提示功能，以使得用户可以通过提示直观的观察当前组图片的总页数，以及用户正在查看的图片在当前组图片中的位置或页数。

例如，在iPhone平台下浏览多图时，在图片底部会使用多点以示意图片张数，并强调当前图片对应的点示意当前张，对于用户对多图的浏览提示较直观。

在实现本发明的过程中，发明人发现现有技术至少存在以下问题：

使用现有的使用多点示意图片张数的方式，如果网页中的图片过多，尤其是达到20张以上，多点与图片页数之间的一一对应的关系就很难体现，而实际情况是门户网站的图片经常会遇到20张以上的组图，并且在页面展现上当图片是横向撑开满屏的情况下，如果图片下方的元素也是横向撑开满屏的时候，若用多点提示，就会出现断层现象。

发明内容

为了解决现有的使用多点示意图片张数的方法存在的问题，本发明实施例提供了一种多图浏览提示方法及装置。所述技术方案如下：

一种多图浏览提示方法，应用于终端中横向满屏加载图片，所述方法包括：

当加载当前组图片中的第一页图片时，在所述第一页图片的下方显示浏览进度条，并初始化所述浏览进度条中的变化部分占所述浏览进度条的总长度比例为0；其中，所述浏览进度条的长度与图片显示区域的长度相同；

当用户切换图片后，获取所述用户进行切换后得到的当前页的图片的页码P；

根据所述当前页的图片的页码P和所述当前页所属的当前组图片的总页数Q计算得到所述变化部分在所述浏览进度条中所占的变化比例M＝(P-1)/(Q-1)，并根据所述变化比例M在所述浏览进度条中显示所述变化部分；其中，所述变化部分为在所述浏览进度条上进行显示并且相对于所述浏览进度条的显示效果具有变化且连续的部分，所述变化部分可区别于所述浏览进度条部分；

当所述当前页不是所述当前组图片中的最后一页时，在所述当前页的图片的右下方显示第一标记；其中，所述第一标记用于提示所述用户浏览下一张图片，还用于在被所述用户点击后滚动显示到下一张图片；

当所述当前页不是所述当前组图片中的第一页时，在所述当前页的图片的左下方显示第二标记；其中，所述第二标记用于提示所述用户浏览上一张图片，还用于在被所述用户点击后滚动显示到上一张图片。

一种多图浏览提示装置，应用于终端中横向满屏加载图片，所述装置包括：

进度条加载模块，用于当加载当前组图片中的第一页图片时，在所述第一页图片的下方显示浏览进度条；其中，所述浏览进度条的长度与图片显示区域的长度相同；

初始化模块，用于初始化所述浏览进度条中的变化部分占所述浏览进度条的总长度比例为0；

页码获取模块，用于当用户切换图片后，获取所述用户进行切换后得到的当前页的图片的页码P；

变化模块，用于根据所述当前页的图片的页码P和所述当前页所属的当前组图片的总页数Q计算得到所述变化部分在所述浏览进度条中所占的变化比例M＝(P-1)/(Q-1)，并根据所述变化比例M在所述浏览进度条中显示所述变化部分；其中，所述变化部分为在所述浏览进度条上进行显示并且相对于所述浏览进度条的显示效果具有变化且连续的部分，所述变化部分可区别于所述浏览进度条部分；

第一标记显示模块，用于当所述当前页不是所述当前组图片中的最后一页时，在所述当前页的图片的右下方显示第一标记；其中，所述第一标记用于提示所述用户浏览下一张图片，还用于在被所述用户点击后滚动显示到下一张图片；

第二标记显示模块，用于当所述当前页不是所述当前组图片中的第一页时，在所述当前页的图片的左下方显示第二标记；其中，所述第二标记用于提示所述用户浏览上一张图片，还用于在被所述用户点击后滚动显示到上一张图片。

本发明实施例提供的技术方案带来的有益效果是：通过使用浏览进度条对用户浏览多图时进行提示，每切换一张图片，浏览进度条中的变化部分就会按照计算得出的比例进行变化，使得用户可以很直观的看到图片的总数，并且可以会意到当前的图片大概是第几张，不会受到图片总数的影响，同时也可以很好的过渡横向满屏的图片和下方元素的衔接，不会出现断层现象。

附图说明

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

图1是本发明实施例1中提供的一种多图浏览提示方法的流程示意图；

图2是本发明实施例2中提供的一种多图浏览提示方法的流程示意图；

图3是本发明实施例2中提供的加载浏览进度条后的图片显示效果；

图4是本发明实施例2中提供的对浏览进度条进行等分的示意图；

图5是本发明实施例2中提供的浏览下一张图片时浏览进度条的示意图；

图6是本发明实施例2中提供的切换图片后的多图浏览示意图；

图7是本发明实施例2中提供的浏览最后一张图片时的多图浏览示意图；

图8是本发明实施例3中提供的一种多图浏览提示装置的结构示意图。

具体实施方式

为使本发明的目的、技术方案和优点更加清楚，下面将结合附图对本发明实施方式作进一步地详细描述。

实施例1

由图1所示，本实施例提供了一种多图浏览提示方法，该方法包括如下步骤：

101、加载浏览进度条，并初始化浏览进度条中的变化部分占浏览进度条的总长度比例为0；

102、当用户切换图片后，获取用户进行切换后得到的当前页的图片的页码；

103、根据当前页的图片的页码和当前页所属的当前组图片的总页数计算变化部分在浏览进度条中所占的变化比例，并根据上述变化比例在浏览进度条中显示变化部分。

本发明实施例提供了一种多图浏览提示方法，通过使用浏览进度条对用户浏览多图时进行提示，每切换一张图片，浏览进度条中的变化部分就会按照计算得出的比例进行变化，使得用户可以很直观的看到图片的总数，并且可以会意到当前的图片大概是第几张，不会受到图片总数的影响，同时也可以很好的过渡横向满屏的图片和下方元素的衔接，不会出现断层现象。

实施例2

本实施例2提供了一种多图浏览提示方法，是在实施例1的基础之上进行的改进。

需要说明的是，本实施例所提供的方法可应用于各种平台，只要是进行多图浏览即可使用该方法。在本实施例中，在对多图浏览提示方法进行说明时，以在IPhone平台下为例进行说明。

进一步地，变化部分具体地为在浏览进度条上进行显示并且相对于浏览进度条的显示效果具有变化且连续的部分，变化部分可区别于浏览进度条部分，例如变化部分可以包括形状变化部分、变色部分，在本实施例2中，优选地使用变色部分作为变化部分进行说明，但是不能限定变化部分的具体形式。

由图2所示，一种多图浏览提示方法，具体包括如下步骤：

201、加载浏览进度条，并初始化变色部分占浏览进度条的总长度比例为0；

在本实施例中，以在IPhone手机屏幕上进行显示为例进行说明，设置当用户浏览当前组图片时，当前组的每张图片的长度相同，且宽度等于320像素，此时，图片长度也为320像素。

一般地，当用户初次浏览当前组图片时，在加载当前组图片时首先显示第一页。

进一步地，如图3所示，加载浏览进度条具体的为：

当加载当前组图片中的第一页时，在第一页的右下方显示第一提示标记，在第一页的下方显示浏览进度条，且浏览进度条的长度与图片显示区域的长度相同；

在本实施例中，浏览进度条的高度优选地为2个像素。

其中，第一提示标记用于提示用户浏览下一张图片，还可用于在被用户点击后滚动显示到下一张图片。

进一步地，本实施例中所提供的浏览进度条通过变色部分提示用户在当前组图片的浏览进度，当浏览第一张时，浏览进度条不包括变色部分，当浏览第二张时，由浏览进度条左边开始按照比例产生变色部分，变色比例为1/(Q-1)，其中，Q为当前组图片的总页数。

例如，本实施例中以当前组图片共有7张为例进行说明，则如图4所示，将浏览进度条进行6等分，每当用户向后浏览一张图片时，变色部分的比例增加1/6。

202、当用户切换图片后，获取用户进行切换后得到的当前页的页码；

需要说明的是，用户切换图片具体包括：

用户选择上一张或下一张图片。

在本实施例中，如图5所示，用户通过在手机屏幕上向左滑动以浏览下一张图片，其中，也可通过点击第一标记进行浏览下一张图片，例如图6为切换图片后浏览第二张图片时的效果。

需要说明的是，当用户切换图片后，且当前页不是当前组图片中的最后一页时，如图6所示，本方法还包括：

在当前页的图片的左下方显示第二标记；

其中，第二标记用于提示用户浏览上一张图片，还可用于在被用户点击后滚动显示到上一张图片。

另外，当用户切换图片后，且当前页为当前组图片中的最后一页时，如图7所示，方法还包括：

在最后一页的图片的左下方显示第二标记，其中，此时变色部分占满浏览进度条全部。

203、判断当前页是否为第一页，如果是，执行步骤204，如果不是，执行步骤205；

204、将浏览进度条中的变色部分的比例设置为0；

需要说明的是，当本步骤204执行结束后，如果用户继续切换图片，则返回步骤202。

205、根据当前页的图片的页码和当前页所属的当前组图片的总页数计算变色部分在浏览进度条中所占的变色比例，并根据上述变色比例在浏览进度条中显示变色部分。

在本实施例中，步骤205具体的为：

根据当前页的图片的页码P和当前组图片的总页数Q计算得到变色部分在浏览进度条中所占的变色比例M＝(P-1)/(Q-1)；

其中，P为当前页的图片的页码，Q为当前组图片的总页数，M为变色部分在浏览进度条中所占的变色比例。

需要说明的是，当本步骤205执行结束后，如果用户继续切换图片，则返回步骤202。

本发明实施例提供了一种多图浏览提示方法，通过使用浏览进度条对用户浏览多图时进行提示，每切换一张图片，浏览进度条中的变色部分就会按照计算得出的比例进行变色，使得用户可以很直观的看到图片的总数，并且可以会意到当前的图片大概是第几张，不会受到图片总数的影响，同时也可以很好的过渡横向满屏的图片和下方元素的衔接，不会出现断层现象。

实施例3

如图8所示，本实施例提供了一种多图浏览提示装置，该装置包括：

进度条加载模块301，用于加载浏览进度条；

初始化模块302，用于初始化浏览进度条中的变化部分占浏览进度条的总长度比例为0；

页码获取模块303，用于当用户切换图片后，获取用户进行切换后得到的当前页的图片的页码；

变化模块304，用于根据当前页的图片的页码和当前页所属的当前组图片的总页数计算变化部分在浏览进度条中所占的变化比例，并根据变化比例在浏览进度条中显示变化部分。

进一步地，进度条加载模块301具体用于，当加载所述当前组图片中的第一页图片时，在所述第一页图片的下方显示所述浏览进度条，且所述浏览进度条的长度与图片显示区域的长度相同。

进一步地，上述装置还包括：第一标记显示模块305；

第一标记显示模块305，用于当当前页不是当前组图片中的最后一页时，在当前页的图片的右下方显示第一标记；

其中，第一标记用于提示用户浏览下一张图片。

进一步地，上述装置还包括：第二标记显示模块306；

第二标记显示模块306，用于当当前页不是当前组图片中的第一页时，在当前页的图片的左下方显示第二标记；

其中，第二标记用于提示用户浏览上一张图片。

进一步地，变化模块304具体用于，根据当前页的图片的页码P和当前页所属的当前组图片的总页数Q计算得到变化部分在浏览进度条中所占的变化比例M＝(P-1)/(Q-1)。

本发明实施例提供了一种多图浏览提示装置，通过使用浏览进度条对用户浏览多图时进行提示，每切换一张图片，浏览进度条中的变化部分就会按照计算得出的比例进行变化，使得用户可以很直观的看到图片的总数，并且可以会意到当前的图片大概是第几张，不会受到图片总数的影响，同时也可以很好的过渡横向满屏的图片和下方元素的衔接，不会出现断层现象。

本领域普通技术人员可以理解实现上述实施例的全部或部分步骤可以通过硬件来完成，也可以通过程序来指令相关的硬件完成，所述的程序可以存储于一种计算机可读存储介质中，上述提到的存储介质可以是只读存储器，磁盘或光盘等。

以上所述仅为本发明的较佳实施例，并不用以限制本发明，凡在本发明的精神和原则之内，所作的任何修改、等同替换、改进等，均应包含在本发明的保护范围之内。

Claims (2)

1.一种多图浏览提示方法，其特征在于，应用于终端中横向满屏加载图片，所述方法包括：

当加载当前组图片中的第一页图片时，在所述第一页图片的下方显示浏览进度条，并初始化所述浏览进度条中的变化部分占所述浏览进度条的总长度比例为0；其中，所述浏览进度条的长度与图片显示区域的长度相同；

当用户切换图片后，获取所述用户进行切换后得到的当前页的图片的页码P；

根据所述当前页的图片的页码P和所述当前页所属的当前组图片的总页数Q计算得到所述变化部分在所述浏览进度条中所占的变化比例M＝(P-1)/(Q-1)，并根据所述变化比例M在所述浏览进度条中显示所述变化部分；其中，所述变化部分为在所述浏览进度条上进行显示并且相对于所述浏览进度条的显示效果具有变化且连续的部分，所述变化部分可区别于所述浏览进度条部分；

当所述当前页不是所述当前组图片中的最后一页时，在所述当前页的图片的右下方显示第一标记；其中，所述第一标记用于提示所述用户浏览下一张图片，还用于在被所述用户点击后滚动显示到下一张图片；

当所述当前页不是所述当前组图片中的第一页时，在所述当前页的图片的左下方显示第二标记；其中，所述第二标记用于提示所述用户浏览上一张图片，还用于在被所述用户点击后滚动显示到上一张图片。

2.一种多图浏览提示装置，其特征在于，应用于终端中横向满屏加载图片，所述装置包括：

进度条加载模块，用于当加载当前组图片中的第一页图片时，在所述第一页图片的下方显示浏览进度条；其中，所述浏览进度条的长度与图片显示区域的长度相同；

初始化模块，用于初始化所述浏览进度条中的变化部分占所述浏览进度条的总长度比例为0；

页码获取模块，用于当用户切换图片后，获取所述用户进行切换后得到的当前页的图片的页码P；

变化模块，用于根据所述当前页的图片的页码P和所述当前页所属的当前组图片的总页数Q计算得到所述变化部分在所述浏览进度条中所占的变化比例M＝(P-1)/(Q-1)，并根据所述变化比例M在所述浏览进度条中显示所述变化部分；其中，所述变化部分为在所述浏览进度条上进行显示并且相对于所述浏览进度条的显示效果具有变化且连续的部分，所述变化部分可区别于所述浏览进度条部分；

第一标记显示模块，用于当所述当前页不是所述当前组图片中的最后一页时，在所述当前页的图片的右下方显示第一标记；其中，所述第一标记用于提示所述用户浏览下一张图片，还用于在被用户点击后滚动显示到下一张图片；

第二标记显示模块，用于当所述当前页不是所述当前组图片中的第一页时，在所述当前页的图片的左下方显示第二标记；其中，所述第二标记用于提示所述用户浏览上一张图片，还用于在被用户点击后滚动显示到上一张图片。