图像的显示方法、装置、存储介质及电子装置与流程

本发明涉及计算机领域，具体而言，涉及一种图像的显示方法、装置、存储介质及电子装置。

背景技术

近年来，直播产品越来越受到大众的喜爱。为了让观众更加直接的了解当前直播内容，通常会将直播流进行实时截图放在直播列表(或者搜素列表等)当做封面图显示。观众无需进入直播播放界面，从封面图就可得知当前直播的大致内容和进度。

由于不同终端设备的使用方式不同，导致实时截图的尺寸各异，而直播列表则必须兼顾排版和用户视觉体验，因此使用了固定的尺寸显示封面图。对于实时截图与封面图规定尺寸不同的情况，目前的解决方案是将实时截图强行压缩或者拉伸成需要的宽高尺寸，或者，将图片等宽高比缩小到需要的尺寸范围以内。对于将实时截图强行压缩或者放大成需要的宽高的方案，横屏截图转成竖图时会有拉长的感觉，竖屏截图转成横屏时看起来像压扁了一样，图片的形状发生严重的扭曲，视觉效果很差。对于将图片等宽高比缩小到需要的尺寸范围以内的方案，由于缩放后可能只有宽或高一个维度符合最终要求，造成图片显示时无法覆盖到全部封面图尺寸区域。造成图片显示排列不整齐，ui交互效果差强人意。

针对上述的问题，目前尚未提出有效的解决方案。

技术实现要素：

本发明实施例提供了一种图像的显示方法、装置、存储介质及电子装置，以至少解决相关技术中多媒体数据流的封面图显示效果较差的技术问题。

根据本发明实施例的一个方面，提供了一种图像的显示方法，包括：从正在播放的多媒体数据流中获取第一图像帧；在所述第一图像帧的图像尺寸与目标图像尺寸不匹配的情况下，从所述第一图像帧上截取宽高比例为第一比例的第二图像帧，其中，所述目标图像尺寸为所述多媒体数据流对应的目标显示区域的尺寸，所述第一比例为所述目标图像尺寸的宽度与所述目标图像尺寸的高度的比值；将所述第二图像帧等比缩放至图像尺寸为所述目标图像尺寸，得到目标图像；在所述目标显示区域显示所述目标图像。

根据本发明实施例的另一方面，还提供了一种图像的显示装置，包括：获取模块，用于从正在播放的多媒体数据流中获取第一图像帧；截取模块，用于在所述第一图像帧的图像尺寸与目标图像尺寸不匹配的情况下，从所述第一图像帧上截取宽高比例为第一比例的第二图像帧，其中，所述目标图像尺寸为所述多媒体数据流对应的目标显示区域的尺寸，所述第一比例为所述目标图像尺寸的宽度与所述目标图像尺寸的高度的比值；缩放模块，用于将所述第二图像帧等比缩放至图像尺寸为所述目标图像尺寸，得到目标图像；显示模块，用于在所述目标显示区域显示所述目标图像。

根据本发明实施例的另一方面，还提供了一种存储介质，其特征在于，所述存储介质中存储有计算机程序，其中，所述计算机程序被设置为运行时执行上述任一项中所述的方法。

根据本发明实施例的另一方面，还提供了一种电子装置，包括存储器和处理器，其特征在于，所述存储器中存储有计算机程序，所述处理器被设置为通过所述计算机程序执行上述任一项中所述的方法。

在本发明实施例中，采用从正在播放的多媒体数据流中获取第一图像帧；在第一图像帧的图像尺寸与目标图像尺寸不匹配的情况下，从第一图像帧上截取宽高比例为第一比例的第二图像帧，其中，目标图像尺寸为多媒体数据流对应的目标显示区域的尺寸，第一比例为目标图像尺寸的宽度与目标图像尺寸的高度的比值；将第二图像帧等比缩放至图像尺寸为目标图像尺寸，得到目标图像；在目标显示区域显示目标图像的方式，在从正在播放的多媒体数据流中获取的第一图像帧的图像尺寸与目标图像尺寸不匹配的情况下，从第一图像帧上截取宽高比例为第一比例的第二图像帧，使得第二图像帧的宽高比例与多媒体数据流对应的目标显示区域的目标图像尺寸的宽高比例相同，再将得到的第二图像帧等比缩放至图像尺寸为上述目标图像尺寸，从而使得得到的目标图像的尺寸与目标显示区域的尺寸相同，再将目标图像作为多媒体数据流的封面图显示在目标显示区域中，确保多媒体数据流的封面图在不会发生畸变的同时能够填充满封面图的显示区域，从而实现了提高多媒体数据流的封面图显示效果的技术效果，进而解决了相关技术中多媒体数据流的封面图显示效果较差的技术问题。

附图说明

此处所说明的附图用来提供对本发明的进一步理解，构成本申请的一部分，本发明的示意性实施例及其说明用于解释本发明，并不构成对本发明的不当限定。在附图中：

图1是根据本发明实施例的一种可选的图像的显示方法的示意图；

图2是根据本发明实施例的一种可选的图像的显示方法的应用环境示意图；

图3是根据本发明可选的实施方式的一种可选的图像的显示方法的示意图一；

图4是根据本发明可选的实施方式的一种可选的图像的显示方法的示意图二；

图5是根据本发明可选的实施方式的一种可选的图像的显示方法的示意图三；

图6是根据本发明可选的实施方式的一种可选的图像的显示方法的示意图四；

图7是根据本发明可选的实施方式的一种可选的图像的显示方法的示意图五；

