CN111857481A - 图像显示方法、设备及存储介质 - Google Patents

Abstract

本公开提供一种图像显示方法、设备及存储介质，其中，图像显示方法，包括：将第一图像容器显示于用户界面中，其中，所述第一图像容器中加载有第一图像；响应于检测到图像切换指令，根据所述切换指令所指示的第一方向将第二图像添加至第二图像容器，其中，所述第二图像是在预设播放模式中，基于所述切换指令将在所述第一图像之后播放的图像，所述第二图像容器位于所述第一图像容器的第二方向，所述第二方向与所述第一方向相反；将所述第二图像显示于用户界面中，实现了可仅通过两个图像容器即可实现图像的切换，避免了由于图像容器预加载图像而导致过多占用内存的问题，增强了图像播放的连续性。

Description

图像显示方法、设备及存储介质

技术领域

本公开涉及图像处理技术领域，尤其涉及一种图像显示方法、设备及存储介质。

背景技术

目前，一些图像浏览器通过ImageView(图像视图，下文也称图像容器)来显示图像，ImageView也常用于图片渲染调色及图片缩放剪裁等，ImageView可以理解为一个视图或控件。在显示图像之前，需将所有待显示图像一次性预加载到多个ImageView中，而图片浏览器在预加载多张图片时会造成内存飙升，在随机播放使用过渡动画时会有闪屏的问题。

发明内容

有鉴于此，本公开提供一种图像显示方法、设备及存储介质，以解决相关技术中图片浏览器预加载多张图片会造成短时间内占用较大内存，导致闪屏的问题。

根据本公开的第一个方面，提供了一种图像显示方法，包括：将第一图像容器显示于用户界面中，其中，所述第一图像容器中加载有第一图像；响应于检测到图像切换指令，根据所述切换指令所指示的第一方向将第二图像添加至第二图像容器，其中，所述第二图像是在预设播放模式中，基于所述切换指令将在所述第一图像之后播放的图像，所述第二图像容器位于所述第一图像容器的第二方向，所述第二方向与所述第一方向相反；将所述第二图像显示于用户界面中。

可选的，所述方法还包括：在通过处于用户界面中的第一图像容器显示第一图像之前，在滑动容器中添加了第一图像容器，其中，所述滑动容器用于切换用户界面当前呈现的视图；将所述第二图像显示于用户界面中，包括：响应于所述第二图像容器被移动于所述用户界面，将所述第二图像的地址信息发送至所述第一图像容器；调换所述第一图像容器以及所述第二图像容器的位置，以通过所述第一图像容器在所述用户界面中显示所述第二图像。

可选的，所述方法还包括：在所述第一图像容器中显示所述第二图像之后，从所述滑动容器中删除所述第二图像容器。

可选的，所述方法还包括：在通过处于用户界面中的第一图像容器显示第一图像之前，在滑动容器中添加了第一图像容器，其中，所述滑动容器用于切换用户界面当前呈现的视图；将所述第二图像显示于用户界面中，包括：响应于所述第二图像容器被移动至所述用户界面中，通过所述第二图像容器显示所述第二图像。

可选的，所述方法还包括：在通过所述第二图像容器显示所述第二图像之后，从所述滑动容器中删除所述第一图像容器。

可选的，所述方法还包括：在基于所述切换指令将第二图像添加至第二图像容器之前，在所述第一图像容器的所述第二方向上增加一个所述第二图像容器。

可选的，所述方法还包括：在通过处于用户界面中的第一图像容器显示第一图像之前，在滑动容器中添加所述第一图像容器，处于第一图像容器的所述第二方向的第二图像容器，以及处于第一图像容器的所述第一方向的第三图像容器，所述第二图像容器中加载有所述第二图像；将所述第二图像显示于用户界面中，包括：响应于所述第二图像容器移动至所述用户界面中，将所述第一图像容器中的图像替换为所述第二图像；替换所述第一图像容器与所述第二图像容器的位置，以在所述第一图像容器中显示所述第二图像；根据所述预设图像播放规则替换所述第二图像容器以及所述第三图像容器中的图像。

可选的，所述图像切换指令包括：响应于用户操作，生成的由所述第一图像切换至所述第二图像的指令，或者，根据自动播放模式，生成的由所述第一图像切换至所述第二图像的指令。

