一种图片显示方法及装置技术领域
本申请涉及图文显示领域，尤其涉及一种图片显示方法及装置。
背景技术
当用户终端从服务器端下载图文混排的文档时，由于图片占用字节数比文
字占用字节数大很多，因此，下载文字部分所用时长比下载图片部分所用时长
短很多，这样就导致文档中的文字部分被先下载下来，图片部分被后下载下来。
当将文档中的文字部分先下载下来之后，会按照文字之间的位置关系，先
显示文档中的文字部分。当将文档中的图片部分下载下来之后，再将图片部分
插入文字部分，这时就需要对文字部分的内容进行调整。比如，在一页的第二
行文字和第三行文字之间插入图片，则需要将第三行以及后续的文字下移，如
此就会导致显示界面出现抖动，用户体验较差。
可见，当下载图文混排的文档时，由于下载文字部分所用时长与下载图片
部分所用时长不一致，使得图片和文字无法同步显示，当向先显示的文字中插
入后显示的图片时，会出现显示界面抖动的问题。
发明内容
本申请实施例提供一种图片显示方法及装置，用以解决由于下载文字部分
所用时长与下载图片部分所用时长不一致，导致出现显示界面抖动的问题。
本申请实施例提供一种图片显示方法，包括：
在需要下载包含图片的文档时，请求获取所述文档中图片的图片尺寸信
息；所述图片尺寸信息包括所述图片的宽度和高度；
根据所述图片的图片尺寸信息和显示屏幕的大小，生成所述图片对应的占
位符；
在下载完所述图片之前，在所述显示屏幕中显示所述图片的位置显示生成
的所述占位符；
在下载完所述图片后，将所述显示屏幕上显示的所述占位符替换为下载后
的图片。
可选地，根据所述图片的图片尺寸信息和显示屏幕的大小，生成所述图片
对应的占位符，包括：
根据所述显示屏幕的大小和所述文档的页面大小，确定显示所述文档时的
缩放比例；
根据所述图片的图片尺寸信息和显示所述文档时的缩放比例，确定所述图
片对应的占位符大小；
根据确定的占位符大小，生成所述图片对应的占位符。
可选地，在所述显示屏幕中显示所述图片的位置显示生成的所述占位符，
包括：
根据所述文档的排版信息，确定所述图片在所述文档中的位置信息；
根据所述图片在所述文档中的位置信息，在所述显示屏幕中显示生成的所
述占位符。
可选地，所述方法还包括：
若未获取到所述图片的图片尺寸信息，则根据预设的占位符大小，生成所
述图片对应的占位符。
可选地，在所述显示屏幕中显示所述图片的位置显示生成的所述占位符之
后，下载完所述图片之前，还包括：
在所述占位符的位置，显示并更新所述图片的下载进度。
本申请实施例提供一种图片显示装置，包括：
获取模块，用于在需要下载包含图片的文档时，请求获取所述文档中图片
的图片尺寸信息；所述图片尺寸信息包括所述图片的宽度和高度；
生成模块，用于根据所述获取模块获取的所述图片的图片尺寸信息和显示
屏幕的大小，生成所述图片对应的占位符；
显示模块，用于在下载完所述图片之前，在所述显示屏幕中显示所述图片
的位置显示所述生成模块生成的所述占位符；
替换模块，用于在下载完所述图片后，将所述显示屏幕上显示的所述占位
符替换为下载后的图片。
本申请实施例在下载完图片之前，在显示屏幕中显示图片的位置先显示生
成的占位符，在下载完图片之后，再将显示的占位符替换为下载后的图片。本
申请实施例中根据图片的图片尺寸信息和显示屏幕的大小，生成该图片对应的
占位符，由于采用了与图片尺寸相符的占位符为图片占位，从而可以在将文档
中的文字部分下载下来之后，就按照其在文档中的原本位置进行显示，避免了
在将文档中的图片部分下载下来之后再移动文字部分的位置，从而解决了显示
界面抖动的问题。
附图说明
图1为本申请实施例一提供的图片显示方法流程图；
图2为本申请实施例二提供的图片显示方法流程图；
图3为本申请实施例提供的图片显示装置结构示意图。
具体实施方式
本申请实施例的基本思想是在下载完文档中的图片之前，首先根据图片的
图片尺寸信息和显示屏幕的大小，生成占位符为图片占位，也即，在下载完图
片之前，在显示屏幕中显示图片的位置先显示生成的占位符，在下载完图片之
后，再将显示的占位符替换为下载后的图片。由于采用了与图片尺寸相符的占
位符为图片占位，从而可以在将文档中的文字部分下载下来之后，就按照其在
文档中的原本位置进行显示，避免了在将文档中的图片部分下载下来之后再移
动文字部分的位置，从而解决了显示界面抖动的问题。
下面结合说明书附图对本申请实施例作进一步详细描述。
如图1所示，为本申请实施例一提供的图片显示方法流程图，包括以下步
骤：
S101：在需要下载包含图片的文档时，请求获取所述文档中图片的图片尺
寸信息；所述图片尺寸信息包括所述图片的宽度和高度。
本申请实施例的执行主体为下载文档的客户端。所述文档可以是任意格式
的、具有图文混排内容的文件。
该步骤中，客户端在需要从服务器端下载图文混排的文档时，可以首先向
服务器端请求获取文档中图片的头文件，其中包含图片尺寸信息，这里的图片
尺寸信息即为该图片的宽度和高度。在具体实施过程中，文档中可能会包含多
个图片，这时就需要针对每个图片执行下述步骤。
S102：根据所述图片的图片尺寸信息和显示屏幕的大小，生成所述图片对
应的占位符。
该步骤中，可以根据显示屏幕的大小，确定将所述图片进行缩放后的显示
尺寸(比如确定将图片按照显示屏幕大小的80％的尺寸进行缩放)，最后，生
成与该图片缩放后的显示尺寸相符的占位符。这里，所述占位符为所述图片的
缩略图，比如可以是一个文本框等。
在具体实施过程中，所述图片的缩放比例也可以是根据显示屏幕的大小和
整个文档的页面大小设定的，具体地，
S102中，根据所述图片的图片尺寸信息和显示屏幕的大小，生成所述图片
对应的占位符，包括：
根据所述显示屏幕的大小和所述文档的页面大小，确定显示所述文档时的
缩放比例；
根据所述图片的图片尺寸信息和显示所述文档时的缩放比例，确定所述图
片对应的占位符大小；
根据确定的占位符大小，生成所述图片对应的占位符。
在上述步骤中，可以首先根据所述显示屏幕的大小，确定在显示屏幕中适
合显示的页面大小；再根据所述文档的页面大小，确定对所述文档的缩放比例，
使得缩放后的文档大小等于确定的在显示屏幕中适合显示的页面大小。根据确
定的缩放比例，确定对所述图片进行缩放后的图片大小，将确定的缩放后的图
片大小作为占位符大小，生成该图片对应的占位符。
S103：在下载完所述图片之前，在所述显示屏幕中显示所述图片的位置显
示生成的所述占位符。
S102之后，也即生成所述图片对应的占位符之后，可以下载文档中的文字
部分和图片部分，由于图片占用字节数比文字占用字节数多，文字部分首先被
下载下来。该步骤中，在下载完所述图片之前，可以首先将文字和为所述图片
占位的占位符显示在显示屏幕中。
在具体实施过程中，可以按照以下方式在所述显示屏幕中显示所述图片的
位置显示生成的所述占位符：
根据所述文档的排版信息，确定所述图片在所述文档中的位置信息；
根据所述图片在所述文档中的位置信息，在所述显示屏幕中显示生成的所
述占位符。
在上述步骤中，首先根据文档的排版信息，也即图片和文字之间的位置关
系信息，确定所述图片在所述文档中的相对位置。比如，根据文档的排版信息
确定所述图片位于所述文档首页第二行文字和第三行文字之间，则在将所述占
位符安排显示在该文档首页前两行文字之后。
S104：在下载完所述图片后，将所述显示屏幕上显示的占位符替换为下载
后的图片。
该步骤中，在下载完该图片后，将该图片对应的显示屏幕上显示的占位符
替换为该图片。
优选地，S103之后，S104之前，还包括：在所述占位符的位置，显示并
更新所述图片的下载进度。
在具体实施过程中，为了提升用户体验，可以在显示的占位符的位置显示
该占位符对应的图片的下载进度。具体地，可以按照设定的更新步长(比如
1％)，连续更新下载进度。
在实际实施过程中，有可能会出现无法向服务器端请求获取到图片的头文
件(图片的尺寸信息)的情况，在这种情况下，可以根据预设的占位符大小，
生成所述图片对应的占位符。具体可参见下述实施例二的实施，实施例二中与
实施例一重复之处，不再详述。
如图2所示，为本申请实施例二提供的图片显示方法流程图，包括以下步
骤：
S201：客户端在需要下载包含图片的文档时，向服务器端请求获取所述文
档中图片的图片尺寸信息，该图片尺寸信息包括图片的宽度和高度。
S202：若未获取到所述图片的图片尺寸信息，则根据预设的占位符大小，
生成所述图片对应的占位符。
该步骤中，若没有在服务器端获取到所述图片的图片尺寸信息，也即服务
器端不提供图片的文件头信息(图片的尺寸信息)，则可以根据预设的占位符
大小，生成该图片对应的占位符。预设的占位符大小可以是根据显示屏幕的大
小设置的。
S203：若获取到所述图片的图片尺寸信息，则根据所述图片的图片尺寸信
息和显示屏幕的大小，生成所述图片对应的占位符。
S204：客户端向服务器端请求下载所述文档中的图片和文字。
在具体实施过程中，服务器端可以将为客户端提供图片尺寸信息的统一资
源定位符(UniformResourceLocator，URL)和提供文档内容(包括图片和文
字)的URL统一为相同的URL，客户端可以分别采用不同的调用方式获取该
URL提供的图片尺寸信息和文档内容，比如采用doHead方式获取图片尺寸信
息，采用doPost方式获取文档内容。
S205：若客户端在下载完所述文档中的文字时还未下载完所述文档中的图
片，则在所述显示屏幕中显示所述文字，并在显示所述图片的位置显示生成的
该图片对应的占位符。
S206：客户端在下载完所述图片后，将所述显示屏幕上显示的占位符替换
为下载后的图片。
基于同一发明构思，本申请实施例中还提供了一种与图片显示方法对应的
图片显示装置，由于该装置解决问题的原理与本申请实施例图片显示方法相
似，因此该装置的实施可以参见方法的实施，重复之处不再赘述。
如图3所示，为本申请实施例提供的图片显示装置结构示意图，包括：
获取模块31，用于在需要下载包含图片的文档时，请求获取所述文档中图
片的图片尺寸信息；所述图片尺寸信息包括所述图片的宽度和高度；
生成模块32，用于根据所述获取模块31获取的所述图片的图片尺寸信息
和显示屏幕的大小，生成所述图片对应的占位符；
显示模块33，用于在下载完所述图片之前，在所述显示屏幕中显示所述图
片的位置显示生成模块32生成的所述占位符；
替换模块34，用于在下载完所述图片后，将所述显示屏幕上显示的所述占
位符替换为下载后的图片。
可选地，所述生成模块32具体用于：
根据所述显示屏幕的大小和所述文档的页面大小，确定显示所述文档时的
缩放比例；根据所述图片的图片尺寸信息和显示所述文档时的缩放比例，确定
所述图片对应的占位符大小；根据确定的占位符大小，生成所述图片对应的占
位符。
可选地，所述显示模块33具体用于：
根据所述文档的排版信息，确定所述图片在所述文档中的位置信息；根据
所述图片在所述文档中的位置信息，在所述显示屏幕中显示生成的所述占位
符。
可选地，所述生成模块32还用于：
若未获取到所述图片的图片尺寸信息，则根据预设的占位符大小，生成所
述图片对应的占位符。
可选地，所述显示模块33还用于，在所述显示屏幕中显示所述图片的位
置显示生成的所述占位符之后，下载完所述图片之前，在所述占位符的位置，
显示并更新所述图片的下载进度。
本领域内的技术人员应明白，本申请的实施例可提供为方法、系统、或计
算机程序产品。因此，本申请可采用完全硬件实施例、完全软件实施例、或结
合软件和硬件方面的实施例的形式。而且，本申请可采用在一个或多个其中包
含有计算机可用程序代码的计算机可用存储介质(包括但不限于磁盘存储器、
CD-ROM、光学存储器等)上实施的计算机程序产品的形式。
本申请是参照根据本申请实施例的方法、装置(系统)、和计算机程序产
品的流程图和/或方框图来描述的。应理解可由计算机程序指令实现流程图和
/或方框图中的每一流程和/或方框、以及流程图和/或方框图中的流程和/
或方框的结合。可提供这些计算机程序指令到通用计算机、专用计算机、嵌入
式处理机或其他可编程数据处理设备的处理器以产生一个机器，使得通过计算
机或其他可编程数据处理设备的处理器执行的指令产生用于实现在流程图一
个流程或多个流程和/或方框图一个方框或多个方框中指定的功能的装置。
这些计算机程序指令也可存储在能引导计算机或其他可编程数据处理设
备以特定方式工作的计算机可读存储器中，使得存储在该计算机可读存储器中
的指令产生包括指令装置的制造品，该指令装置实现在流程图一个流程或多个
流程和/或方框图一个方框或多个方框中指定的功能。
这些计算机程序指令也可装载到计算机或其他可编程数据处理设备上，使
得在计算机或其他可编程设备上执行一系列操作步骤以产生计算机实现的处
理，从而在计算机或其他可编程设备上执行的指令提供用于实现在流程图一个
流程或多个流程和/或方框图一个方框或多个方框中指定的功能的步骤。
尽管已描述了本申请的优选实施例，但本领域内的技术人员一旦得知了基
本创造性概念，则可对这些实施例作出另外的变更和修改。所以，所附权利要
求意欲解释为包括优选实施例以及落入本申请范围的所有变更和修改。
显然，本领域的技术人员可以对本申请进行各种改动和变型而不脱离本申
请的精神和范围。这样，倘若本申请的这些修改和变型属于本申请权利要求及
其等同技术的范围之内，则本申请也意图包含这些改动和变型在内。