一种静态图片的动态显示方法、装置及设备与流程

文档序号:13215324阅读:212来源:国知局
技术领域本申请涉及信息显示技术领域,特别涉及一种静态图片的动态显示方法、装置及设备。

背景技术:
随着多媒体显示技术的发展,各种数字图片已经可以在网页、应用等多种载体上显示。一般的数字图片可以根据图片的状态分为两类:静态图片和动态图片。动态图片由于能够给人以生动的体验感被越来越多地应用。现有的在网页中显示动态图片的方法通常是通过多张静态图片的连续播放来实现的,包括:接收与一个图片相关的多个状态下的多张图片,按预设的时间顺序播放所述多张图片形成动态图片。例如,制作动态的IconFont,用户可以提供多个形状下的图标,通过连续播放不同形状下的图标,可以呈现出一个动态的图标。在实现本申请过程中,发明人发现现有技术中至少存在如下问题:呈现一个动态图片需要同时存储多张静态图片,需要占用的空间资源大。

技术实现要素:
本申请实施例的目的是提供一种静态图片的动态显示方法、装置及设备,以节省图片占用的空间资源。为解决上述技术问题,本申请实施例提供一种静态图片的动态显示方法、装置及设备是这样实现的:一种静态图片的动态显示方法,包括:获取并显示原始图片;所述原始图片为静态图片;获取触发更改图片属性值的信号,显示更改页面;获取更改信息,根据所述更改信息在所述更改页面上显示目标图片,生成与所述目标图片对应的目标参数;获取动态显示参数,完成原始图片动态显示的设置;获取动态显示原始图片的触发信号,根据所述动态显示参数,动态显示所述原始图片与目标图片转换的过程。一种静态图片的动态显示装置,包括:显示原始图片模块、更改页面显示模块、更改信息接收模块、动态显示参数模块和动态显示模块;其中,所述显示原始图片模块,用于获取并显示原始图片;所述原始图片为静态图片;所述更改页面显示模块,用于获取触发更改图片属性值的信号,显示更改页面;所述更改信息接收模块,用于获取更改信息,根据所述更改信息在所述更改页面显示模块显示的更改页面上显示目标图片,生成与所述目标图片对应的目标参数;所述动态显示参数模块,用于获取动态显示参数,完成原始图片动态显示的设置;所述动态显示模块,用于获取动态显示原始图片的触发信号,根据所述动态显示参数,动态显示所述原始图片与目标图片转换的过程。一种静态图片的动态显示设备,其特征在于,所述设备包括:显示器和处理器;其中,所述处理器,用于控制所述显示器的显示内容、根据获取的信息生成与目标图片对应的目标参数、完成原始图片动态显示的设置;所述显示器,用于显示原始图片、更改页面,所述显示器还用于动态显示所述原始图片变化为与所述目标参数对应的目标图片的过程。由以上本申请实施例提供的技术方案可见,本申请实施例公开的静态图片的动态显示的方法、装置及设备,在进行图片动态显示的过程中,通过更改所述图片的属性值,完成图片的渐变,使得动态显示图片的过程只需要保存原始图片,节省了图片占用的空间资源。同时,可以为用户呈现用于更改图片属性值的更改页面,在所述更改页面上,用户可以实时观察到更改属性值后目标图片的效果,以得到使所述原始图片达到目标图片效果的属性值,可以提高用户体验。另外通过对动态显示参数的设置,可以根据用户需求设置图片动态显示的显示时间和显示效果,进一步提高了用户的体验。附图说明为了更清楚地说明本申请实施例或现有技术中的技术方案,下面将对实施例或现有技术描述中所需要使用的附图作简单地介绍,显而易见地,下面描述中的附图仅仅是本申请中记载的一些实施例,对于本领域普通技术人员来讲,在不付出创造性劳动性的前提下,还可以根据这些附图获得其他的附图。图1是本申请静态图片的动态显示方法一个实施例的流程图;图2是本申请静态图片的动态显示方法实施例中更改页面的示意图;图3是本申请静态图片的动态显示方法实施例中更改页面的另一示意图;图4是本申请静态图片的动态显示装置一个实施例的模块图;图5是本申请静态图片的动态显示设备一个实施例的组成图。具体实施方式本申请实施例提供一种静态图片的动态显示方法、装置及设备。为了使本技术领域的人员更好地理解本申请中的技术方案,下面将结合本申请实施例中的附图,对本申请实施例中的技术方案进行清楚、完整地描述,显然,所描述的实施例仅仅是本申请一部分实施例,而不是全部的实施例。基于本申请中的实施例,本领域普通技术人员在没有作出创造性劳动前提下所获得的所有其他实施例,都应当属于本申请保护的范围。图1是本申请静态图片的动态显示方法一个实施例的流程图。如图1所示,所述静态图片的动态显示方法可以包括:S101:获取并显示原始图片。图片动态显示装置可以获取原始图片。所述原始图片可以是静态图片。所述原始图片可以是预先存储在所述图片动态显示装置中的图片,也可以是实时接收到的用户上传的图片。所述图片动态显示装置可以显示所述原始图片。所述图片动态显示装置可以是手机或计算机等电子设备。所述图片动态显示装置可以具有触摸感应器件,例如触摸显示屏。所述图片动态显示装置可以包括非触摸的输入装置,例如键盘或鼠标等。S102:获取触发更改图片属性值的信号,显示更改页面。图片动态显示装置可以获取触发更改图片属性值的信号,所述触发更改图片属性值的信号可以包括:用户点击所述图片的信号;或者,所述原始图片所在页面上可以设置有触发更改图片属性的按钮,用户点击所述按钮的信号。获取触发更改图片属性的信号后,可以触发更改图片属性值的事件,图片动态显示装置可以显示用于更改图片属性值的更改页面。所述更改页面可以包括:目标图片、图片的属性以及与所述属性对应的取值范围。所述目标图片可以用于显示更改了原始图片的属性值后具有对应效果的目标图片。所述图片的属性可以表示所述图片的一种效果。所述图片的属性可以包括下述中的至少一种:模糊、亮度、对比度、阴影、透明度、灰度、褐色、反色、色相旋转、饱和度。所述图片的属性可以以列表的形式展现,或者可以以阵列的方式展现。所述图片的属性与所述属性的取值范围具有一一对应的关系。所述原始图片对应的属性的取值可以称为属性基准值。所述与属性对应的取值范围可以预先设定。所述图片的属性取值范围可以利用具有上翻和下翻功能的文本框来显示,也可以利用具有滑动滑块的滑条来显示。所述更改页面可以方便用户了解所述原始图片包含的属性信息,同时便于用户对所述属性值进行更改。通过显示目标图片,可以直观地展示更改了属性信息后图片的效果。在一种优选的实施方式中,所述更改页面还可以包括原始图片,可以呈现给用户原始图片与目标图片的对比效果。在一种优选的实施方式中,所述更改页面还可以包括目标参数显示框。所述目标参数显示框可以用于显示与目标图片对应的目标参数。所述目标参数用于表示图片更改的属性信息。所述目标参数显示框的位置、形状和尺寸可以是预先设定的。所述目标参数显示框可以提供给用户与用户输入的更改信息对应的目标参数。S103:获取更改信息,根据所述更改信息在所述更改页面上显示目标图片,生成与所述目标图片对应的目标参数。图片动态显示装置可以获取用于更改原始图片属性的更改信息。所述更改信息可以是预先设置的,也可以是用户在所述更改页面上输入的。例如,当所述图片的属性的取值范围利用具有上翻和下翻功能的文本框来显示并且所述更改信息为用户输入的更改信息时,所述更改信息可以包括:用户手动输入的属性值信息;或者,用户通过文本框的上翻和下翻功能得到的属性值信息。当所述图片的属性的取值范围利用具有滑动滑块的滑条来显示并且所述更改信息为用户输入的更改信息时,所述更改信息可以包括:用户滑动所述滑动滑块产生的属性值信息。根据所述获取的更改信息,可以形成目标图片以及与目标图片对应的目标参数。图片动态显示装置可以在所述更改页面上显示所述目标图片。所述目标图片可以是所述原始图片动态显示过程结束时所显示的最终状态。所述目标图片可以根据所述获取的更改信息形成。所述目标图片可以根据获得的更改信息实时地显示在所述更改页面上。根据所述更改信息还可以生成与所述目标图片对应的目标参数。所述目标参数可以用于表示图片更改的属性信息。所述目标参数与目标图片可以是一一对应的关系。所述目标参数根据用户输入的更改信息产生。所述目标参数可以用代码化的语言来表示。通过接收并更改所述原始图片的属性值,实时地展现更改后的目标图片,可以便于用户得到需要的目标图片。在一种优选的实施方式中,若所述更改页面上还包括原始图片,所述目标图片与所述原始图片可以同时显示在所述更改页面中。所述目标图片与所述原始图片同时显示,可以直观地呈现动态显示过程前后图片的效果。在一种优选的实施方式中,若所述更改页面上还包含目标参数显示框,所述目标参数还可以实时地显示在所述目标参数显示框中。可以为用户提供标准的代码化的目标参数。在一种优选的实施方式中,所述更改页面上还可以包括恢复功能按钮,所述恢复功能按钮可以用于清除用户输入的更改信息。所述恢复功能按钮可以将目标图片还原为与原始图片相同,并清除已生成的目标参数。可以进一步方便用户对所述目标图片进行重新设置。S104:获取动态显示参数,完成原始图片动态显示的设置。图片动态显示装置可以获取动态显示参数。所述动态显示参数可以用于表示所述原始图片变化到所述目标图片的过程中所关联的参数。所述动态显示参数可以是预先设置的,也可以是用户输入的。所述动态显示参数可以包括:动态显示时间和动态显示触发参数。所述动态显示时间可以用于表示所述原始图片变化到目标图片所需的时间。所述动态显示触发参数,可以用于表示触发动态显示的动作。例如,所述动态显示触发参数可以包括:在预设的第一时间间隔内两次点击所述原始图片,或者,长按所述原始图片至第二时间长度,或者鼠标移至所述原始图片的显示位置处。需要说明的是,所述触发参数还可以为空。获取所述动态显示参数后,可以完成对原始图片进行动态显示的设置。通过进行图片动态显示参数的设置,可以保证图片的动态显示效果,即图片在一个时间段内变化的效果。在一种优选的实施方式中,所述动态显示参数还可以包括:渐变效果函数。所述渐变效果函数可以用于表示所述原始图片变化到所述目标图片的过程中所显示的过渡效果。所述渐变效果函数可以包括:百叶窗渐变函数或贝塞尔曲线函数等。所述获取渐变效果函数可以以类似更改属性值的方式来实现。例如,接收用户输入渐变效果函数,具体可以包括:可以预先存储至少一种渐变效果函数,其中每种函数可以对应一种渐变效果,获取预先设置的或用户输入的选择信息,根据所述选择信息可以确定与所述选择信息对应的渐变效果函数。通过设置不同的渐变效果函数,可以实现满足用户需求的动态显示过程中的渐变效果,可以进一步提高用户体验。在一种优选的实施方式中,所述动态显示参数还可以包括:循环显示参数。所述循环显示参数可以用于实现所述动态显示图片过程的循环播放。所述循环显示参数可以包括:循环显示周期、循环次数、显示顺序参数。所述循环显示周期可以用于表示所述动态显示的图片从当前动态显示过程开始到下一次动态显示过程开始所需要的时间。所述循环显示周期可以大于或等于所述动态显示时间。所述循环次数,可以用于表示所述动态显示的图片从触发动态显示过程开始,动态显示的总次数。所述显示顺序参数,可以包括正向显示参数和/或逆向显示参数。所述正向显示参数可以表示所述图片动态显示的过程包括所述原始图片变化为与所述目标参数对应的目标图片的过程。所述逆向显示参数可以表示所述图片动态显示的过程包括与所述目标参数对应的目标图片变化为所述原始图片的过程。通过设置所述循环显示参数,可以实现图片动态显示的循环播放,可以进一步提高用户的体验。S105:获取动态显示原始图片的触发信号,根据所述动态显示参数,动态显示所述原始图片与目标图片转换的过程。图片动态显示装置可以获取动态显示原始图片的触发信号。所述触发信号可以与所述动态显示触发参数相对应。例如,当设置的动态显示触发参数为在预设的第一时间间隔内两次点击所述原始图片时,对应的触发信号为在预设的第一时间间隔内接收到两次点击所述原始图片的信号;或者,当设置的动态显示触发参数为长按所述原始图片至第二时间长度时,对应的触发信号为长按所述原始图片达到第二时间长度;或者,当设置的动态显示触发参数为鼠标移至所述原始图片的显示位置处时,对应的触发信号为鼠标移动至所述原始图片显示的位置。需要说明的是,当所述触发参数为空时,所述触发信号也可以为空。即当显示的页面中载入所述原始图片后,原始图片可以自动根据所述动态显示参数进行动态显示。接收动态显示原始图片的触发信号后,可以触发所述原始图片的动态显示,动态显示所述原始图片与目标图片转换的过程。当所述动态显示参数还包括循环显示参数,并且所述循环显示参数中的显示顺序参数中包含正向显示参数时,所述动态显示所述原始图片与目标图片转换的过程,可以包括所述原始图片变化为与所述目标参数对应的目标图片的过程。当所述动态显示参数还包括循环显示参数,并且所述循环显示参数中的显示顺序参数中包含逆向显示参数时,所述动态显示所述原始图片与目标图片转换的过程,可以包括与所述目标参数对应的目标图片变化为所述原始图片的过程。下面结合CSS3技术与图1的流程介绍本申请的静态图片的动态显示方法。图片动态显示装置可以是计算机。计算机可以获取原始图片。所述原始图片可以是静态图片。所述原始图片可以是用户输入的,也可以是预先存储在计算机中的。计算机显示所述获取到的原始图片。计算机可以接收用户触发更改图片属性值的信号,例如,用户长按所述图片的信号。接收用户触发更改图片属性值的信号后,计算机可以显示更改页面;所述更改页面可以包括目标图片、图片的属性以及所述属性对应的取值范围。图2示出了本申请静态图片的动态显示方法实施例中更改页面的示意图。图2中,图片属性包括:模糊、亮度、对比度、透明度、灰度、褐色、反色、色相旋转、饱和度和阴影。图片属性以列表的方式展现。图2中,所述更改页面还包括了目标参数显示框201和恢复功能按钮202。计算机接收用户输入的更改信息,例如用户滑动属性值范围滑条中滑块的信息。根据所述更改信息在所述更改页面上显示目标图片,并生成与所述目标图片对应的目标参数。所述目标参数可以以代码化的语言显示在所述目标参数显示框中。图3示出了本申请静态图片的动态显示方法实施例中更改页面的另一示意图。图3中,接收到用户输入的更改信息包括:将属性“色相旋转”的值设定为224deg,将属性“饱和度”的值设定为297%,将属性“阴影”的值设定为0px、0px、100px。相应地,所述目标参数显示框201中所显示的代码化参数为“hue-rotate(224deg)saturate(297%)drop-shadow(0px0px100px#fffboo)”。计算机还接收用户输入的动态显示参数,完成原始图片动态显示的设置。例如,所述动态显示参数可以包括:显示时间为0.6秒,渐变效果为贝塞尔曲线,动态显示触发参数为鼠标移至所述原始图片的显示位置。所述动态显示参数可以以代码化语言实现。计算机可以接收动态显示原始图片的触发信号,根据所述动态显示参数,动态显示所述原始图片与目标图片转换的过程。例如,在显示原始图片的页面上,当鼠标移至原始图片上时,所述原始图片在0.6秒的时间内以贝塞尔曲线的形式渐变为目标参数对应的目标图片。上述实施例公开的静态图片的动态显示的方法,在进行图片动态显示的过程中,通过更改所述图片的属性值,完成图片的渐变,使得动态显示图片的过程只需要保存原始图片,节省了图片占用的空间资源。可以为用户呈现用于更改图片属性值的更改页面,在所述更改页面上,用户可以实时观察到更改属性值后目标图片的效果,以得到使所述原始图片达到目标图片效果的属性值,可以提高用户体验。另外通过对动态显示参数的设置,可以根据用户需求设置图片动态显示的显示时间和显示效果,进一步提高了用户的体验。下面介绍本申请一种静态图片的动态显示装置的实施例。图4是本申请图片动态显示装置一个实施例的模块图。如图4所示,所述动态显示装置可以包括:显示原始图片模块401、更改页面显示模块402、更改信息接收模块403、动态显示参数模块404和动态显示模块405。其中,所述显示原始图片模块401,可以用于获取并显示原始图片;所述原始图片可以是静态图片。所述更改页面显示模块402,可以用于获取触发更改图片属性值的信号,显示更改页面。所述更改信息接收模块403,可以用于获取更改信息,根据所述更改信息在所述更改页面显示模块402显示的更改页面上显示目标图片,生成与所述目标图片对应的目标参数。所述动态显示参数模块404,可以用于获取动态显示参数,完成原始图片动态显示的设置。所述动态显示模块405,可以用于获取动态显示原始图片的触发信号,根据所述动态显示参数,动态显示所述原始图片与目标图片转换的过程。上述实施例公开的静态图片的动态显示装置与本申请静态图片的动态显示方法实施例相对应,可以实现本申请方法实施例的技术效果。下面介绍本申请一种静态图片的动态显示设备的实施例。图5是本申请静态图片的动态显示设备一个实施例的组成图。如图5所示,所述静态图片的动态显示设备,可以包括:显示器501和处理器502。其中,所述处理器502可以用于接收用户输入的信息,根据控制所述显示器501的显示内容、根据获取的信息生成与目标图片对应的目标参数、完成原始图片动态显示的设置。所述显示器501可以用于显示原始图片、更改页面,所述显示器还可以用于动态显示所述原始图片变化为与所述目标参数对应的目标图片的过程。若所述显示器501是具有触摸感应功能的显示设备,所述显示器还可以用于接收用户输入的信息。本申请静态图片的动态显示设备可以是本申请静态图片的动态显示装置的一种硬件实施方式,可以实现本申请方法实施例和装置实施例的技术效果。在20世纪90年代,对于一个技术的改进可以很明显地区分是硬件上的改进(例如,对二极管、晶体管、开关等电路结构的改进)还是软件上的改进(对于方法流程的改进)。然而,随着技术的发展,当今的很多方法流程的改进已经可以视为硬件电路结构的直接改进。设计人员几乎都通过将改进的方法流程编程到硬件电路中来得到相应的硬件电路结构。因此,不能说一个方法流程的改进就不能用硬件实体模块来实现。例如,可编程逻辑器件(ProgrammableLogicDevice,PLD)(例如现场可编程门阵列(FieldProgrammableGateArray,FPGA))就是这样一种集成电路,其逻辑功能由用户对器件编程来确定。由设计人员自行编程来把一个数字系统“集成”在一片PLD上,而不需要请芯片制造厂商来设计和制作专用的集成电路芯片2。而且,如今,取代手工地制作集成电路芯片,这种编程也多半改用“逻辑编译器(logiccompiler)”软件来实现,它与程序开发撰写时所用的软件编译器相类似,而要编译之前的原始代码也得用特定的编程语言来撰写,此称之为硬件描述语言(HardwareDescriptionLanguage,HDL),而HDL也并非仅有一种,而是有许多种,如ABEL(AdvancedBooleanExpressionLanguage)、AHDL(AlteraHardwareDescriptionLanguage)、Confluence、CUPL(CornellUniversityProgrammingLanguage)、HDCal、JHDL(JavaHardwareDescriptionLanguage)、Lava、Lola、MyHDL、PALASM、RHDL(RubyHardwareDescriptionLanguage)等,目前最普遍使用的是VHDL(Very-High-SpeedIntegratedCircuitHardwareDescriptionLanguage)与Verilog2。本领域技术人员也应该清楚,只需要将方法流程用上述几种硬件描述语言稍作逻辑编程并编程到集成电路中,就可以很容易得到实现该逻辑方法流程的硬件电路。控制器可以按任何适当的方式实现,例如,控制器可以采取例如微处理器或处理器以及存储可由该(微)处理器执行的计算机可读程序代码(例如软件或固件)的计算机可读介质、逻辑门、开关、专用集成电路(ApplicationSpecificIntegratedCircuit,ASIC)、可编程逻辑控制器和嵌入微控制器的形式,控制器的例子包括但不限于以下微控制器:ARC625D、AtmelAT91SAM、MicrochipPIC18F26K20以及SiliconeLabsC8051F320,存储器控制器还可以被实现为存储器的控制逻辑的一部分。本领域技术人员也知道,除了以纯计算机可读程序代码方式实现控制器以外,完全可以通过将方法步骤进行逻辑编程来使得控制器以逻辑门、开关、专用集成电路、可编程逻辑控制器和嵌入微控制器等的形式来实现相同功能。因此这种控制器可以被认为是一种硬件部件,而对其内包括的用于实现各种功能的装置也可以视为硬件部件内的结构。或者甚至,可以将用于实现各种功能的装置视为既可以是实现方法的软件模块又可以是硬件部件内的结构。上述实施例阐明的系统、装置、模块或单元,具体可以由计算机芯片或实体实现,或者由具有某种功能的产品来实现。为了描述的方便,描述以上装置时以功能分为各种单元分别描述。当然,在实施本申请时可以把各单元的功能在同一个或多个软件和/或硬件中实现。通过以上的实施方式的描述可知,本领域的技术人员可以清楚地了解到本申请可借助软件加必需的通用硬件平台的方式来实现。基于这样的理解,本申请的技术方案本质上或者说对现有技术做出贡献的部分可以以软件产品的形式体现出来,在一个典型的配置中,计算设备包括一个或多个处理器(CPU)、输入/输出接口、网络接口和内存。该计算机软件产品可以包括若干指令用以使得一台计算机设备(可以是个人计算机,服务器,或者网络设备等)执行本申请各个实施例或者实施例的某些部分所述的方法。该计算机软件产品可以存储在内存中,内存可能包括计算机可读介质中的非永久性存储器,随机存取存储器(RAM)和/或非易失性内存等形式,如只读存储器(ROM)或闪存(flashRAM)。内存是计算机可读介质的示例。计算机可读介质包括永久性和非永久性、可移动和非可移动媒体可以由任何方法或技术来实现信息存储。信息可以是计算机可读指令、数据结构、程序的模块或其他数据。计算机的存储介质的例子包括,但不限于相变内存(PRAM)、静态随机存取存储器(SRAM)、动态随机存取存储器(DRAM)、其他类型的随机存取存储器(RAM)、只读存储器(ROM)、电可擦除可编程只读存储器(EEPROM)、快闪记忆体或其他内存技术、只读光盘只读存储器(CD-ROM)、数字多功能光盘(DVD)或其他光学存储、磁盒式磁带,磁带磁磁盘存储或其他磁性存储设备或任何其他非传输介质,可用于存储可以被计算设备访问的信息。按照本文中的界定,计算机可读介质不包括短暂电脑可读媒体(transitorymedia),如调制的数据信号和载波。本说明书中的各个实施例均采用递进的方式描述,各个实施例之间相同相似的部分互相参见即可,每个实施例重点说明的都是与其他实施例的不同之处。尤其,对于系统实施例而言,由于其基本相似于方法实施例,所以描述的比较简单,相关之处参见方法实施例的部分说明即可。本申请可用于众多通用或专用的计算机系统环境或配置中。例如:个人计算机、服务器计算机、手持设备或便携式设备、平板型设备、多处理器系统、基于微处理器的系统、置顶盒、可编程的消费电子设备、网络PC、小型计算机、大型计算机、包括以上任何系统或设备的分布式计算环境等等。本申请可以在由计算机执行的计算机可执行指令的一般上下文中描述,例如程序模块。一般地,程序模块包括执行特定任务或实现特定抽象数据类型的例程、程序、对象、组件、数据结构等等。也可以在分布式计算环境中实践本申请,在这些分布式计算环境中,由通过通信网络而被连接的远程处理设备来执行任务。在分布式计算环境中,程序模块可以位于包括存储设备在内的本地和远程计算机存储介质中。虽然通过实施例描绘了本申请,本领域普通技术人员知道,本申请有许多变形和变化而不脱离本申请的精神,希望所附的权利要求包括这些变形和变化而不脱离本申请的精神。
当前第1页1 2 3 
网友询问留言 已有0条留言
  • 还没有人留言评论。精彩留言会获得点赞!
1