根据本公开的第二个方面，提供了一种电子设备，包括存储器、处理器及存储在存储器上并可在处理器上运行的计算机程序，所述处理器执行所述程序时实现如上述任意一种图像显示方法。

根据本公开的第三个方面，提供了一种非暂态计算机可读存储介质，所述非暂态计算机可读存储介质存储计算机指令，所述计算机指令用于使所述计算机执行上述任意一种图像显示方法。

从上面所述可以看出，本公开一个或多个实施例中的图像显示方法，根据图像切换指令，将待显示于用户界面上的第二图像添加至位于图像切换指令所指示的第一图像容器的第一方向的第二图像容器中，以及将第二图像展示于用户界面中，实现了可仅通过两个图像容器即可实现图像的切换，避免了由于图像容器预加载图像而导致过多占用内存的问题，增强了图像播放的连续性。

附图说明

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

图1是根据本公开一个或多个实施例示出的一种图像显示方法的流程图；

图2是根据本公开一个或多个实施例示出的图像容器的示意图；

图3是根据本公开一个或多个实施例示出的图像容器的示意图；

图4是根据本公开一个或多个实施例示出的一种电子设备的框图。

具体实施方式

为使本公开的目的、技术方案和优点更加清楚明白，以下结合具体实施例，并参照附图，对本公开进一步详细说明。

需要说明的是，除非另外定义，本公开实施例使用的技术术语或者科学术语应当为本公开所属领域内具有一般技能的人士所理解的通常意义。本公开中使用的“第一”、“第二”以及类似的词语并不表示任何顺序、数量或者重要性，而只是用来区分不同的组成部分。

图1是本公开一个或多个实施例示出的一种图像显示方法的流程图，该方法可由终端设备执行，该终端设备例如可包括用于显示图像的显示屏幕，该终端设备中例如安装有图像浏览器，使得终端设备可以通过图像浏览器播放图像，如图1所示，该方法包括：

步骤101：将第一图像容器显示于用户界面中，其中，所述第一图像容器中加载有第一图像；

可选地，第一图像容器例如可以是ImageView，ImageView是一个UI(UserInterface，用户界面)基础控件，是用于显示图像的一个视图或控件。在将第一图像容器显示于用户界面中时，该第一图像容器作为展示容器，用于展示图像，此时，该第一图像容器作为显示主页面，可供用户进行交互操作，例如，用户通过在终端设备的显示屏幕上进行滑动操作，可切换用户界面上当前显示的图像。

步骤102：响应于检测到图像切换指令，根据所述图像切换指令所指示的第一方向将第二图像添加至第二图像容器，其中，所述第二图像是在预设播放模式中，基于所述图像切换指令将在所述第一图像之后播放的图像，所述第二图像容器位于所述第一图像容器的第二方向，所述第二方向与所述第一方向相反；其中，播放图像指通过ImageView将图像显示于显示屏幕中。

可选的，检测到的图像切换指令例如可以是响应于用户在显示屏幕上的滑动操作而生成的图像切换指令，或者可以是响应于处于自动播放图像模式下，自动播放图像过程中生成的图像切换指令。其中，图像切换指令所指示方向指图像切换指令中所指示的由用户界面上当前显示的图像切换至待显示在用户界面上的图像的方向，例如，对于移动终端来说，用户可以通过在显示屏幕上向左滑动、向右滑动、向上滑动或向下滑动，或者向任意方向滑动来选择播放当前图像的下一张图像，或上一张图像。其中，在本实施例中，假设用户向左滑动对应于播放当前图像的下一张图像，则基于用户向左滑动这一操作，所生成的切换指令所指示的切换方向即由用户界面上当前显示的图像指向该图像的下一张图像。

可选的，预设播放模式例如可以包括顺序播放文件夹中的图像，或按照图像存储的时间顺序播放文件夹中的图像，或者，按照拍摄图像的地理位置播放文件夹中的图像，或者，按照图像的分类来播放文件夹中图像，又或者，还可按照用户预先设置好的播放顺序来播放文件夹中的图像。

步骤103：将所述第二图像显示于用户界面中。

