图像显示方法、装置、电子设备及存储介质制造方法及图纸

本申请公开了一种图像显示方法、装置、电子设备及存储介质，涉及图像处理技术领域，该方法包括：获取待轮播的图像数据；根据图像数据渲染轮播组件，轮播组件用于输出包含有图像数据的轮播主图；当对轮播组件渲染完成时，根据轮播主图确定缩略图组件的渲染位置，缩略图组件用于输出与轮播主图对应的缩略图；基于渲染位置以及图像数据，渲染缩略图组件；基于轮播组件以及缩略图组件，输出包含有轮播主图以及缩略图的轮播界面。本申请可根据具体的轮播主图，动态确定缩略图的显示位置，提高了轮播效果。

Image display method, device, electronic equipment and storage medium

【技术实现步骤摘要】
图像显示方法、装置、电子设备及存储介质
本申请涉及图像处理
，更具体地，涉及一种图像显示方法、装置、电子设备及存储介质。
技术介绍
图片轮播技术是将承载着预设信息的多张图片，在显示界面进行轮流呈现的一种技术，以便浏览者可以方便快速的了解到其想要传达的信息，多用于产品推广、信息宣传，类似于PPT放映，是一种常见的用于展示重要内容的信息传播方式。但传统的图片轮播技术，轮播方式单一，轮播效果不佳。
技术实现思路
本申请实施例提出了一种图像显示方法、装置、电子设备及存储介质，能够提高轮播效果。第一方面，本申请实施例提供了一种图像显示方法，该方法包括：获取待轮播的图像数据；根据所述图像数据渲染轮播组件，所述轮播组件用于输出包含有所述图像数据的轮播主图；当对所述轮播组件渲染完成时，根据所述轮播主图确定缩略图组件的渲染位置，所述缩略图组件用于输出与所述轮播主图对应的缩略图；基于所述渲染位置以及所述图像数据，渲染所述缩略图组件；基于所述轮播组件以及所述缩略图组件，输出包含有所述轮播主图以及所述缩略图的轮播界面。第二方面，本申请实施例提供了一种图像显示装置，该装置包括：数据获取模块、主图渲染模块、位置确定模块、缩图渲染模块以及数据输出模块。其中，数据获取模块用于获取待轮播的图像数据；主图渲染模块用于根据所述图像数据渲染轮播组件，所述轮播组件用于输出包含有所述图像数据的轮播主图；位置确定模块用于当对所述轮播组件渲染完成时，根据所述轮播主图确定缩略图组件的渲染位置，所述缩略图组件用于输出与所述轮播主图对应的缩略图；缩图渲染模块用于基于所述渲染位置以及所述图像数据，渲染所述缩略图组件；数据输出模块用于基于所述轮播组件以及所述缩略图组件，输出包含有所述轮播主图以及所述缩略图的轮播界面。第三方面，本申请实施例提供了一种电子设备，包括：存储器；一个或多个处理器，与所述存储器耦接；一个或多个应用程序，其中，一个或多个应用程序被存储在存储器中并被配置为由一个或多个处理器执行，一个或多个应用程序配置用于执行上述第一方面提供的图像显示方法。第四方面，本申请实施例提供了一种计算机可读取存储介质，计算机可读取存储介质中存储有程序代码，程序代码可被处理器调用执行上述第一方面提供的图像显示方法。本申请实施例提供的一种图像显示方法、装置、电子设备及存储介质，通过获取待轮播的图像数据，以根据该图像数据渲染轮播组件，当对该轮播组件渲染完成时，根据轮播主图确定缩略图组件的渲染位置，然后基于该渲染位置以及图像数据，渲染缩略图组件，最后基于轮播组件以及缩略图组件，输出包含有轮播主图以及缩略图的轮播界面。从而实现了带有缩略图的轮播界面，同时缩略图的显示位置可根据轮播界面中具体的轮播主图动态确定，丰富了轮播方式，提高了轮播效果。附图说明为了更清楚地说明本申请实施例中的技术方案，下面将对实施例描述中所需要使用的附图作简单地介绍，显而易见地，下面描述中的附图仅仅是本申请的一些实施例，对于本领域技术人员来讲，在不付出创造性劳动的前提下，还可以根据这些附图获得其他的附图。图1示出了本申请实施例提供的一种图像显示方法的应用场景图。图2示出了本申请一个实施例提供的图像显示方法的流程示意图。图3示出了本申请实施例提供的一种索引示意图。图4示出了本申请实施例提供的一种界面示意图。图5示出了本申请实施例提供的另一种界面示意图。图6示出了本申请另一个实施例提供的图像显示方法的流程示意图。图7示出了图6中的步骤S220的一种流程示意图。图8示出了图6中的步骤S230的一种流程示意图。图9示出了图8中的步骤S232的一种流程示意图。图10示出了图8中的步骤S233的一种流程示意图。图11示出了图6中的步骤S240的一种流程示意图。图12示出了图6中的步骤S240的另一种流程示意图。图13示出了图12中的步骤S248的一种流程示意图。图14示出了本申请一个实施例提供的图像显示装置的模块框图。图15示出了本申请实施例提供的一种电子设备的结构框图。图16示出了本申请实施例的用于保存或者携带实现根据本申请实施例的图像显示方法的程序代码的存储单元。具体实施方式为了使本
的人员更好地理解本申请方案，下面将结合本申请实施例中的附图，对本申请实施例中的技术方案进行清楚、完整地描述。首先，对本申请实施例涉及的若干个名词进行解释：轮播界面：用于呈现轮播内容的界面，可内嵌于其他界面中。轮播主图：于轮播界面中占据大面积显示位置的轮播图片的大图，使得用户可清楚查看到图片内容。缩略图：表示某张图片按照某种方式缩小其大小变成的另外一张图片，就称之为原图片的缩略图。于轮播界面中占据小面积显示位置，是轮播图片的缩略图，可以起到辅助导航的作用。组件：软件系统中的一个具有功能性的部分，它可以与其他的组件集成去形成一个更大的部分或者是一个完整的应用程序。同时，组件也是一个可替换单元，可以构成软件系统的即插即用的软件成分。组件的使用者对于组件只有通过确定的接口所提供的功能或者服务感兴趣，才能与组件进行连接。轮播组件：用于在显示界面中循环展示上述轮播主图的组件缩略组件：用于在显示界面中，展示与当前展示的轮播主图对应的缩略图的组件。渲染：指的是结合组件配置信息，将数据基于一定的规则完成页面结构布局及绘制的过程。请参见图1，图1示出了本申请实施例提供的图像显示方法的应用场景的示意图，该应用场景包括本申请实施例提供的一种图像显示系统10。该图像显示系统10包括：终端设备100以及服务器200。其中，终端设备100和服务器200位于无线网络或有线网络中，终端设备100和服务器200可以进行数据交互。在一些实施方式中，终端设备100可以为多个，服务器200可以与多个终端设备100通信连接，多个终端设备100之间也可以相互通过互联网进行通信连接，也可以将服务器200作为传输中介，并通过互联网来实现相互间的数据交互。在本申请实施例中，终端设备100可以是移动手机、智能手机、笔记本电脑、台式电脑、平板电脑、个人数字助理(PersonalDigitalAssistant，PDA)、媒体播放器、智能电视、可穿戴电子设备等，具体的终端设备类型在本申请实施例中可以不作为限定。服务器200可以是单独的服务器，也可以是服务器集群，可以是本地服务器，也可以是云端服务器，具体的服务器类型在本申请实施例中可以不作为限定。在一些实施例中，终端设备100内可以安装有客户端。该客户端可以是安装在终端设备100上的计算机应用程序(Application，APP)，也可以是Web客户端，该Web客户端可指基于Web架构而开发的应用程序。其中，客户端的显示界面中可包括用于轮流呈现多张图片的轮播显示界面。进一步地，客户端也可接收用户基于客户端输入的触发事件(如点击事件、触摸事件等)，该本文档来自技高网...