图8是根据本发明实施例的一种可选的图像的显示装置的示意图；

图9是根据本发明实施例的一种可选的图像的显示方法的应用场景示意图一；

图10是根据本发明实施例的一种可选的图像的显示方法的应用场景示意图二；以及

图11是根据本发明实施例的一种可选的电子装置的示意图。

具体实施方式

为了使本技术领域的人员更好地理解本发明方案，下面将结合本发明实施例中的附图，对本发明实施例中的技术方案进行清楚、完整地描述，显然，所描述的实施例仅仅是本发明一部分的实施例，而不是全部的实施例。基于本发明中的实施例，本领域普通技术人员在没有做出创造性劳动前提下所获得的所有其他实施例，都应当属于本发明保护的范围。

需要说明的是，本发明的说明书和权利要求书及上述附图中的术语“第一”、“第二”等是用于区别类似的对象，而不必用于描述特定的顺序或先后次序。应该理解这样使用的数据在适当情况下可以互换，以便这里描述的本发明的实施例能够以除了在这里图示或描述的那些以外的顺序实施。此外，术语“包括”和“具有”以及他们的任何变形，意图在于覆盖不排他的包含，例如，包含了一系列步骤或单元的过程、方法、系统、产品或设备不必限于清楚地列出的那些步骤或单元，而是可包括没有清楚地列出的或对于这些过程、方法、产品或设备固有的其它步骤或单元。

根据本发明实施例的一个方面，提供了一种图像的显示方法，如图1所示，该方法包括：

s102，从正在播放的多媒体数据流中获取第一图像帧；

s104，在第一图像帧的图像尺寸与目标图像尺寸不匹配的情况下，从第一图像帧上截取宽高比例为第一比例的第二图像帧，其中，目标图像尺寸为多媒体数据流对应的目标显示区域的尺寸，第一比例为目标图像尺寸的宽度与目标图像尺寸的高度的比值；

s106，将第二图像帧等比缩放至图像尺寸为目标图像尺寸，得到目标图像；

s108，在目标显示区域显示目标图像。

可选地，在本实施例中，上述图像的显示方法可以应用于如图2所示的目标设备202所构成的硬件环境中。如图2所示，目标设备202从正在播放的多媒体数据流中获取第一图像帧；在第一图像帧的图像尺寸与目标图像尺寸不匹配的情况下，从第一图像帧上截取宽高比例为第一比例的第二图像帧，其中，目标图像尺寸为多媒体数据流对应的目标显示区域的尺寸，第一比例为目标图像尺寸的宽度与目标图像尺寸的高度的比值；将第二图像帧等比缩放至图像尺寸为目标图像尺寸，得到目标图像；在目标显示区域显示目标图像。

可选地，在本实施例中，目标设备202可以但不限于包括：终端设备、服务器设备等等。上述图像的显示方法可以应用于终端设备侧，或者，上述图像的显示方法可以应用于服务器设备侧，或者，上述图像的显示方法可以由终端设备侧和服务器设备侧交互进行。

例如：服务器从正在播放的多媒体数据流中获取第一图像帧，在第一图像帧的图像尺寸与目标图像尺寸不匹配的情况下，从第一图像帧上截取宽高比例为第一比例的第二图像帧，其中，目标图像尺寸为多媒体数据流对应的目标显示区域的尺寸，第一比例为目标图像尺寸的宽度与目标图像尺寸的高度的比值。服务器将第二图像帧发送给终端，终端将接收到的第二图像帧等比缩放至图像尺寸为目标图像尺寸，得到目标图像，并在目标显示区域显示该目标图像。

可选地，在本实施例中，上述图像的显示方法可以但不限于应用于显示多媒体数据流的封面图的场景中。其中，上述多媒体数据流可以但不限于在各种类型的客户端上播放，客户端则可以安装在上述目标设备上，例如，上述客户端可以但不限于包括：在线教育客户端、即时通讯客户端、社区空间客户端、游戏客户端、购物客户端、浏览器客户端、金融客户端、多媒体客户端、直播客户端等。具体的，可以但不限于应用于在上述显示多媒体客户端中播放的多媒体数据流的封面图的场景中，或还可以但不限于应用于在上述显示直播客户端中播放的多媒体数据流的封面图的场景中，以提高显示多媒体客户端中播放的多媒体数据流的封面图。上述仅是一种示例，本实施例中对此不做任何限定。

可选地，在本实施例中，上述多媒体数据流可以但不限于包括：视频数据流(例如：视频直播、视频点播等等)、音频数据流(例如：音乐播放、广播、电台等等)、幻灯片数据流(例如：ppt)、图片数据流(例如：电子相册)等等。

可选地，在本实施例中，获取的第一图像帧可以但不限于是从多媒体数据流中截图得到的，截图方式可以但不限于包括实时截图或者指定时间点截图等等。或者，获取的第一图像帧可以但不限于是为多媒体数据流指定的图像帧。例如：音乐播放中的专辑封面、广播播放中的音轨效果图、影视视频的海报等等。

可选地，在本实施例中，上述目标显示区域可以但不限于包括多媒体数据流的封面图的显示区域，该显示区域可以位于多媒体数据的播放列表或者多媒体数据的搜索列表等等。