可选的，可通过第一图像容器将第二图像显示于用户界面中，或者，通过第二图像容器将第二图像显示于用户界面中。例如，通过第一图像容器将第二图像显示于用户界面中可包括：

将所述第二图像显示于用户界面中，可包括：响应于第二图像容器被移动于用户界面中，将第二图像的地址信息发送至第一图像容器；调换第一图像容器以及第二图像容器的位置，使第一图像容器处于用户界面中，从而通过第一图像容器在用户界面中显示所述第二图像。

例如，通过第二图像容器将第二图像显示于用户界面中可包括：

响应于第二图像容器被移动至所述用户界面中，通过所述第二图像容器显示所述第二图像。

本公开一个或多个实施例中的图像显示方法，根据图像切换指令，将待显示于用户界面上的第二图像添加至位于图像切换指令所指示的第一图像容器的第一方向的第二图像容器中，以及将第二图像展示于用户界面中，实现了可仅通过两个图像容器即可实现图像的切换，避免了由于图像容器预加载图像而导致过多占用内存的问题，增强了图像播放的连续性。

在本公开的一个或多个实施例中，上述图像显示方法还可包括：在通过处于用户界面中的第一图像容器显示第一图像之前，在滑动容器中添加了第一图像容器，其中，所述滑动容器用于切换用户界面当前呈现的视图，滑动容器例如可以是viewPager，viewPager为视图翻页工具，通过创建adapter(适配器)可在viewPager中填充多个ImageView，当用户在显示屏幕上左右滑动时，可通过viewPager切换显示屏幕中显示的不同的视图。其中，viewPager可以是***提供的，或者还可以是自定义的。将所述第二图像显示于用户界面中，可包括：

响应于所述第二图像容器被移动于所述用户界面中，将所述第二图像的地址信息发送至所述第一图像容器；在一个例子中，以图2所示为例，第二图像容器是在第一图像容器右侧的图像容器，那么，响应于用户在显示屏幕上进行的向左滑动的操作(图2中箭头所示的方向表示向左滑动的方向)，第二图像容器被移动于用户界面中。

调换所述第一图像容器以及所述第二图像容器的位置，以通过所述第一图像容器在所述用户界面中显示所述第二图像。此处，在调换第一图像容器和第二图像容器的位置后，第一图像容器又显示于用户界面中，而，由于之前已经将第二图像的地址信息发送给第一图像容器，故，当第一图像容器显示于用户界面时，将第二图像呈现于用户界面，从而实现了根据图像切换指令，将显示屏幕中显示的图像由第一图像切换至第二图像的目的。

在本公开的一个或多个实施例中，上述图像显示方法还可包括：

在所述第一图像容器中显示所述第二图像之后，从所述滑动容器中删除所述第二图像容器。即，当完全切换到由第一图像容器展示第二图像的状态时，此时第一图像容器以及第二图像容器处于非活动状态，这时可以在滑动容器中删除第二图像容器，从而使得第一图像容器以及第二图像容器处于非活动状态时，仅存在一个图像容器，从而可进一步降低图像容器对***内存的占用。

在本公开的一个或多个实施例中，上述图像显示方法还可包括：在通过处于用户界面中的第一图像容器显示第一图像之前，在滑动容器中添加了第一图像容器，其中，所述滑动容器用于切换用户界面当前呈现的视图；将所述第二图像显示于用户界面中，可包括：响应于所述第二图像容器被移动至所述用户界面中，通过所述第二图像容器显示所述第二图像。在一个例子中，假设第二图像容器在第一图像容器右侧，那么，响应于用户向左滑动第一图像容器，第二图像容器被移动于用户界面中。当第二图像容器被移动于用户界面中时，由于该第二图像容器在之前已经加载了第二图像，故，第二图像容器可直接将第二图像显示于用户界面中。

在本公开的一个或多个实施例中，上述图像显示方法还可包括：

在通过所述第二图像容器显示所述第二图像之后，从所述滑动容器中删除所述第一图像容器。即，当完全切换到由第二图像容器展示第二图像的状态时，此时第一图像容器以及第二图像容器处于非活动状态，这时可以在滑动容器中删除第二图像容器，从而使得第一图像容器以及第二图像容器处于非活动状态时，仅存在一个图像容器，即使在图像容器处于活动状态时，滑动容器中也仅存在两个图像容器，在此基础上，可进一步降低图像容器对***内存的占用。