【技术保护点】
1.一种图像显示方法，其特征在于，所述方法包括：/n获取待轮播的图像数据；/n根据所述图像数据渲染轮播组件，所述轮播组件用于输出包含有所述图像数据的轮播主图；/n当对所述轮播组件渲染完成时，根据所述轮播主图确定缩略图组件的渲染位置，所述缩略图组件用于输出与所述轮播主图对应的缩略图；/n基于所述渲染位置以及所述图像数据，渲染所述缩略图组件；/n基于所述轮播组件以及所述缩略图组件，输出包含有所述轮播主图以及所述缩略图的轮播界面。/n

【技术特征摘要】
1.一种图像显示方法，其特征在于，所述方法包括：
获取待轮播的图像数据；
根据所述图像数据渲染轮播组件，所述轮播组件用于输出包含有所述图像数据的轮播主图；
当对所述轮播组件渲染完成时，根据所述轮播主图确定缩略图组件的渲染位置，所述缩略图组件用于输出与所述轮播主图对应的缩略图；
基于所述渲染位置以及所述图像数据，渲染所述缩略图组件；
基于所述轮播组件以及所述缩略图组件，输出包含有所述轮播主图以及所述缩略图的轮播界面。


2.根据权利要求1所述的方法，其特征在于，所述根据所述轮播主图确定缩略图组件的渲染位置，包括：
获取所述轮播主图中的指定区域；
确定所述轮播主图中除所述指定区域外的其他区域；
根据所述其他区域，确定缩略图组件的渲染位置。