在一个可选的实施方式中，以视频直播的封面图显示为例，如图3所示，视频流正播放到画面a，画面a的图像尺寸为100×300，从正在播放的视频流中获取第一图像帧为画面a，该视频流在直播列表中对应的目标显示区域为区域b，区域b的目标图像尺寸为300×100，在画面a图像尺寸与区域b的目标图像尺寸不匹配的情况下，从画面a上截取宽高比例为第一比例的第二图像帧，截取到画面c，其中，第一比例为目标图像尺寸的宽度与目标图像尺寸的高度的比值，即第一比例为100/300，假设在画面a上截取的宽度为100，则画面c的图像尺寸为100×100/3，将第二图像帧等比缩放3倍，则缩放至图像尺寸为目标图像尺寸300×100，得到目标图像d，在目标显示区域显示目标图像d。

可见，通过上述步骤，在从正在播放的多媒体数据流中获取的第一图像帧的图像尺寸与目标图像尺寸不匹配的情况下，从第一图像帧上截取宽高比例为第一比例的第二图像帧，使得第二图像帧的宽高比例与多媒体数据流对应的目标显示区域的目标图像尺寸的宽高比例相同，再将得到的第二图像帧等比缩放至图像尺寸为上述目标图像尺寸，从而使得得到的目标图像的尺寸与目标显示区域的尺寸相同，再将目标图像作为多媒体数据流的封面图显示在目标显示区域中，确保多媒体数据流的封面图在不会发生畸变的同时能够填充满封面图的显示区域，从而实现了提高多媒体数据流的封面图显示效果的技术效果，进而解决了相关技术中多媒体数据流的封面图显示效果较差的技术问题。

作为一种可选的方案，第一图像帧的图像尺寸与目标图像尺寸不匹配包括：

s1，第一图像帧的图像尺寸未落入目标尺寸范围；或者，

s2，第一图像帧的图像尺寸与目标图像尺寸不同。

可选地，在本实施例中，确定第一图像帧的图像尺寸与目标图像尺寸是否匹配的方式可以是判断二者是否相似，判断二者相似性的依据可以但不限于是判断第一图像帧的图像尺寸是否落入了一个包括了目标图像尺寸的目标尺寸范围。例如：目标图像尺寸为100×300，则可以但不限于将目标尺寸范围设置为宽度范围为90至120，高度范围为270至310，那么，图像尺寸的宽度和高度均落入上述范围内确定为二者是匹配的。

可选地，在本实施例中，确定第一图像帧的图像尺寸与目标图像尺寸是否匹配的方式可以是判断二者是否相同。例如：目标图像尺寸为100×300，则将图像尺寸为100×300的第一图像帧确定为与目标图像尺寸匹配的图像帧。

可选地，在本实施例中，如果第一图像帧的图像尺寸与目标图像尺寸匹配，则可以通过直接对第一图像身进行缩放的方式得到目标图像。

作为一种可选的方案，在第一比例大于或者等于1的情况下，从第一图像帧上截取宽高比例为第一比例的第二图像帧包括：

s1，确定第一图像帧的宽度为第一宽度，并确定第一宽度与第二比例的乘积值为第一高度，其中，第二比例为目标图像尺寸的高度与目标图像尺寸的宽度的比值；

s2，从第一图像帧上截取宽度为第一宽度，高度为第一高度的图像帧作为第二图像帧。

可选地，在本实施例中，目标图像尺寸的第一比例大于或者等于1，那么目标图像尺寸的宽度大于高度，则可以将第一图像帧的宽度确定为第二图像帧的宽度，通过对第一图像帧在高度上的截取来确保第二图像帧的宽高比例为第一比例。

可选地，在本实施例中，可以但不限于通过以下方式从第一图像帧上截取宽度为第一宽度，高度为第一高度的图像帧作为第二图像帧：根据目标图像尺寸的高度与第一图像帧的高度确定起始高度，并将第一图像帧的高度所在的边确定为起始边，再以起始边上高度为起始高度的点为起点从第一图像上截取宽度为第一宽度，高度为第一高度的图像帧作为第二图像帧。

可选地，在本实施例中，可以但不限于通过以下方式从第一图像帧上截取第二图像帧：将第一图像帧的高度与目标图像尺寸的高度的差值的一半确定为起始高度，并将第一图像帧的左边确定为起始边，以第一图像帧的左上顶点为原点，第一图像帧的左边为y轴的正半轴，第一图像帧的上边为x轴的正半轴建立直角坐标系xoy，并确定起点的坐标为(0，(h1-h2)/2)，其中，h1为第一图像帧的高度，h2为目标图像尺寸的高度；以起点为第二图像帧的左上顶点、以y＝(h1-h2)/2为第二图像帧的上边，延y轴正向截取第一高度的图像帧作为第二图像帧。

在一个可选的实施方式中，iorgwidth为原始图宽，即第一图像帧的宽度，iorgheigth为原始图高，即第一图像帧的高度，ineedwidth为处理后的图的宽，即第二图像帧的宽度(第一宽度)，ineedheigth为处理后的图的高(第一高度)，即第二图像帧的高度，igoalwidth为目标图像尺寸的宽度，igoalheigth为目标图像尺寸的高度，iposx为原始图中裁剪的起始坐标x，iposy为原始图中裁剪的起始坐标y。确定第一图像帧的宽度为第一宽度，则ineedwidth＝iorgwidth，确定第一宽度与第二比例(igoalheigth/igoalwidth)的乘积值为第一高度，则ineedheigth＝iorgwidth*(igoalheigth/igoalwidth)。如图4所示，以第一图像帧的左上顶点为原点，第一图像帧的左边为y轴的正半轴，第一图像帧的上边为x轴的正半轴建立直角坐标系xoy，确定截图的起点的x轴坐标为iposx＝0，确定截图的起点的y轴坐标为iposy＝(iorgheigth-ineedheigth)/2。以(iposx，iposy)为起点，裁剪宽度为iorgwidth，高为iorgwidth*(igoalheigth/igoalwidth)的虚线框部分图片即为第二图像帧。