在本公开的一个或多个实施例中，上述图像显示方法还可包括：

在基于所述切换指令将第二图像添加至第二图像容器之前，在所述第一图像容器的所述第二方向上增加一个所述第二图像容器。例如，在检测到用户手势有一个左滑的动作时，在第一图像容器的右侧添加一个第二图像容器作为临时图像容器，将第二图像填充至第二图像容器中，基于此，用户继续左滑即将看到由第二图像容器展示的第二图像。此处，在检测到图像切换指令，以及基于该切换指令将第二图像添加至第二图像容器之前，根据图像切换指令中所指示的方向，临时增加用于加载待显示于用户界面的第二图像，可使得图像容器在处于非活动状态时，滑动容器中仅存在一个图像容器，即使在图像容器处于活动状态时，滑动容器中也仅存在两个图像容器，在此基础上，可以降低图像容器对内存的占用。

在本公开的一个或多个实施例中，上述图像显示方法还可包括：在通过处于用户界面中的第一图像容器显示第一图像之前，在滑动容器中添加所述第一图像容器，处于第一图像容器的所述第二方向的第二图像容器，以及处于第一图像容器的所述第一方向的第三图像容器，所述第二图像容器中加载有所述第二图像；例如，如图3所示，第一图像容器作为显示主页面，图3中虚线框中的主页面为终端设备的显示屏幕上显示的内容，第二图像容器位于第一图像容器右侧，第三图像容器位于第一图像容器左侧，第二图像容器以及第三图像容器作为辅助过渡页面。从图像列表中取出三个要展示的图像放入以上三个容器中，其中，将当前要展示的第一图像放到第一图像容器中，然后利用滑动容器的setCurrentItem(1)方法将第一图像容器显示在屏幕当中。基于此，将所述第二图像显示于用户界面中，可包括：响应于所述第二图像容器移动至所述用户界面中，将所述第一图像容器中的图像替换为所述第二图像；替换所述第一图像容器与所述第二图像容器的位置，以在所述第一图像容器中显示所述第二图像；根据所述预设图像播放规则替换所述第二图像容器以及所述第三图像容器中的图像。仍以图3所示为例，当检测到用户在显示屏幕上向左滑动(其中，图3中所示的箭头方向表示用户向左滑动的方向)的操作时，滑动容器将第二图像容器显示在用户界面当中，随后将第一图像容器中的图像替换为第二图像，然后利用滑动容器的setCurrentItem(1)方法将用户界面中显示的图像容器替换第一图像容器，替换之后几毫秒，利用视觉暂留的原理，用户不会感知到用户界面中的图像容器发生的变化，随后再根据预设的或默认的图像播放顺序将两个第二图像容器以及第三图像容器中的图像进行替换。

在图3所示的例子中，通过预先在一个滑动容器中添加三个图像容器，将其中一个图像容器作为显示主页面，其他两个图像容器作为辅助过渡页面，当用户进行滑动操作后，将作为主页面的图像容器内部的图像替换为滑动后要展现的图像，然后将主页面图像容器移动到屏幕当中，再替换辅助页面的图像，进而实现图像的无缝切换。但该例子中，是使用三个图像容器利用视觉暂留实现图像的无缝切换，虽然***内存在很大程度上有所节省，但是每次通过显示屏幕仅展示处于中间位置的图像容器中的图像，其他两个辅助容器一直停留在不可见位置，但这两个图像容器还是占用一定的***内存。所以，上述仅使用一个或两个图像容器的例子可进一步减少对***内存的占用。

在本公开的一个或多个实施例中，所述图像切换指令可包括：响应于用户操作，生成的由所述第一图像切换至所述第二图像的指令，或者，根据自动播放模式，生成的由所述第一图像切换至所述第二图像的指令。

本公开一个或多个实施例还提供了一种电子设备，包括存储器、处理器及存储在存储器上并可在处理器上运行的计算机程序，所述处理器执行所述程序时实现上述任意一种图像显示方法。

本公开一个或多个实施例还提供了一种非暂态计算机可读存储介质，所述非暂态计算机可读存储介质存储计算机指令，所述计算机指令用于使所述计算机执行上述任意一种图像显示方法。

