一种显示方法、电子设备及计算机可读存储介质与流程

本技术涉及终端，尤其涉及一种显示方法、电子设备及计算机可读存储介质。

背景技术：

1、由于电子设备的显示屏大小是固定的，因此，电子设备的显示空间有限。目前的界面交互设计中，常利用滑动操作实现界面交互，如此，通过滑动操作切换显示屏中显示的内容，可以避免在大小本就有限的显示空间中设置过多的操作控件，从而使电子设备显示的界面更简洁美观。

2、目前，在用户触发滑动操作之后，电子设备在一定延迟时间后才显示相应的画面，存在跟手性不好的问题，影响用户的操作体验。

技术实现思路

1、有鉴于此，本技术提供了一种显示方法、电子设备及计算机可读存储介质，可以在现实图像帧之前预先绘制部分图像，之后，直接基于预先绘制的图像生成要显示的图像，从而提高显示速度。

2、第一方面，本技术提供一种显示方法，应用于电子设备。电子设备中显示有第一图像帧，此时用户可以针对第一图像帧触发滑动操作。响应于该滑动操作，电子设备可以显示第二图像帧和第三图像帧，以实现滑动显示的效果。其中，滑动操作可以用于触发电子设备显示第三图像帧，并且，在电子设备显示第三图像帧之前，电子设备可以显示第一图像帧和第三图像帧之间的插帧，也就是显示第二图像帧。如此，将第二图像帧作为第一图像帧与第三图像帧之间的插帧进行过渡，可以使滑动显示的过程更流畅，并有效消除画面跳跃感，从而提升了用户体验。

3、其中，第二图像帧是基于第四图像帧生成，并且，第四图像帧在接收到滑动操作之前已存储在电子设备中，第四图像帧至少包括第一图像帧以及第一图像内容，第一图像内容为与第一图像帧的图像内容连续的溢出内容。如此，由于第四图像帧在接收到滑动操作之前已存储在电子设备中，因此在显示第二图像帧时，电子设备可以更快地加载和渲染第二图像帧，从而减少了用户的等待时间，提高了图像显示的响应速度。并且，利用已存储的第四图像帧来生成第二图像帧，可以避免重复加载和渲染相同的图像内容，从而优化了电子设备的资源利用率，减轻了电子设备的处理负载。

4、在上述的一些实现方式中，电子设备响应于用户触发的滑动操作进行的滑动显示过程中，第一图像帧与第三图像帧之间的时间间隔较短，用户滑动的速度不会出现过高的情况，所以第一图像帧与第三图像帧之间存在重复的界面元素，因此，可以在第一图像帧与第三图像帧之间进行插帧。

5、在上述的另一些实现方式中，在第一图像帧与第三图像帧之间不包括任何相同界面元素，但第四图像帧与第三图像帧之间包括相同界面元素的情况下，可以基于第四图像帧实现在第一图像帧与第三图像帧之间进行插帧。

6、在上述实现方式中，第一图像内容为与第一图像帧的图像内容连续的溢出内容，第一图像内容的溢出位置与电子设备显示第一图像帧之前接收到的触发操作的方向相关。一些示例中，第一图像内容的溢出方向与用户在电子设备显示第一图像帧之前的原始帧上触发的滑动操作的方向相反。

7、在第一方面的一种可能的实现方式中，第三图像帧中包括第二图像内容，第二图像内容基于第四图像帧生成。

8、利用已有的第四图像帧生成第二图像内容，可以避免重复加载和渲染相同的图像数据，从而优化电子设备的资源利用。并且，利用第四图像帧可以提高第三图像帧的生成速度，从而提高了滑动操作的响应速度，减少了用户的等待时间。

9、在第一方面的一种可能的实现方式中，在显示第二图像帧之前，方法还包括：

10、响应于滑动操作，获取相同界面元素在第一图像帧与第二图像帧之间的第一运动向量；

11、基于第一运动向量从第四图像帧中截取第二图像帧。

12、通过获取相同界面元素在第一图像帧与第二图像帧之间的第一运动向量，可以更加精准地定位到第四图像帧中需要截取的部分，从而生成更加准确的第二图像帧，提高了图像处理的精准度。

13、在第一方面的一种可能的实现方式中，基于第一运动向量从第四图像帧中截取第二图像帧，包括：

14、基于第一运动向量确定第一起始位置和第一结束位置；

15、截取第四图像帧中从第一起始位置到第一结束位置的图像内容为第二图像帧；