在本实施方式中，如图5所示，截取后得到一个和封面图所需宽高比一致的图片，即第二图像帧，对第二图像帧进行等比缩放(如果第二图像帧的图像尺寸与目标图像尺寸是相同的，则缩放比例为1)，得到需要的尺寸大小的图片，即目标图片，将目标图片显示在直播列表上。

作为一种可选的方案，在第一比例小于1的情况下，从第一图像帧上截取宽高比例为第一比例的第二图像帧包括：

s1，确定第一图像帧的高度为第二高度，并确定第二高度与第一比例的乘积值为第二宽度；

s2，从第一图像上截取宽度为第二宽度，高度为第二高度的图像帧作为第二图像帧。

可选地，在本实施例中，目标图像尺寸的第一比例小于1，那么目标图像尺寸的宽度小于高度，则可以将第一图像帧的高度确定为第二图像帧的高度，通过对第一图像帧在宽度上的截取来确保第二图像帧的宽高比例为第一比例。

可选地，在本实施例中，可以但不限于通过以下方式从第一图像帧上截取宽度为第二宽度，高度为第二高度的图像帧作为第二图像帧：根据目标图像尺寸的宽度与第一图像帧的宽度确定起始宽度，并将第一图像帧的宽度所在的边确定为起始边，以起始边上宽度为起始宽度的点为起点从第一图像上截取宽度为第二宽度，高度为第二高度的图像帧作为第二图像帧。

可选地，在本实施例中，可以但不限于通过以下方式从第一图像帧上截取宽度为第二宽度，高度为第二高度的图像帧作为第二图像帧：将第一图像帧的宽度与目标图像尺寸的宽度的差值的一半确定为起始宽度，并将第一图像帧的上边确定为起始边。以第一图像帧的左上顶点为原点，第一图像帧的左边为y轴的正半轴，第一图像帧的上边为x轴的正半轴建立直角坐标系xoy，并确定起点的坐标为(0，(w1-w2)/2)，其中，w1为第一图像帧的宽度，w2为目标图像尺寸的宽度；以起点为第二图像帧的左上顶点、以x＝(w1-w2)/2为第二图像帧的左边，延x轴正向截取第二宽度的图像帧作为第二图像帧。

在一个可选的实施方式中，iorgwidth为原始图宽，即第一图像帧的宽度，iorgheigth为原始图高，即第一图像帧的高度，ineedwidth为处理后的图的宽，即第二图像帧的宽度(第一宽度)，ineedheigth为处理后的图的高(第一高度)，即第二图像帧的高度，igoalwidth为目标图像尺寸的宽度，igoalheigth为目标图像尺寸的高度，iposx为原始图中裁剪的起始坐标x，iposy为原始图中裁剪的起始坐标y。确定第一图像帧的高度为第二宽度，则ineedheigth＝iorgheigth，确定第二宽度与第二比例(igoalheigth/igoalwidth)的乘积值为第二高度，则ineedwidth＝iorgheigth*(igoalheigth/igoalwidth)。如图6所示，以第一图像帧的左上顶点为原点，第一图像帧的左边为y轴的正半轴，第一图像帧的上边为x轴的正半轴建立直角坐标系xoy，确定截图的起点的x轴坐标为iposx＝(iorgwidth-ineedwidth)/2，确定截图的起点的y轴坐标为iposy＝0。以(iposx，iposy)为起点，截取宽度为iorgwidth，高度为iorgheigth*(igoalheigth/igoalwidth)的虚线框部分图片即为第二图像帧。

在本实施方式中，如图7所示，截取后得到一个和封面图所需宽高比一致的图片，即第二图像帧，对第二图像帧进行等比缩放(如果第二图像帧的图像尺寸与目标图像尺寸是相同的，则缩放比例为1)，得到需要的尺寸大小的图片，即目标图片，将目标图片显示在直播列表上。

需要说明的是，对于前述的各方法实施例，为了简单描述，故将其都表述为一系列的动作组合，但是本领域技术人员应该知悉，本发明并不受所描述的动作顺序的限制，因为依据本发明，某些步骤可以采用其他顺序或者同时进行。其次，本领域技术人员也应该知悉，说明书中所描述的实施例均属于优选实施例，所涉及的动作和模块并不一定是本发明所必须的。

通过以上的实施方式的描述，本领域的技术人员可以清楚地了解到根据上述实施例的方法可借助软件加必需的通用硬件平台的方式来实现，当然也可以通过硬件，但很多情况下前者是更佳的实施方式。基于这样的理解，本发明的技术方案本质上或者说对现有技术做出贡献的部分可以以软件产品的形式体现出来，该计算机软件产品存储在一个存储介质(如rom/ram、磁碟、光盘)中，包括若干指令用以使得一台终端设备(可以是手机，计算机，服务器，或者网络设备等)执行本发明各个实施例所述的方法。

根据本发明实施例的另一个方面，还提供了一种用于实施上述图像的显示方法的图像的显示装置，如图8所示，该装置包括：

获取模块82，用于从正在播放的多媒体数据流中获取第一图像帧；