图4示出了本实施例所提供的一种更为具体的电子设备硬件结构示意图，该设备可以包括：处理器1010、存储器1020、输入/输出接口1030、通信接口1040和总线1050。其中处理器1010、存储器1020、输入/输出接口1030和通信接口1040通过总线1050实现彼此之间在设备内部的通信连接。

处理器1010可以采用通用的CPU(Central Processing Unit，中央处理器)、微处理器、应用专用集成电路(Application Specific Integrated Circuit，ASIC)、或者一个或多个集成电路等方式实现，用于执行相关程序，以实现本说明书实施例所提供的技术方案。

存储器1020可以采用ROM(Read Only Memory，只读存储器)、RAM(Random AccessMemory，随机存取存储器)、静态存储设备，动态存储设备等形式实现。存储器1020可以存储操作***和其他应用程序，在通过软件或者固件来实现本说明书实施例所提供的技术方案时，相关的程序代码保存在存储器1020中，并由处理器1010来调用执行。

输入/输出接口1030用于连接输入/输出模块，以实现信息输入及输出。输入输出/模块可以作为组件配置在设备中(图中未示出)，也可以外接于设备以提供相应功能。其中输入设备可以包括键盘、鼠标、触摸屏、麦克风、各类传感器等，输出设备可以包括显示器、扬声器、振动器、指示灯等。

通信接口1040用于连接通信模块(图中未示出)，以实现本设备与其他设备的通信交互。其中通信模块可以通过有线方式(例如USB、网线等)实现通信，也可以通过无线方式(例如移动网络、WIFI、蓝牙等)实现通信。

总线1050包括一通路，在设备的各个组件(例如处理器1010、存储器1020、输入/输出接口1030和通信接口1040)之间传输信息。

需要说明的是，尽管上述设备仅示出了处理器1010、存储器1020、输入/输出接口1030、通信接口1040以及总线1050，但是在具体实施过程中，该设备还可以包括实现正常运行所必需的其他组件。此外，本领域的技术人员可以理解的是，上述设备中也可以仅包含实现本说明书实施例方案所必需的组件，而不必包含图中所示的全部组件。

本实施例的计算机可读介质包括永久性和非永久性、可移动和非可移动媒体可以由任何方法或技术来实现信息存储。信息可以是计算机可读指令、数据结构、程序的模块或其他数据。计算机的存储介质的例子包括，但不限于相变内存(PRAM)、静态随机存取存储器(SRAM)、动态随机存取存储器(DRAM)、其他类型的随机存取存储器(RAM)、只读存储器(ROM)、电可擦除可编程只读存储器(EEPROM)、快闪记忆体或其他内存技术、只读光盘只读存储器(CD-ROM)、数字多功能光盘(DVD)或其他光学存储、磁盒式磁带，磁带磁磁盘存储或其他磁性存储设备或任何其他非传输介质，可用于存储可以被计算设备访问的信息。

上述对本说明书特定实施例进行了描述。其它实施例在所附权利要求书的范围内。在一些情况下，在权利要求书中记载的动作或步骤可以按照不同于实施例中的顺序来执行并且仍然可以实现期望的结果。另外，在附图中描绘的过程不一定要求示出的特定顺序或者连续顺序才能实现期望的结果。在某些实施方式中，多任务处理和并行处理也是可以的或者可能是有利的。

所属领域的普通技术人员应当理解：以上任何实施例的讨论仅为示例性的，并非旨在暗示本公开的范围(包括权利要求)被限于这些例子；在本公开的思路下，以上实施例或者不同实施例中的技术特征之间也可以进行组合，步骤可以以任意顺序实现，并存在如上所述的本公开的不同方面的许多其它变化，为了简明它们没有在细节中提供。

另外，为简化说明和讨论，并且为了不会使本公开难以理解，在所提供的附图中可以示出或可以不示出与集成电路(IC)芯片和其它部件的公知的电源/接地连接。此外，可以以框图的形式示出装置，以便避免使本公开难以理解，并且这也考虑了以下事实，即关于这些框图装置的实施方式的细节是高度取决于将要实施本公开的平台的(即，这些细节应当完全处于本领域技术人员的理解范围内)。在阐述了具体细节(例如，电路)以描述本公开的示例性实施例的情况下，对本领域技术人员来说显而易见的是，可以在没有这些具体细节的情况下或者这些具体细节有变化的情况下实施本公开。因此，这些描述应被认为是说明性的而不是限制性的。