16、其中，第一运动向量包括第一位移和第一方向，第一起始位置对应的图像内容与第四图像帧中的第一位置对应的图像内容之间的距离与第一位移相等，由第一位置指向第一起始位置的方向与第一方向相反；第一位置为第四图像帧处于屏幕坐标系下的原点；第一结束位置与第一起始位置之间的距离与电子设备显示的图像帧的尺寸有关。

17、第一运动向量能够反映界面元素在第一图像帧以及第二图像帧之间的运动方向和位移，所以，通过第一运动向量来确定起止位置，可以精准确定出第二图像帧的图像内容在第四图像帧中的位置信息。如此，按第一起始位置到第一结束位置截取第二图像帧，可精准获取第二图像帧的图像部分，舍弃无关帧。并且，在这个过程中，无需对第四图像帧进行处理，从而显著减少需要处理的数据量。并且，数据量的减少可以降低对计算资源、存储资源的需求，从而降低负载。

18、在第一方面的一种可能的实现方式中，截取第四图像帧中从第一起始位置到第一结束位置的图像内容为第二图像帧，包括：

19、将第四图像帧中从第一起始位置到第一结束位置的图像内容复制到第二图像帧的存储空间，以获得第二图像帧。

20、通过复制的方式生成第二图像帧，可以避免出现图像内容的损坏，从而有效的保证第二图像帧的图像质量。

21、在第一方面的一种可能的实现方式中，在显示第三图像帧之前，方法还包括：

22、响应于滑动操作，获取相同界面元素在第一图像帧与第三图像帧之间的第二运动向量；

23、基于第二运动向量从第四图像帧中截取第二图像内容；

24、基于第二图像内容生成第三图像帧。

25、利用已有的第四图像帧和第二运动向量来生成第三图像帧，可以避免重复加载和渲染相同的图像数据，从而优化电子设备的资源利用。

26、在第一方面的一种可能的实现方式中，响应于滑动操作，获取相同界面元素在第一图像帧与第三图像帧之间的第二运动向量，包括：

27、响应于滑动操作，获取滑动操作指示的第三图像帧中需包括的所有界面元素以及每个界面元素的位置；

28、获取第一图像帧中所有界面元素以及每个界面元素的位置；

29、基于目标界面元素在第三图像帧的位置与目标界面元素在第一图像帧的位置确定第二运动向量，目标界面元素为第三图像帧以及第一图像帧中任意一个相同的界面元素。

30、通过获取第三图像帧中需包括的所有界面元素以及每个界面元素的位置，以及第一图像帧中所有界面元素以及每个界面元素的位置，可以准确的计算出第二运动向量。如此，基于第二运动向量可以快速且准确的生成第三图像帧以及第二图像帧。在提高显示速度的同时，提高图像的准确性和质量。

31、在第一方面的一种可能的实现方式中，基于第二运动向量从第四图像帧中截取第二图像内容，包括：

32、基于第二运动向量确定第二起始位置和第二结束位置；

33、截取第四图像帧中从第二起始位置到第二结束位置的图像内容为第二图像内容；

34、其中，第二运动向量包括第二位移和第二方向；

35、第二起始位置对应的图像内容与第四图像帧中的第一位置对应的图像内容之间的距离与第二位移相等，由第一位置指向第二起始位置的方向与第二方向相反；第一位置为第四图像帧处于屏幕坐标系下的原点；第二结束位置与第二起始位置之间的距离与电子设备显示的图像帧的尺寸有关；

36、或者，第二起始位置对应的图像内容与第四图像帧中的第一位置对应的图像内容之间的距离小于第二位移，第二起始位置为第四图像帧处于屏幕坐标系下横纵坐标值均最小的位置；由第一位置指向第二起始位置的方向与第二方向相反；第二结束位置与第二位置之间的距离与电子设备显示的图像帧的尺寸有关，第二位置为屏幕坐标系下由第一位置按照第二运动向量移动后得到的位置。

37、第二运动向量能够反映界面元素在第一图像帧以及第三图像帧之间的运动方向和位移，所以，通过第二运动向量来确定起止位置，可以精准确定出第三图像帧的图像内容在第四图像帧中的位置信息。如此，按第二起始位置到第二结束位置截取第三图像帧，可精准获取第三图像帧的图像部分，舍弃无关帧。并且，在这个过程中，无需对第四图像帧进行处理，从而显著减少需要处理的数据量。并且，数据量的减少可以降低对计算资源、存储资源的需求，从而降低负载。

