图片查看方法及装置
技术领域
本申请涉及通信领域,尤其涉及一种图片查看方法及装置。
背景技术
用户在查看网站提供的高清图片时,通常可以先在预览页面中查看高清图片的缩略图,然后通过点击缩略图来加载查看对应的高清大图。然而,这种浏览图片的方式会受到用户网速的影响,随着高清图片的质量不断提高,如果用户的网速较慢,则会影响图片的加载速度,浪费用户的时间。而且,用户在查看高清大图时,可能只是对该图片中的局部区域感兴趣,而并不需要查看高清图片的全部信息,因此通过这种浏览图片的方式,无法满足用户的需求。
发明内容
本申请提出一种图片查看方法,该方法包括:
在加载目标图片时,判断所述目标图片是否加载完成;
当所述目标图片未加载完成时,基于用户针对所述目标图片的加载界面的操作焦点获取用户在所述目标图片中选定的局部加载区域;
优先加载获取到的所述局部加载区域中的图像直至所述目标图片加载完成。
可选的,所述基于用户针对所述目标图片的加载界面的操作焦点获取用户在所述目标图片中选定的局部加载区域之前,所述方法包括:
基于当前的图片加载速度以及所述目标图片的大小计算所述目标图片的预计加载时长;
判断计算出的所述预计加载时长是否达到预设阈值;
当计算出的所述预计加载时长达到预设阈值时,启动针对所述目标图片的局部加载模式。
可选的,所述启动针对所述目标图片的局部加载模式包括:
基于当前的图片加载速度计算所述局部加载区域的区域大小;
其中,所述局部加载区域的区域大小与所述当前的图片加载速度长成正比。
可选的,当所述操作焦点为悬浮在所述目标图片的加载界面上的鼠标指针时,所述启动针对所述目标图片的局部加载模式还包括:
将所述操作焦点切换至预设状态;所述预设状态用于提示用户针对所述目标图片进行局部加载;
以所述操作焦点为中心点在所述操作焦点下方显示设定大小的局部加载区域;其中,所述设定大小与计算出的所述区域大小相同;所述局部加载区域跟随所述操作焦点移动。
可选的,所述基于用户针对所述目标图片的加载界面的操作焦点获取用户在所述目标图片中选定的局部加载区域包括:
监听用户针对所述操作焦点的预设鼠标事件;
当监听到针对所述操作焦点的预设鼠标事件时,获取在所述操作焦点下方显示的所述局部加载区域。
可选的,当所述操作焦点为用户针对所述目标图片的加载界面的触摸点时,所述基于用户针对所述目标图片的加载界面的操作焦点获取用户在所述目标图片中选定的局部加载区域包括:
监听用户针对所述目标图片的加载界面的预设触摸事件;
当监听到针对所述目标图片的加载界面的预设触摸事件时,获取与所述预设触摸事件对应的触摸点;
以所述触摸点为中心点获取设定大小的局部加载区域;其中,所述设定大小与计算出的所述区域大小相同。
可选的,所述方法还包括:
将获取到所述局部加载区域在所述目标图片的加载界面中显示。
本申请还提出一种图片查看装置,该装置法包括:
第一判断模块,用于在加载目标图片时,判断所述目标图片是否加载完成;
获取模块,用于在所述目标图片未加载完成时,基于用户针对所述目标图片的加载界面的操作焦点获取用户在所述目标图片中选定的局部加载区域;
加载模块,用于优先加载获取到的所述局部加载区域中的图像直至所述目标图片加载完成。
可选的,所述装置还包括:
计算模块,用于基于当前的图片加载速度以及所述目标图片的大小计算所述目标图片的预计加载时长;
第二判断模块,用于判断计算出的所述预计加载时长是否达到预设阈值;
启动模块,用于在计算出的所述预计加载时长达到预设阈值时,启动针对所述目标图片的局部加载模式。
可选的,所述启动模块具体用于:
基于当前的图片加载速度计算所述局部加载区域的区域大小;
其中,所述局部加载区域的区域大小与所述当前的图片加载速度长成正比。
可选的,当所述操作焦点为悬浮在所述目标图片的加载界面上的鼠标指针时,所述启动模块进一步用于:
将所述操作焦点切换至预设状态;所述预设状态用于提示用户针对所述目标图片进行局部加载;
以所述操作焦点为中心点在所述操作焦点下方显示设定大小的局部加载区域;其中,所述设定大小与计算出的所述区域大小相同;所述局部加载区域跟随所述操作焦点移动。
可选的,所述获取模块具体用于:
监听用户针对所述操作焦点的预设鼠标事件;
当监听到针对所述操作焦点的预设鼠标事件时,获取在所述操作焦点下方显示的所述局部加载区域。
可选的,当所述操作焦点为用户针对所述目标图片的加载界面的触摸点时,所述获取模块具体用于:
监听用户针对所述目标图片的加载界面的预设触摸事件;
当监听到针对所述目标图片的加载界面的预设触摸事件时,获取与所述预设触摸事件对应的触摸点;
以所述触摸点为中心点获取设定大小的局部加载区域;其中,所述设定大小与计算出的所述区域大小相同。
可选的,所述获取模块进一步用于:将获取到所述局部加载区域在所述目标图片的加载界面中显示。
本申请中,通过在加载目标图片时,判断所述目标图片是否加载完成;当所述目标图片未加载完成时,获取用户在所述目标图片中选定的局部加载区域,并优先加载所述局部加载区域中的图像直至所述目标图片加载完成。由于本申请中在加载目标图片时,优先加载用户在目标图片中选定的局部加载区域,因此可以实现在全局加载目标图片的过程中,触发局部加载,在不影响全局加载的前提下,可以优先加载该目标图片中由用户选定的局部区域,从而可以在目标图片较大且用户的网速较慢时,提升目标图片的加载速度。
附图说明
图1是本申请一实施例提供的一种图片查看方法的流程图;
图2是本申请一实施例提供的一种图片加载界面的示意图;
图3是本申请一实施例提供的一种在图片加载界面中进行鼠标拖动交互的示意图;
图4是本申请一实施例提供的一种图片查看装置的逻辑框图;
图5是本申请一实施例提供的承载所述一种图片查看装置的客户端的硬件结构图。
具体实施方式
在相关技术中,用户在查看高清大图时,如果用户只对该图片的局部区域感兴趣,通常的做法是将用户感兴趣的区域局部放大,来满足用户的这一需求。例如,在一些电商网站,通常提供产品的预览缩略图,如果用户希望查看产品的高清大图,可以点击缩略图来加载查看对应的高清大图。如果用户希望查看产品的局部图片,用户可以使用鼠标悬浮在缩略图上,然后对该缩略图中用户鼠标所在位置进行局部放大,来向用户呈现高清的局部图片。
然而,在这种方案中,局部放大图片的功能和完全加载高清大图的功能是完全独立的,当用户点击缩略图来加载查看对应的高清大图后,不能优先进行局部加载。如果高清大图加载过慢时,用户只能先关闭高清大图的加载界面,返回到缩略图模式,然后使用鼠标悬浮在缩略图上,来触发局部放大,可见这两种图片显示方式切换够不灵活。
而且,用户在使用鼠标触发局部放大查看局部的高清图片时,用户只能查看到鼠标所在位置的局部区域的高清图片,用户已经查看过的局部区域不能够集中展现,因此用户无法把握当前查看的局部区域在整体图片中的位置,从而造成不便。
有鉴于此,本申请提出一种图片查看方法,通过在加载目标图片时,判断所述目标图片是否加载完成;当所述目标图片未加载完成时,获取用户在所述目标图片中选定的局部加载区域,并优先加载所述局部加载区域中的图像直至所述目标图片加载完成。
由于本申请中在加载目标图片时,优先加载用户在目标图片中选定的局部加载区域,因此可以实现在全局加载目标图片的过程中,触发局部加载,在不影响全局加载的前提下,可以优先加载该目标图片中由用户选定的局部区域,从而可以在目标图片较大且用户的网速较慢时,提升目标图片的加载速度。
下面通过具体实施例并结合具体的应用场景对本申请进行描述。
请参考图1,图1是本申请一实施例提供的一种图片查看方法,应用于客户端,所述方法执行以下步骤:
步骤101,在加载目标图片时,判断所述目标图片是否加载完成;
步骤102,当所述目标图片未加载完成时,基于用户针对所述目标图片的加载界面的操作焦点获取用户在所述目标图片中选定的局部加载区域;
步骤103,优先加载获取到的所述局部加载区域中的图像直至所述目标图片加载完成。
上述目标图片可以包括存储于网络页面上的网络图片;例如,该目标图片可以是电商网站的上存储的产品大图。上述客户端可以包括面向用户提供图片展示服务的客户端软件;例如,该客户端软件可以是电商的购物客户端,该购物客户端可以面向用户提供产品图片的展示服务。
其中,承载上述客户端的硬件环境,在本申请中不进行特别限定;例如,可以是用户的移动智能终端或者PC终端。即在本申请中,上述客户端可以承载在用户的触屏智能终端上的APP应用,也可以是承载在PC终端的web应用。
在本例中,用户在使用客户端查看目标图片时,该目标图片所在的页面上可以预先提供该目标图片的缩略图,用户可以通过在该页面中点击该缩略图来触发客户端加载该目标图片的高清大图。
客户端在加载该目标图片的高清大图时,可以向用户输出一个高清大图的加载界面,其中该加载界面的大小与该高清大图的实际大小相同。当输出该加载界面后,客户端可以与该高清大图的存储服务器进行交互,向存储服务器来获取该高清大图的图像数据,并将获取到的图像数据加载到该加载界面中。
其中,该高清图片在加载完成之前,由于该高清图片的图像数据尚未下载完成,客户端可能只得到了高清图片的部分图像数据,因此该高清图片将在该加载界面中以较低的分辨率显示。此时,该高清图片虽然以较低的分辨率显示,但图片的大小与高清大图保持一致,并且像素位置也与高清大图保持对应。
在本例中,客户端加载该目标图片的高清大图的过程中,可以在后台实时的判断该目标图片的高清大图是否加载完成;例如,客户端可以与存储服务器进行交互来获取该高清大图的实际大小,然后通过在后台判断当前加载完成的图像数据的大小是否达到该高清大图的实际大小,来确定该目标图片的高清大图是否加载完成。如果该目标图片的高清大图未记载完成,此时可以触发客户端启动针对该目标图片的局部加载模式。
其中,客户端在启动针对该目标图片的局部加载模式时,可以通过判断该目标图片的预计加载时长是否达到预设阈值来触发。
在实现时,客户端可以预设一个预计加载时长的阈值,并在加载该目标图片的高清大图的过程中,基于当前的图片加载速度(比如用户当前的网速)和该目标图片的高清大图的大小来计算该高清大图的预计加载时长。比如,可以将该高清大图的大小除以当前的网速得到预计加载完成的时长。
当计算出该高清大图的预计加载时长后,客户端可以将计算出的该预计加载时长与预设的该预计加载时长的阈值进行比较,如果计算出的该预计加载时长达到该阈值后,此时高清大图的预计加载时长比较长,表明用户的网速可能不够理想,因此可以触发客户端启动针对该目标图片的局部加载模式。
可见,通过将计算出的预计加载时长与预设的阈值进行比较,并在计算出的预计加载时长达到预设的阈值后,再触发客户端启动针对该目标图片的局部加载模式,可以在用户的网速不够理想的情况下,触发客户端启动局部加载模式,而且还可以在用户的网速充足的情况下,避免由于误触发了局部加载模式而影响目标图片正常的全局加载的问题。
在本例中,当客户端启动了针对目标图片的局部加载模式后,此时客户端可以基于当前的图片加载速度来为该目标图片计算可以即时加载的局部加载区域的大小。
其中,该局部加载区域的区域大小与当前的图片加载速度成正比,即当用户的网速越高,图片加载速度越大,此时该目标图片可以即时加载的局部加载区域的大小就越大;当用户的网速越低,图片加载速度越小,此时该目标图片可以即时加载的局部加载区域的大小就越小。
例如,在实现时,客户端可以在后台预先创建一个图片加载速度与局部加载区域的大小之间的映射表,客户端在计算该局部加载区域的大小时,可以实时监控当前的图片加载速度,并将当前的图片加载速度在上述映射表中匹配,来为当前的图片加载速度适配对应大小的局部加载区域。
可见,通过这种方式,可以基于实际的图片加载速度来充分适配可即时加载的局部加载区域的大小,从而可以充分适应用户不同的网络状况。
在本例中,当客户端基于当前的图片加载速度为该目标图片计算出可以即时加载的局部加载区域的大小后,此时该目标图片的高清大图尚未加载完成,客户端可以开始基于用户针对该目标图片的加载界面的操作焦点来获取用户在该目标图片中选定的局部加载区域。
其中,当上述客户端为PC终端上的web应用时,用户针对该目标图片的加载界面的操作焦点可以是悬浮在该目标图片的加载界面上的鼠标指针。当上述客户端为触屏智能终端上的APP应用,用户针对该目标图片的加载界面的操作焦点,可以是用户针对该目标图片的加载界面的触摸点。
以下结合以上两种不同的实现环境分别进行描述。
在示出的一种应用场景中,如果上述客户端为PC终端上的web应用时,比如,该客户端为电商面向用户提供产品图片展示的web客户端,此时用户针对该目标图片的加载界面的操作焦点,则可以是悬浮在该目标图片的加载界面上的鼠标指针。
因此,在这种情况下,用户可以通过操作鼠标,移动悬浮在该加载界面上的鼠标指针来选定想要优先查看的局部区域。此时用户选定的该优先查看的局部区域即为客户端要优先加载的局部加载区域。
在这种场景中,客户端在启动了针对目标图片的局部加载模式后,还可以将当前的操作焦点,即悬浮在加载区域之上的鼠标指针,切换至预设状态,其中,该预设状态用于提示用户针对该目标图片进行局部加载。
例如,请参见图2,客户端可以将鼠标指针的光标由默认状态切换至可点击状态,将鼠标指针的光标由默认的图标样式,切换为一个放大的图标样式,从而提示用户当前已经启动了针对目标图片的局部加载模式,此时可以对该目标图片进行局部加载。
请继续参见图2,当客户端将该鼠标指针切换为预设状态后,可以以该鼠标指针为中心点,在该鼠标指针的下方显示一个设定大小的局部加载区域。其中,该设定大小与客户端基于当前的图片加载速度计算出的可以即时加载的局部加载区域的大小相同。
同时,为了更加便于用户选定想要优先加载的局部区域,客户端在该鼠标指针的下方显示的局部加载区域可以跟随用户的鼠标指针移动。从而当鼠标指针移动到了新的位置时,客户端可以实时的向用户提示当前可以优先加载的局部区域。
在本例中,当客户端在该鼠标指针的下方显示出一个设定大小的局部加载区域后,此时客户端可以监听用户针对该鼠标指针的鼠标事件,并判断监听到的鼠标事件是否为预设鼠标事件;当客户端监听到的针对该鼠标指针的鼠标事件为预设鼠标事件时,此时客户端可以立即获取在该鼠标指针下方显示的局部加载区域,然后优先加载获取到的该局部加载区域中的图像。当该局部加载区域中的图像加载完成后,该区域中的图像将高清显示。
其中,值得说明的是,上述预设鼠标事件可以包括鼠标点击事件和鼠标拖动事件。
一方面,当上述预设鼠标事件为鼠标点击事件时,客户端监听到用户的鼠标点击事件后,可以立即获取在鼠标指针下发显示的局部加载区域,然后优先加载该区域中的图像。通过这种方式可以实现,用户将鼠标指针移动到加载界面中的一个新的位置时,通过点击鼠标就可以立即将该鼠标下发显示的局部加载区域选中,并优先加载该区域的图像。
另一方面,请参见图3,当上述预设鼠标事件为鼠标拖动事件时,由于鼠标拖动事件的鼠标指针的位置会发生变化,此时鼠标指针下方显示的局部加载区域,则可以是以鼠标指针的拖动轨迹为中心的多个设定大小局部加载区域组成的一个狭长的区域。客户端监听到用户的鼠标拖动事件后,可以立即获取在鼠标指针下发显示的以鼠标指针的拖动轨迹为中心点的多个设定大小局部加载区域,然后优先加载该多个局部加载区域的图像。通过这种方式可以实现,用户通过在加载界面中拖动鼠标,就可以立即将该鼠标下发显示的以鼠标指针的拖动轨迹为中心点的多个设定大小局部加载区域所组成的一个狭长的区域选中,并优先加载该狭长区域中的图像。
在本例中,当用户通过以上方式选定了其它新的局部加载区域后,客户端可以重复以上过程,优先加载用户选定的局部加载区域,直至目标图片的高清大图在加载界面中完全加载完成。
另外,值得说明的是,当用户在加载界面中选定的局部加载区域中的图像加载完成后,将作为该目标图片的高清大图的一部分进行高清显示,当用户通过移动鼠标指针选定了新的局部加载区域后,已经加载完成的该局部加载区域中的图像,将作为目标图片的高清大图的一部分继续显示不会消失,从而用户可以充分把握当前查看的局部区域在整体图片中的位置。
在示出的另一种应用场景中,如果上述客户端为触屏智能终端上的APP应用时,比如,该客户端为电商面向用户提供产品图片展示的手机版客户端,此时用户针对该目标图片的加载界面的操作焦点,则可以是用户针对该目标图片的加载界面上的触摸点。
在这种情况下,由于触摸设置中不再提供用于指示的鼠标指针,客户端在启动针对目标图片的局部加载模式后,将无法通过将鼠标指针切换状态以及在鼠标指针下发显示设定大小的局部加载区域,来提示用户当前可以选定的局部加载区域。
因此,在本例中,用户可以通过触摸目标图片的加载界面,来选定想要优先查看的局部区域。此时用户选定的该优先查看的局部区域即为客户端要优先加载的局部加载区域。
在本例中,客户端可以在后台实时监听用户针对该目标图片的加载界面的触摸事件,并判断监听到的触摸事件是否为预设触摸事件;当客户端监听到的针对该加载界面的触摸事件为预设鼠标事件时,此时客户端可以立即获取该预设触摸事件的触摸点,然后以该触摸点为中心点,获取设定大小的局部加载区域,并优先加载该区域中的图像,此时该设定大小仍然与客户端基于当前的图片加载速度计算出的可以即时加载的局部加载区域的大小相同。当该局部加载区域中的图像加载完成后,该区域中的图像将高清显示。
其中,值得说明的是,上述预设触摸事件可以包括点击事件和滑动事件。
一方面,当上述预设触摸事件为点击事件时,客户端监听到用户的点击事件后,可以立即获取该点击事件的触摸点,然后以该触摸点为中心点,获取设定大小的局部加载区域,并优先加载该区域中的图像。通过这种方式可以实现,用户在加载界面中进行点击操作,就可以将以点击的位置为中心的设定大小的局部加载区域选中,并优先加载该区域的图像。
另一方面,当上述预设触摸事件为滑动事件时,由于滑动事件可以包括多个连续的触摸点,因此当客户端监听到用户的滑动事件后,可以立即获取与该滑动事件对应的多个连续的触摸点,并分别以该多个连续的触摸点为中心获取设定大小的局部加载区域,然后优先加载获取到的局部加载区域中的图像。通过这种方式可以实现,用户通过在加载界面中进行手指拖动操作,就可以立即将以拖动轨迹上的触摸点为中心点的多个设定大小局部加载区域所组成的一个狭长的区域选中,并优先加载该狭长区域中的图像。
另外,当客户端基于用户的触摸点为中心点,获取到了设定大小的局部加载区域后,还可以将获取到的局部加载区域在目标图片的加载界面中进行显示,以提示用户当前选定的局部加载区域。从而用户通过查看加载界面中显示的该局部加载区域,就可以获知到当前所选定的局部加载区域。
在本例中,当用户通过以上方式选定了其它新的局部加载区域后,客户端可以重复以上过程,优先加载用户选定的局部加载区域,直至目标图片的高清大图在加载界面中完全加载完成。
在以上实施例中,通过在加载目标图片时,判断所述目标图片是否加载完成;当所述目标图片未加载完成时,获取用户在所述目标图片中选定的局部加载区域,并优先加载所述局部加载区域中的图像直至所述目标图片加载完成。由于本申请中在加载目标图片时,优先加载用户在目标图片中选定的局部加载区域,因此可以实现在全局加载目标图片的过程中,触发局部加载,在不影响全局加载的前提下,可以优先加载该目标图片中由用户选定的局部区域,从而可以在目标图片较大且用户的网速较慢时,提升目标图片的加载速度。
与上述方法实施例相对应,本申请还提供了装置的实施例。
请参见图4,本申请提出一种图片查看装置40,应用于客户端;其中,请参见图5,作为承载所述图片查看装置40的客户端所涉及的硬件架构中,通常包括CPU、内存、非易失性存储器、网络接口以及内部总线等;以软件实现为例,所述图片查看装置40通常可以理解为加载在内存中的计算机程序,通过CPU运行之后形成的软硬件相结合的逻辑装置,所述装置40包括:
第一判断模块401,用于在加载目标图片时,判断所述目标图片是否加载完成;
获取模块402,用于在所述目标图片未加载完成时,基于用户针对所述目标图片的加载界面的操作焦点获取用户在所述目标图片中选定的局部加载区域;
加载模块403,用于优先加载获取到的所述局部加载区域中的图像直至所述目标图片加载完成。
在本例中,所述装置40还可以包括:
计算模块404,用于基于当前的图片加载速度以及所述目标图片的大小计算所述目标图片的预计加载时长;
第二判断模块405,用于判断计算出的所述预计加载时长是否达到预设阈值;
启动模块406,用于在计算出的所述预计加载时长达到预设阈值时,启动针对所述目标图片的局部加载模式。
在本例中,所述启动模块406具体用于:
基于当前的图片加载速度计算所述局部加载区域的区域大小;
其中,所述局部加载区域的区域大小与所述当前的图片加载速度长成正比。
在本例中,当所述操作焦点为悬浮在所述目标图片的加载界面上的鼠标指针时,所述启动模块406进一步用于:
将所述操作焦点切换至预设状态;所述预设状态用于提示用户针对所述目标图片进行局部加载;
以所述操作焦点为中心点在所述操作焦点下方显示设定大小的局部加载区域;其中,所述设定大小与计算出的所述区域大小相同;所述局部加载区域跟随所述操作焦点移动。
在本例中,当所述操作焦点为悬浮在所述目标图片的加载界面上的鼠标指针时,所述获取模块403具体用于:
监听用户针对所述操作焦点的预设鼠标事件;
当监听到针对所述操作焦点的预设鼠标事件时,获取在所述操作焦点下方显示的所述局部加载区域。
在本例中,当所述操作焦点为用户针对所述目标图片的加载界面的触摸点时,所述获取模块403具体用于:
监听用户针对所述目标图片的加载界面的预设触摸事件;
当监听到针对所述目标图片的加载界面的预设触摸事件时,获取与所述预设触摸事件对应的触摸点;
以所述触摸点为中心点获取设定大小的局部加载区域;其中,所述设定大小与计算出的所述区域大小相同。
在本例中,当所述操作焦点为用户针对所述目标图片的加载界面的触摸点时,所述获取模块403进一步用于:
将获取到所述局部加载区域在所述目标图片的加载界面中显示。
本领域技术人员在考虑说明书及实践这里公开的发明后,将容易想到本申请的其它实施方案。本申请旨在涵盖本申请的任何变型、用途或者适应性变化,这些变型、用途或者适应性变化遵循本申请的一般性原理并包括本申请未公开的本技术领域中的公知常识或惯用技术手段。说明书和实施例仅被视为示例性的,本申请的真正范围和精神由下面的权利要求指出。
应当理解的是,本申请并不局限于上面已经描述并在附图中示出的精确结构,并且可以在不脱离其范围进行各种修改和改变。本申请的范围仅由所附的权利要求来限制。
以上所述仅为本申请的较佳实施例而已,并不用以限制本申请,凡在本申请的精神和原则之内,所做的任何修改、等同替换、改进等,均应包含在本申请保护的范围之内。