尽管已经结合了本公开的具体实施例对本公开进行了描述，但是根据前面的描述，这些实施例的很多替换、修改和变型对本领域普通技术人员来说将是显而易见的。例如，其它存储器架构(例如，动态RAM(DRAM))可以使用所讨论的实施例。

本公开的实施例旨在涵盖落入所附权利要求的宽泛范围之内的所有这样的替换、修改和变型。因此，凡在本公开的精神和原则之内，所做的任何省略、修改、等同替换、改进等，均应包含在本公开的保护范围之内。

Claims (10)

1.一种图像显示方法，包括：

将第一图像容器显示于用户界面中，其中，所述第一图像容器中加载有第一图像；

响应于检测到图像切换指令，根据所述切换指令所指示的第一方向将第二图像添加至第二图像容器，其中，所述第二图像是在预设播放模式中，基于所述切换指令将在所述第一图像之后播放的图像，所述第二图像容器位于所述第一图像容器的第二方向，所述第二方向与所述第一方向相反；

将所述第二图像显示于用户界面中。

2.根据权利要求1所述的方法，其中，所述方法还包括：

在通过处于用户界面中的第一图像容器显示第一图像之前，在滑动容器中添加了第一图像容器，其中，所述滑动容器用于切换用户界面当前呈现的视图；

将所述第二图像显示于用户界面中，包括：

响应于所述第二图像容器被移动于所述用户界面，将所述第二图像的地址信息发送至所述第一图像容器；

调换所述第一图像容器以及所述第二图像容器的位置，以通过所述第一图像容器在所述用户界面中显示所述第二图像。

3.根据权利要求2所述的方法，其中，所述方法还包括：

在所述第一图像容器中显示所述第二图像之后，从所述滑动容器中删除所述第二图像容器。

4.根据权利要求1所述的方法，其中，所述方法还包括：

在通过处于用户界面中的第一图像容器显示第一图像之前，在滑动容器中添加了第一图像容器，其中，所述滑动容器用于切换用户界面当前呈现的视图；

将所述第二图像显示于用户界面中，包括：

响应于所述第二图像容器被移动至所述用户界面中，通过所述第二图像容器显示所述第二图像。

5.根据权利要求4所述的方法，其中，所述方法还包括：

在通过所述第二图像容器显示所述第二图像之后，从所述滑动容器中删除所述第一图像容器。

6.根据权利要求1至5任一项所述的方法，其中，所述方法还包括：

在基于所述切换指令将第二图像添加至第二图像容器之前，在所述第一图像容器的所述第二方向上增加一个所述第二图像容器。

7.根据权利要求1所述的方法，其中，所述方法还包括：

在通过处于用户界面中的第一图像容器显示第一图像之前，在滑动容器中添加所述第一图像容器，处于第一图像容器的所述第二方向的第二图像容器，以及处于第一图像容器的所述第一方向的第三图像容器，所述第二图像容器中加载有所述第二图像；

将所述第二图像显示于用户界面中，包括：

响应于所述第二图像容器移动至所述用户界面中，将所述第一图像容器中的图像替换为所述第二图像；

替换所述第一图像容器与所述第二图像容器的位置，以在所述第一图像容器中显示所述第二图像；

根据所述预设图像播放规则替换所述第二图像容器以及所述第三图像容器中的图像。

8.根据权利要求1所述的方法，其中，所述图像切换指令包括：

响应于用户操作，生成的由所述第一图像切换至所述第二图像的指令，或者，根据自动播放模式，生成的由所述第一图像切换至所述第二图像的指令。

9.一种电子设备，包括存储器、处理器及存储在存储器上并可在处理器上运行的计算机程序，其特征在于，所述处理器执行所述程序时实现如权利要求1至8任一项所述的图像显示方法。

10.一种非暂态计算机可读存储介质，其特征在于，所述非暂态计算机可读存储介质存储计算机指令，所述计算机指令用于使所述计算机执行权利要求1至8任一项所述的图像显示方法。

Images