38、在第一方面的一种可能的实现方式中，截取第四图像帧中从第二起始位置到第二结束位置的图像内容为第二图像内容，包括：

39、将第四图像帧中从第二起始位置到第二结束位置的图像内容复制到第二图像内容的存储空间，以获得第二图像内容。

40、通过复制的方式生成第二图像内容，可以避免出现图像内容的损坏，从而有效的保证第二图像内容的图像质量。

41、在第一方面的一种可能的实现方式中，在第二图像内容的尺寸小于电子设备显示的图像帧的尺寸的情况下，方法还包括：

42、生成第三图像内容；第三图像内容中需包括的界面元素不包括在第四图像帧中；

43、基于第二图像内容生成第三图像帧，包括：

44、基于第二图像内容和第三图像内容生成第三图像帧。

45、在第二图像内容的尺寸小于电子设备显示的图像帧的尺寸的情况下，可以先生成第四图像帧中不包括的第三图像内容，再基于第二图像内容和第三图像内容生成第三图像帧，以保证第三图像帧的完整性。

46、在第一方面的一种可能的实现方式中，在第二图像内容的尺寸等于电子设备显示的图像帧的尺寸的情况下，可以直接基于第四图像帧确定第二图像内容，并生成第三图像帧。

47、在第一方面的一种可能的实现方式中，生成第三图像内容，包括：

48、基于第二图像内容，滑动操作指示的第三图像帧中需包括的所有界面元素以及每个界面元素的位置，生成第三图像内容。

49、基于第二图像内容可以确定第三图像帧中缺失的部分，之后，再基于滑动操作指示的第三图像帧中需包括的所有界面元素以及每个界面元素的位置，准确生成第三图像内容，以保证第三图像帧的完整性。

50、在第一方面的一种可能的实现方式中，在绘制出第一图像帧之后，接收到滑动操作之前，方法还包括：

51、获取第三运动向量，第三运动向量为预测的相同界面元素在所述第一图像帧与第二图像帧之间的运动向量；

52、基于第三运动向量绘制第一图像内容；

53、基于第一图像内容以及第一图像帧生成第四图像帧。

54、通过获取第三运动向量，可以准确的绘制出第一图像内容，从而保证可以从第四图像帧中准确的截取出第二图像帧，以及第三图像帧中的第二图像内容。进一步保证第二图像帧，以及第三图像帧的生成速度，以及电子设备生成第二图像帧，以及第三图像帧的效率。

55、第二方面，本技术提供一种电子设备，所述电子设备包括显示屏、存储器和一个或多个处理器；所述显示屏、所述存储器和所述处理器耦合；所述显示屏用于显示所述处理器生成的图像，所述存储器用于存储计算机程序代码，所述计算机程序代码包括计算机指令；当所述处理器执行所述计算机指令时，使得所述电子设备执行如第四方面及其任一种可能的设计方式所述的方法。

56、第三方面，本技术提供一种计算机可读存储介质，包括计算机指令，当所述计算机指令在电子设备上运行时，使得所述电子设备执行如上第一方面及其任一种可能的设计方式所述的方法。

57、第四方面，本技术提供一种计算机程序产品，包括计算机程序/指令，在所述计算机程序/指令被处理器执行时，使得所述电子设备执行如上第一方面及其任一种可能的设计方式所述的方法。

58、第五方面，本技术提供一种装置，该装置包含在电子设备中，该装置具有实现上述方面及可能的实现方式中任一方法中电子设备行为的功能。该功能可以通过硬件实现，也可以通过硬件执行相应的软件实现。硬件或软件包括至少一个与上述功能相对应的模块或单元。例如，显示模块或单元，生成模块或单元，绘制模块或单元，获取模块或单元和存储模块或单元等。

59、第六方面，本技术实施例提供了一种芯片系统，该芯片系统包括处理器，还可以包括存储器，用于实现上述第一方面提供的任意一种方法。该芯片系统可以由芯片构成，也可以包含芯片和其他分立器件。

60、可以理解地，上述提供的第二方面及其任一种可能的设计方式所述的电子设备，第三方面所述的计算机可读存储介质，以及第四方面所述的计算机程序产品均用于执行上文所提供的对应的方法，因此，其所能达到的有益效果可参考上文所提供的对应的方法中的有益效果，此处不再赘述。