截取模块84，用于在第一图像帧的图像尺寸与目标图像尺寸不匹配的情况下，从第一图像帧上截取宽高比例为第一比例的第二图像帧，其中，目标图像尺寸为多媒体数据流对应的目标显示区域的尺寸，第一比例为目标图像尺寸的宽度与目标图像尺寸的高度的比值；

缩放模块86，用于将第二图像帧等比缩放至图像尺寸为目标图像尺寸，得到目标图像；

显示模块88，用于在目标显示区域显示目标图像。

可选地，在本实施例中，上述图像的显示装置可以应用于如图2所示的目标设备202所构成的硬件环境中。如图2所示，目标设备202从正在播放的多媒体数据流中获取第一图像帧；在第一图像帧的图像尺寸与目标图像尺寸不匹配的情况下，从第一图像帧上截取宽高比例为第一比例的第二图像帧，其中，目标图像尺寸为多媒体数据流对应的目标显示区域的尺寸，第一比例为目标图像尺寸的宽度与目标图像尺寸的高度的比值；将第二图像帧等比缩放至图像尺寸为目标图像尺寸，得到目标图像；在目标显示区域显示目标图像。

可选地，在本实施例中，目标设备可以但不限于包括：终端设备、服务器设备等等。上述图像的显示方法可以应用于终端设备侧，或者，上述图像的显示方法可以应用于服务器设备侧，或者，上述图像的显示方法可以由终端设备侧和服务器设备侧交互进行。

例如：服务器从正在播放的多媒体数据流中获取第一图像帧，在第一图像帧的图像尺寸与目标图像尺寸不匹配的情况下，从第一图像帧上截取宽高比例为第一比例的第二图像帧，其中，目标图像尺寸为多媒体数据流对应的目标显示区域的尺寸，第一比例为目标图像尺寸的宽度与目标图像尺寸的高度的比值。服务器将第二图像帧发送给终端，终端将接收到的第二图像帧等比缩放至图像尺寸为目标图像尺寸，得到目标图像，并在目标显示区域显示该目标图像。

可选地，在本实施例中，上述图像的显示装置可以但不限于应用于显示多媒体数据流的封面图的场景中。其中，上述多媒体数据流可以但不限于在各种类型的客户端上播放，例如，上述客户端可以但不限于包括：在线教育客户端、即时通讯客户端、社区空间客户端、游戏客户端、购物客户端、浏览器客户端、金融客户端、多媒体客户端、直播客户端等。具体的，可以但不限于应用于在上述显示多媒体客户端中播放的多媒体数据流的封面图的场景中，或还可以但不限于应用于在上述显示直播客户端中播放的多媒体数据流的封面图的场景中，以提高显示多媒体客户端中播放的多媒体数据流的封面图。上述仅是一种示例，本实施例中对此不做任何限定。

可选地，在本实施例中，上述多媒体数据流可以但不限于包括：视频数据流(例如：视频直播、视频点播等等)、音频数据流(例如：音乐播放、广播、电台等等)、幻灯片数据流(例如：ppt)、图片数据流(例如：电子相册)等等。

可选地，在本实施例中，获取的第一图像帧可以但不限于是从多媒体数据流中截图得到的，截图方式可以但不限于包括实时截图或者指定时间点截图等等。或者，获取的第一图像帧可以但不限于是为多媒体数据流指定的图像帧。例如：音乐播放中的专辑封面、广播播放中的音轨效果图、影视视频的海报等等。

可选地，在本实施例中，上述目标显示区域可以但不限于包括多媒体数据流的封面图的显示区域，该显示区域可以位于多媒体数据的播放列表或者多媒体数据的搜索列表等等。

在一个可选的实施方式中，以视频直播的封面图显示为例，如图3所示，视频流正播放到画面a，画面a的图像尺寸为100×300，从正在播放的视频流中获取第一图像帧为画面a，该视频流在直播列表中对应的目标显示区域为区域b，区域b的目标图像尺寸为300×100，在画面a图像尺寸与区域b的目标图像尺寸不匹配的情况下，从画面a上截取宽高比例为第一比例的第二图像帧，截取到画面c，其中，第一比例为目标图像尺寸的宽度与目标图像尺寸的高度的比值，即第一比例为100/300，假设在画面a上截取的宽度为100，则画面c的图像尺寸为100×100/3，将第二图像帧等比缩放3倍，则缩放至图像尺寸为目标图像尺寸300×100，得到目标图像d，在目标显示区域显示目标图像d。

可见，通过上述装置，在从正在播放的多媒体数据流中获取的第一图像帧的图像尺寸与目标图像尺寸不匹配的情况下，从第一图像帧上截取宽高比例为第一比例的第二图像帧，使得第二图像帧的宽高比例与多媒体数据流对应的目标显示区域的目标图像尺寸的宽高比例相同，再将得到的第二图像帧等比缩放至图像尺寸为上述目标图像尺寸，从而使得得到的目标图像的尺寸与目标显示区域的尺寸相同，再将目标图像作为多媒体数据流的封面图显示在目标显示区域中，确保多媒体数据流的封面图在不会发生畸变的同时能够填充满封面图的显示区域，从而实现了提高多媒体数据流的封面图显示效果的技术效果，进而解决了相关技术中多媒体数据流的封面图显示效果较差的技术问题。

作为一种可选的方案，第一图像帧的图像尺寸与目标图像尺寸不匹配包括：

第一图像帧的图像尺寸未落入目标尺寸范围；或者，

第一图像帧的图像尺寸与目标图像尺寸不同。