3.根据权利要求2所述的方法，其特征在于，所述获取待轮播的图像数据，包括：
获取预配置的配置文件，所述配置文件包括待轮播的图像数据；
所述配置文件还包括所述图像数据中的标记区域，所述获取所述轮播主图中的指定区域，包括：
获取所述轮播主图中与所述标记区域对应的区域作为指定区域。


4.根据权利要求2所述的方法，其特征在于，所述获取所述轮播主图中的指定区域，包括：
基于视觉显著性检测方法提取所述轮播主图的显著区域作为所述轮播主图中的指定区域。


5.根据权利要求2所述的方法，其特征在于，所述确定所述轮播主图中除所述指定区域外的其他区域，包括：
将所述轮播主图划分为多个第一区域；
获取所述多个第一区域的中心位置与所述指定区域之间的多个距离，所述多个距离与所述多个第一区域一一对应；
确定所述多个距离中最大距离所对应的第一目标区域；
确定所述第一目标区域中除所述指定区域外的其他区域。


6.根据权利要求2所述的方法，其特征在于，所述根据所述其他区域，确定缩略图组件的渲染位置，包括：
根据所述其他区域，确定缩略图组件在轮播界面中的渲染区域；
根据所述渲染区域以及预配置的配置样式，确定缩略图组件在轮播界面中的渲染位置。


7.根据权利要求1所述的方法，其特征在于，所述基于所述渲染位置以及所述图像数据，渲染所述缩略图组件，包括：
判断当前的性能参数是否满足预设条件；
当不满足所述预设条件时，基于所述渲染位置以及所述图像数据，异步渲染缩略图组件，所述异步渲染用于表征所述缩略图组件的渲染线程的优先级低于指定优先级。


8.根据权利要求7所述的方法，其特征在于，所述判断当前的性能参数是否满足预设条件，包括：
判断当前的网络带宽是否大于带宽阈值；
所述当不满足所述预设条件时，基于所述渲染位置以及所述图像数据，异步渲染缩略图组件，包括：
当所述网络带宽不大于带宽阈值时，基于所述渲染位置以及所述图像数据，异步渲染缩略图组件。


9.根据权利要求7所述的方法，其特征在于，所述判断当前的性能参...

【专利技术属性】
技术研发人员：陈锴林，
申请(专利权)人：广州华多网络科技有限公司，
类型：发明
国别省市：广东;44