可选地，在本实施例中，确定第一图像帧的图像尺寸与目标图像尺寸是否匹配的方式可以是判断二者是否相似，判断二者相似性的依据可以但不限于是判断第一图像帧的图像尺寸是否落入了一个包括了目标图像尺寸的目标尺寸范围。例如：目标图像尺寸为100×300，则可以但不限于将目标尺寸范围设置为宽度范围为90至120，高度范围为270至310，那么，图像尺寸的宽度和高度均落入上述范围内确定为二者是匹配的。

可选地，在本实施例中，确定第一图像帧的图像尺寸与目标图像尺寸是否匹配的方式可以是判断二者是否相同。例如：目标图像尺寸为100×300，则将图像尺寸为100×300的第一图像帧确定为与目标图像尺寸匹配的图像帧。

可选地，在本实施例中，如果第一图像帧的图像尺寸与目标图像尺寸匹配，则可以通过直接对第一图像身进行缩放的方式得到目标图像。

作为一种可选的方案，在第一比例大于或者等于1的情况下，截取模块包括：

第一确定单元，用于确定第一图像帧的宽度为第一宽度，并确定第一宽度与第二比例的乘积值为第一高度，其中，第二比例为目标图像尺寸的高度与目标图像尺寸的宽度的比值；

第一截取单元，用于从第一图像帧上截取宽度为第一宽度，高度为第一高度的图像帧作为第二图像帧。

可选地，在本实施例中，目标图像尺寸的第一比例大于或者等于1，那么目标图像尺寸的宽度大于高度，则可以将第一图像帧的宽度确定为第二图像帧的宽度，通过对第一图像帧在高度上的截取来确保第二图像帧的宽高比例为第一比例。

可选地，在本实施例中，第一截取单元包括：第一确定子单元，用于根据目标图像尺寸的高度与第一图像帧的高度确定起始高度，并将第一图像帧的高度所在的边确定为起始边；第一截取子单元，用于以起始边上高度为起始高度的点为起点从第一图像上截取宽度为第一宽度，高度为第一高度的图像帧作为第二图像帧。

可选地，在本实施例中，第一确定子单元用于：将第一图像帧的高度与目标图像尺寸的高度的差值的一半确定为起始高度，并将第一图像帧的左边确定为起始边。

可选地，在本实施例中，第一截取子单元用于：以第一图像帧的左上顶点为原点，第一图像帧的左边为y轴的正半轴，第一图像帧的上边为x轴的正半轴建立直角坐标系xoy，并确定起点的坐标为(0，(h1-h2)/2)，其中，h1为第一图像帧的高度，h2为目标图像尺寸的高度；以起点为第二图像帧的左上顶点、以y＝(h1-h2)/2为第二图像帧的上边，延y轴正向截取第一高度的图像帧作为第二图像帧。

在一个可选的实施方式中，iorgwidth为原始图宽，即第一图像帧的宽度，iorgheigth为原始图高，即第一图像帧的高度，ineedwidth为处理后的图的宽，即第二图像帧的宽度(第一宽度)，ineedheigth为处理后的图的高(第一高度)，即第二图像帧的高度，igoalwidth为目标图像尺寸的宽度，igoalheigth为目标图像尺寸的高度，iposx为原始图中裁剪的起始坐标x，iposy为原始图中裁剪的起始坐标y。确定第一图像帧的宽度为第一宽度，则ineedwidth＝iorgwidth，确定第一宽度与第二比例(igoalheigth/igoalwidth)的乘积值为第一高度，则ineedheigth＝iorgwidth*(igoalheigth/igoalwidth)。如图4所示，以第一图像帧的左上顶点为原点，第一图像帧的左边为y轴的正半轴，第一图像帧的上边为x轴的正半轴建立直角坐标系xoy，确定截图的起点的x轴坐标为iposx＝0，确定截图的起点的y轴坐标为iposy＝(iorgheigth-ineedheigth)/2。以(iposx，iposy)为起点，裁剪宽度为iorgwidth，高为iorgwidth*(igoalheigth/igoalwidth)的虚线框部分图片即为第二图像帧。

在本实施方式中，如图5所示，截取后得到一个和封面图所需宽高比一致的图片，即第二图像帧，对第二图像帧进行等比缩放(如果第二图像帧的图像尺寸与目标图像尺寸是相同的，则缩放比例为1)，得到需要的尺寸大小的图片，即目标图片，将目标图片显示在直播列表上。

作为一种可选的方案，在第一比例小于1的情况下，截取模块包括：

第二确定单元，用于确定第一图像帧的高度为第二高度，并确定第二高度与第一比例的乘积值为第二宽度；

第二截取单元，用于从第一图像上截取宽度为第二宽度，高度为第二高度的图像帧作为第二图像帧。

可选地，在本实施例中，目标图像尺寸的第一比例小于1，那么目标图像尺寸的宽度小于高度，则可以将第一图像帧的高度确定为第二图像帧的高度，通过对第一图像帧在宽度上的截取来确保第二图像帧的宽高比例为第一比例。

可选地，在本实施例中，第二截取单元包括：第二确定子单元，用于根据目标图像尺寸的宽度与第一图像帧的宽度确定起始宽度，并将第一图像帧的宽度所在的边确定为起始边；第二截取子单元，用于以起始边上宽度为起始宽度的点为起点从第一图像上截取宽度为第二宽度，高度为第二高度的图像帧作为第二图像帧。

可选地，在本实施例中，第二确定子单元用于：将第一图像帧的宽度与目标图像尺寸的宽度的差值的一半确定为起始宽度，并将第一图像帧的上边确定为起始边。

可选地，在本实施例中，第二截取子单元用于：以第一图像帧的左上顶点为原点，第一图像帧的左边为y轴的正半轴，第一图像帧的上边为x轴的正半轴建立直角坐标系xoy，并确定起点的坐标为(0，(w1-w2)/2)，其中，w1为第一图像帧的宽度，w2为目标图像尺寸的宽度；以起点为第二图像帧的左上顶点、以x＝(w1-w2)/2为第二图像帧的左边，延x轴正向截取第二宽度的图像帧作为第二图像帧。

在一个可选的实施方式中，iorgwidth为原始图宽，即第一图像帧的宽度，iorgheigth为原始图高，即第一图像帧的高度，ineedwidth为处理后的图的宽，即第二图像帧的宽度(第一宽度)，ineedheigth为处理后的图的高(第一高度)，即第二图像帧的高度，igoalwidth为目标图像尺寸的宽度，igoalheigth为目标图像尺寸的高度，iposx为原始图中裁剪的起始坐标x，iposy为原始图中裁剪的起始坐标y。确定第一图像帧的高度为第二宽度，则ineedheigth＝iorgheigth，确定第二宽度与第二比例(igoalheigth/igoalwidth)的乘积值为第二高度，则ineedwidth＝iorgheigth*(igoalheigth/igoalwidth)。如图6所示，以第一图像帧的左上顶点为原点，第一图像帧的左边为y轴的正半轴，第一图像帧的上边为x轴的正半轴建立直角坐标系xoy，确定截图的起点的x轴坐标为iposx＝(iorgwidth-ineedwidth)/2，确定截图的起点的y轴坐标为iposy＝0。以(iposx，iposy)为起点，截取宽度为iorgwidth，高度为iorgheigth*(igoalheigth/igoalwidth)的虚线框部分图片即为第二图像帧。

在本实施方式中，如图7所示，截取后得到一个和封面图所需宽高比一致的图片，即第二图像帧，对第二图像帧进行等比缩放(如果第二图像帧的图像尺寸与目标图像尺寸是相同的，则缩放比例为1)，得到需要的尺寸大小的图片，即目标图片，将目标图片显示在直播列表上。

本发明实施例的应用环境可以但不限于参照上述实施例中的应用环境，本实施例中对此不再赘述。本发明实施例提供了用于实施上述实时通信的连接方法的一种可选的具体应用示例。

作为一种可选的实施例，上述图像的显示方法可以但不限于应用于如图9和图10所示的对直播中的视频进行封面图显示的场景中。在本场景中，以手机端视频直播为例，直播截图为从直播视频流中截取当前画面的图片。封面图为直播列表中展现的与直播内容相关的图片。实时封面图为由直播内容实时截图作为封面图。横屏直播为手机横屏直播时，输出的视频界面是横向的。竖屏直播为手机竖屏直播时，输出的视频界面是竖向的。横图为从横屏直播中截取的图片，宽度大于高度。竖图为从竖屏直播中截取的图片，宽度小于高度。

直播时，手机可横屏和竖屏采集视频源，由主播自由选择横屏或者竖屏直播。但是在直播app、web、或者搜索页等直播列表中，为了排版的视觉体验，都是采用一种固定的规格的封面图。如果采用直播实时截图作为封面图就会遇到横屏直播截图，但是需要显示的是竖图，或者竖屏直播截图，但是需要显示的是横图的情况。

在本场景中，针对上述问题提供了一种截图处理方式，使得原始截图在处理后得到符合制定尺寸的封面图，图片铺满封面图区域且不扭曲，提高了封面图的显示效果。

在本场景中，如图9所示，对于横图转竖图的情况，截取原始图后，先对原始图进行中心裁剪，按照需要尺寸的宽高比，在原始图的中心进行最大范围的匹配，以截取最大范围的原始图，即以原始图的高度为截取的高度，截取与封面图同比例的图像，使得截取的图片能够符合需要的宽高比，然后再将截取的图片等比缩放到指定的尺寸即可。

在本场景中，如图10所示，对于竖图转横图的情况，截取原始图后，先对原始图进行中心裁剪，按照需要尺寸的宽高比，在原始图的中心进行最大范围的匹配，以截取最大范围的原始图，即以原始图的宽度为截取的宽度，截取与封面图同比例的图像，使得截取的图片能够符合需要的宽高比，然后再将截取的图片等比缩放到指定的尺寸即可。

可选地，在本实施例中，截取区域的选择，可以进一步使用图像识别技术，将图片中人脸区域识别出来，再以此为中心进行图片截取，可以更进一步提升截图效果。

通过上述方式，解决了直播实时截图尺寸和显示尺寸不匹配问题，优化了直播列表、搜索列表等需要显示实时截图的处理方式，提升界面的排版和交互视觉体验。

根据本发明实施例的又一个方面，还提供了一种用于实施上述图像的显示的电子装置，如图11所示，该电子装置包括：一个或多个(图中仅示出一个)处理器1102、存储器1104、传感器1106、编码器1108以及传输装置1110，该存储器中存储有计算机程序，该处理器被设置为通过计算机程序执行上述任一项方法实施例中的步骤。

可选地，在本实施例中，上述电子装置可以位于计算机网络的多个网络设备中的至少一个网络设备。

可选地，在本实施例中，上述处理器可以被设置为通过计算机程序执行以下步骤：

s1，从正在播放的多媒体数据流中获取第一图像帧；

s2，在第一图像帧的图像尺寸与目标图像尺寸不匹配的情况下，从第一图像帧上截取宽高比例为第一比例的第二图像帧，其中，目标图像尺寸为多媒体数据流对应的目标显示区域的尺寸，第一比例为目标图像尺寸的宽度与目标图像尺寸的高度的比值；

s3，将第二图像帧等比缩放至图像尺寸为目标图像尺寸，得到目标图像；

s4，在目标显示区域显示目标图像。

可选地，本领域普通技术人员可以理解，图11所示的结构仅为示意，电子装置也可以是智能手机(如android手机、ios手机等)、平板电脑、掌上电脑以及移动互联网设备(mobileinternetdevices，mid)、pad等终端设备。图11其并不对上述电子装置的结构造成限定。例如，电子装置还可包括比图11中所示更多或者更少的组件(如网络接口、显示装置等)，或者具有与图11所示不同的配置。

其中，存储器1102可用于存储软件程序以及模块，如本发明实施例中的图像的显示方法和装置对应的程序指令/模块，处理器1104通过运行存储在存储器1102内的软件程序以及模块，从而执行各种功能应用以及数据处理，即实现上述的目标组件的控制方法。存储器1102可包括高速随机存储器，还可以包括非易失性存储器，如一个或者多个磁性存储装置、闪存、或者其他非易失性固态存储器。在一些实例中，存储器1102可进一步包括相对于处理器1104远程设置的存储器，这些远程存储器可以通过网络连接至终端。上述网络的实例包括但不限于互联网、企业内部网、局域网、移动通信网及其组合。

上述的传输装置1110用于经由一个网络接收或者发送数据。上述的网络具体实例可包括有线网络及无线网络。在一个实例中，传输装置1110包括一个网络适配器(networkinterfacecontroller，nic)，其可通过网线与其他网络设备与路由器相连从而可与互联网或局域网进行通讯。在一个实例中，传输装置1110为射频(radiofrequency，rf)模块，其用于通过无线方式与互联网进行通讯。

其中，具体地，存储器1102用于存储应用程序。

本发明的实施例还提供了一种存储介质，该存储介质中存储有计算机程序，其中，该计算机程序被设置为运行时执行上述任一项方法实施例中的步骤。

可选地，在本实施例中，上述存储介质可以被设置为存储用于执行以下步骤的计算机程序：

s1，从正在播放的多媒体数据流中获取第一图像帧；

s2，在第一图像帧的图像尺寸与目标图像尺寸不匹配的情况下，从第一图像帧上截取宽高比例为第一比例的第二图像帧，其中，目标图像尺寸为多媒体数据流对应的目标显示区域的尺寸，第一比例为目标图像尺寸的宽度与目标图像尺寸的高度的比值；

s3，将第二图像帧等比缩放至图像尺寸为目标图像尺寸，得到目标图像；

s4，在目标显示区域显示目标图像。

可选地，存储介质还被设置为存储用于执行上述实施例中的方法中所包括的步骤的计算机程序，本实施例中对此不再赘述。

可选地，在本实施例中，本领域普通技术人员可以理解上述实施例的各种方法中的全部或部分步骤是可以通过程序来指令终端设备相关的硬件来完成，该程序可以存储于一计算机可读存储介质中，存储介质可以包括：闪存盘、只读存储器(read-onlymemory，rom)、随机存取器(randomaccessmemory，ram)、磁盘或光盘等。

上述本发明实施例序号仅仅为了描述，不代表实施例的优劣。

上述实施例中的集成的单元如果以软件功能单元的形式实现并作为独立的产品销售或使用时，可以存储在上述计算机可读取的存储介质中。基于这样的理解，本发明的技术方案本质上或者说对现有技术做出贡献的部分或者该技术方案的全部或部分可以以软件产品的形式体现出来，该计算机软件产品存储在存储介质中，包括若干指令用以使得一台或多台计算机设备(可为个人计算机、服务器或者网络设备等)执行本发明各个实施例所述方法的全部或部分步骤。

在本发明的上述实施例中，对各个实施例的描述都各有侧重，某个实施例中没有详述的部分，可以参见其他实施例的相关描述。

在本申请所提供的几个实施例中，应该理解到，所揭露的客户端，可通过其它的方式实现。其中，以上所描述的装置实施例仅仅是示意性的，例如所述单元的划分，仅仅为一种逻辑功能划分，实际实现时可以有另外的划分方式，例如多个单元或组件可以结合或者可以集成到另一个系统，或一些特征可以忽略，或不执行。另一点，所显示或讨论的相互之间的耦合或直接耦合或通信连接可以是通过一些接口，单元或模块的间接耦合或通信连接，可以是电性或其它的形式。

所述作为分离部件说明的单元可以是或者也可以不是物理上分开的，作为单元显示的部件可以是或者也可以不是物理单元，即可以位于一个地方，或者也可以分布到多个网络单元上。可以根据实际的需要选择其中的部分或者全部单元来实现本实施例方案的目的。

另外，在本发明各个实施例中的各功能单元可以集成在一个处理单元中，也可以是各个单元单独物理存在，也可以两个或两个以上单元集成在一个单元中。上述集成的单元既可以采用硬件的形式实现，也可以采用软件功能单元的形式实现。

以上所述仅是本发明的优选实施方式，应当指出，对于本技术领域的普通技术人员来说，在不脱离本发明原理的前提下，还可以做出若干改进和润饰，这些改进和润饰也应视为本发明的保护范围。