CN106408632A - 一种基于属性动画的色调变化动画实现方法及装置 - Google Patents

一种基于属性动画的色调变化动画实现方法及装置 Download PDF

Info

Publication number
CN106408632A
CN106408632A CN201610811213.1A CN201610811213A CN106408632A CN 106408632 A CN106408632 A CN 106408632A CN 201610811213 A CN201610811213 A CN 201610811213A CN 106408632 A CN106408632 A CN 106408632A
Authority
CN
China
Prior art keywords
value
color
color matrix
tone
timing node
Prior art date
Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
Granted
Application number
CN201610811213.1A
Other languages
English (en)
Other versions
CN106408632B (zh
Inventor
尤洋
Current Assignee (The listed assignees may be inaccurate. Google has not performed a legal analysis and makes no representation or warranty as to the accuracy of the list.)
Alibaba China Co Ltd
Original Assignee
Guangzhou Alibaba Literature Information Technology Co Ltd
Priority date (The priority date is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the date listed.)
Filing date
Publication date
Application filed by Guangzhou Alibaba Literature Information Technology Co Ltd filed Critical Guangzhou Alibaba Literature Information Technology Co Ltd
Priority to CN201610811213.1A priority Critical patent/CN106408632B/zh
Publication of CN106408632A publication Critical patent/CN106408632A/zh
Priority to PCT/CN2017/083033 priority patent/WO2018045769A1/zh
Application granted granted Critical
Publication of CN106408632B publication Critical patent/CN106408632B/zh
Active legal-status Critical Current
Anticipated expiration legal-status Critical

Links

Classifications

    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06TIMAGE DATA PROCESSING OR GENERATION, IN GENERAL
    • G06T13/00Animation
    • G06T13/802D [Two Dimensional] animation, e.g. using sprites

Landscapes

  • Physics & Mathematics (AREA)
  • General Physics & Mathematics (AREA)
  • Engineering & Computer Science (AREA)
  • Theoretical Computer Science (AREA)
  • Processing Or Creating Images (AREA)

Abstract

本申请实施例公开了一种基于属性动画的色调变化动画实现方法及装置。所述方法包括:获取原始静态图片;将所述原始静态图片转换为位图;根据预设的时间分段规则生成n个时间节点;在第i个时间节点,根据预设的颜色矩阵初始值F、颜色矩阵结束值L以及颜色矩阵计算规则,计算第i个时间节点的颜色矩阵值;以及,以所述颜色矩阵值为颜色过滤属性的值,根据所述颜色过滤属性对所述位图进行绘制,得到新的图片并显示;其中i为自然数,i=1,2……n。动画图片序列沿时间序列显示,从而在视觉上形成图片色调变化动画。本申请实施例所提供的技术方案简单易行,占用资源少,执行效率高,更利于实时地实现图片色调变化的动画效果。

Description

一种基于属性动画的色调变化动画实现方法及装置
技术领域
本发明涉及动画技术领域,尤其涉及一种基于属性动画的色调变化动画实现方法及装置。
背景技术
动画是将连续渐变的静态图片的序列,沿时间轴顺次更换显示,基于人眼的视觉暂留原理而产生运动视觉感受的媒体形式。为了达到某种动画效果,需要逐帧渐进修改图片的属性比如颜色、图画元素的位置以及图画元素和背景的对比等。色调变化是一种常见的动画效果,指画面的整体颜色逐渐变化,比如天蓝色渐渐转为墨蓝色以表示天黑,或者颜色变亮或变暗表示光线的变化等。
实现色调变化需要按一定的规则改变图片像素的颜色值,使图片像素趋向于某一个色调,最常用的方式是使用底层的OpenGL来控制像素点颜色变化。OpenGL(OpenGraphics Library,开放图形库)是一个跨编程语言和平台的专业图形程序接口和底层图形库,但是对于一个静态图片,基于OpenGL实现色调变化动画,需要技术员编写程序读取图片的像素值,再按照一定时间规律逐个修改图片像素点的颜色值,这样的方法程序复杂,代码编写难度高,不易实现且执行效率低。
发明内容
为克服相关技术中基于属性动画的色调变化动画实现方法复杂度高、执行效率低的问题,本申请提供一种基于属性动画的色调变化动画实现方法及装置,能够简单方便地由静态图片实现色调变化动画。
根据本申请实施例的第一方面,提供一种基于属性动画的色调变化动画实现方法,包括:
获取原始静态图片;
将所述原始静态图片转换为位图;
根据预设的时间分段规则生成n个时间节点;
在第i个时间节点,根据预设的颜色矩阵初始值F、颜色矩阵结束值L以及颜色矩阵计算规则,计算第i个时间节点的颜色矩阵值;以及,
以所述颜色矩阵值为颜色过滤属性的值,根据所述颜色过滤属性对所述位图进行绘制,得到新的图片并显示;
其中i为自然数,i=1,2……n。
结合第一方面,在第一方面第一种可能的实现方式中,所述的基于属性动画的色调变化动画实现方法,在将所述原始静态图片转换为位图之后,根据预设的时间分段规则生成n个时间节点之前,还包括:
根据显示区域的大小对所述位图进行缩放。
结合第一方面,在第一方面第二种可能的实现方式中,所述预设的时间分段规则为时间节点之间的间隔相同且小于0.1秒。
结合第一方面,在第一方面第三种可能的实现方式中,所述颜色矩阵包括红色R分量、绿色G分量、蓝色B分量、透明度Alpha分量和占位符分量。
结合第一方面,在第一方面第四种可能的实现方式中,所述根据预设的颜色矩阵初始值F、颜色矩阵结束值L以及颜色矩阵计算规则,计算第i个时间节点的颜色矩阵值,包括:
若i=1,则以颜色矩阵初始值F为第1个时间节点的颜色矩阵值M1;
若i=n,则以颜色矩阵结束值L为第n个时间节点的颜色矩阵值Mn;否则,
对于第i个时间节点的颜色矩阵值Mi中的第j个分量hj(Mi),当hj(L)≥hj(F)时,hj(Mi)=hj(F)+[hj(L)-hj(F)]×i/n,当hj(L)<hj(F)时,hj(Mi)=hj(L)-[hj(F)-hj(L)]×i/n。
结合第一方面,在第一方面第五种可能的实现方式中,所述的基于属性动画的色调变化动画实现方法,在将所述原始静态图片转换为位图之后,根据预设的时间分段规则生成n个时间节点之前,还包括:
获取所述原始静态图片的主色,所述主色为所述原始静态图片中像素点最多的颜色;
根据所述主色确定预设的颜色矩阵初始值F和颜色矩阵结束值L。
结合第一方面第五种可能的实现方式,在第一方面第六种可能的实现方式中,所述获取所述原始静态图片的主色,包括:
将颜色值在预设偏差范围以内的像素点归为同一颜色的像素点,统计各个预设偏差范围内的像素点;
比较各个预设偏差范围以内像素点的个数,以像素点最多的预设偏差范围为主色偏差范围;
计算主色偏差范围内的颜色值的平均值,以所述平均值对应的颜色为主色。
结合第一方面第五种或第六种可能的实现方式,在第一方面第七种可能的实现方式中,所述根据所述主色确定预设的颜色矩阵初始值F和颜色矩阵结束值L,包括:
以保持主色的原颜色值的颜色矩阵值为颜色矩阵初始值F;
以F为边界值之一根据预设的主色变化值设定主色变化范围;
以所述主色变化范围的另一边界值为颜色矩阵结束值L。
结合第一方面,在第一方面第八种可能的实现方式中,所述的基于属性动画的色调变化动画实现方法,
使用插值器根据预设的时间分段规则生成n个时间节点;
使用估值器计算第i个时间节点的颜色矩阵值;
所述以所述颜色矩阵值为颜色过滤属性的值,根据所述颜色过滤属性对所述位图进行绘制,包括:将画笔的颜色过滤属性的值设置为所述颜色矩阵值,并使用所述画笔对所述位图进行绘制。
根据本申请实施例的第二方面,提供另一种基于属性动画的色调变化动画实现方法,包括:
获取原始静态图片;
将所述原始静态图片转换为位图;
根据预设的颜色矩阵初始值F、颜色矩阵结束值L、时间节点个数n以及颜色矩阵计算规则,计算第i个时间节点的颜色矩阵值;
根据预设的时间分段规则生成n个时间节点;
在第i个时间节点,以第i个时间节点的颜色矩阵值为颜色过滤属性的值,根据所述颜色过滤属性对所述位图进行绘制,得到新的图片并显示;
其中i为自然数,i=1,2……n。
相应于本申请实施例的第一方面,根据本申请实施例的第三方面,提供一种基于属性动画的色调变化动画实现装置,包括:
原始静态图片获取单元,用于获取原始静态图片;
图片转换单元,用于将所述原始静态图片转换为位图;
插值单元,用于根据预设的时间分段规则生成n个时间节点;
第一颜色矩阵计算单元,用于在第i个时间节点,根据预设的颜色矩阵初始值F、颜色矩阵结束值L以及颜色矩阵计算规则,计算第i个时间节点的颜色矩阵值;
绘制单元,用于在第i个时间节点,以所述颜色矩阵值为颜色过滤属性的值,根据所述颜色过滤属性对所述位图进行绘制,得到新的图片并显示;
其中i为自然数,i=1,2……n。
结合第三方面,在第三方面第一种可能的实现方式中,所述的基于属性动画的色调变化动画实现装置还包括缩放单元,所述缩放单元用于:在将所述原始静态图片转换为位图之后,根据预设的时间分段规则生成n个时间节点之前,根据显示区域的大小对所述位图进行缩放。
结合第三方面,在第三方面第二种可能的实现方式中,,所述预设的时间分段规则为时间节点之间的间隔相同且小于0.1秒。
结合第三方面,在第三方面第三种可能的实现方式中,,所述颜色矩阵包括红色R分量、绿色G分量、蓝色B分量、透明度Alpha分量和占位符分量。
结合第三方面,在第三方面第四种可能的实现方式中,所述颜色矩阵计算单元,在计算第i个时间节点的颜色矩阵值时,具体用于:
若i=1,则以颜色矩阵初始值F为第1个时间节点的颜色矩阵值M1;
若i=n,则以颜色矩阵结束值L为第n个时间节点的颜色矩阵值Mn;否则,
计算第i个时间节点的颜色矩阵值Mi中的第j个分量hj(Mi),当hj(L)≥hj(F)时,hj(Mi)=hj(F)+[hj(L)-hj(F)]×i/n,当hj(L)<hj(F)时,hj(Mi)=hj(L)-[hj(F)-hj(L)]×i/n。
结合第三方面,在第三方面第五种可能的实现方式中,所述的基于属性动画的色调变化动画实现装置,还包括:
主色获取单元,用于在将所述原始静态图片转换为位图之后,使用插值器根据预设的时间分段规则生成n个时间节点之前,获取所述原始静态图片的主色,所述主色为所述原始静态图片中像素点最多的颜色;
预设颜色矩阵确定单元,用于根据所述主色确定预设的颜色矩阵初始值F和颜色矩阵结束值L。
结合第三方面第五种可能的实现方式,在第三方面第六种可能的实现方式中,所述主色获取单元,包括:
像素点统计模块,用于将颜色值在预设偏差范围以内的像素点归为同一颜色的像素点,统计各个预设偏差范围内的像素点;
主色偏差范围确定模块,用于比较各个预设偏差范围以内像素点的个数,以像素点最多的预设偏差范围为主色偏差范围;
主色确定模块,用于计算主色偏差范围内的颜色值的平均值,以所述平均值对应的颜色为主色。
结合第三方面第五种或第六种可能的实现方式,在第三方面第七种可能的实现方式中,所述预设颜色矩阵确定单元,包括:
颜色矩阵初始值确定模块,用于以保持主色的原颜色值的颜色矩阵值为颜色矩阵初始值F;
主色变化范围设定模块,用于以F为边界值之一根据预设的主色变化值设定主色变化范围;
颜色矩阵结束值确定模块,以所述主色变化范围的另一边界值为颜色矩阵结束值L。
结合第三方面,在第三方面第八种可能的实现方式中,所述插值单元,用于使用插值器根据预设的时间分段规则生成n个时间节点;
所述第一颜色矩阵计算单元,用于在第i个时间节点,根据预设的颜色矩阵初始值F、颜色矩阵结束值L以及颜色矩阵计算规则,使用估值器计算第i个时间节点的颜色矩阵值;
所述绘制单元,用于在第i个时间节点,将画笔的颜色过滤属性的值设置为所述颜色矩阵值,并使用所述画笔对所述位图进行绘制,得到新的图片并显示。
相应于本申请实施例的第二方面,根据本申请实施例的第四方面,提供另一种基于属性动画的色调变化动画实现装置,包括:
原始静态图片获取单元,用于获取原始静态图片;
图片转换单元,用于将所述原始静态图片转换为位图;
第二颜色矩阵计算单元,根据预设的颜色矩阵初始值F、颜色矩阵结束值L、时间节点个数n以及颜色矩阵计算规则,计算第i个时间节点的颜色矩阵值;
插值单元,用于根据预设的时间分段规则生成n个时间节点;
绘制单元,用于在第i个时间节点,以第i个时间节点的颜色矩阵值为颜色过滤属性的值,根据所述颜色过滤属性对所述位图进行绘制,得到新的图片并显示;
其中i为自然数,i=1,2……n。
本申请实施例提供的技术方案,生成时间序列,并在时间序列的每个时间节点计算得到不同的颜色矩阵值、将画笔的颜色过滤属性值设置为当前时间节点的颜色矩阵值,同时使用画笔对图片进行绘制,在每个时间节点动态改变图片的整体颜色(色调),得到新图片,随着时间序列生成的新图片序列即动画图片序列。动画图片序列是沿时间序列显示的,从而在视觉上形成图片色调变化动画。相比于现有技术基于OpenGL进行复杂编程的方法不同,本申请实施例所提供的基于属性动画的色调变化动画实现方法简单易行,占用资源少,执行效率高,更利于实时在线地实现图片色调变化的动画效果。
应当理解的是,以上的一般描述和后文的细节描述仅是示例性和解释性的,并不能限制本申请。
附图说明
为了更清楚地说明本申请实施例或现有技术中的技术方案,下面将对实施例或现有技术描述中所需要使用的附图作简单地介绍,显而易见地,对于本领域普通技术人员而言,在不付出创造性劳动性的前提下,还可以根据这些附图获得其他的附图。
图1为本申请一示例性实施例示出的一种基于属性动画的色调变化动画实现方法的流程示意图;
图2为本申请一示例性实施例示出的另一种基于属性动画的色调变化动画实现方法的流程示意图;
图3为本申请一示例性实施例示出的又一种基于属性动画的色调变化动画实现方法的流程示意图;
图4为本申请一示例性实施例示出的又一种基于属性动画的色调变化动画实现方法的流程示意图;
图5为本申请一示例性实施例示出的一种基于属性动画的色调变化动画实现装置的框图;
图6为本申请一示例性实施例示出的另一种基于属性动画的色调变化动画实现装置的框图;
图7为本申请一示例性实施例示出的又一种基于属性动画的色调变化动画实现装置的框图;
图8为本申请一示例性实施例示出的又一种基于属性动画的色调变化动画实现装置的框图。
具体实施方式
这里将详细地对示例性实施例进行说明,其示例表示在附图中。下面的描述涉及附图时,除非另有表示,不同附图中的相同数字表示相同或相似的要素。以下示例性实施例中所描述的实施方式并不代表与本申请相一致的所有实施方式。相反,它们仅是与如所附权利要求书中所详述的、本申请的一些方面相一致的装置和方法的例子。
为了全面理解本申请,在以下详细描述中提到了众多具体的细节,但是本领域技术人员应该理解,本申请可以无需这些具体细节而实现。在其他实施例中,不详细描述公知的方法、过程、组件和电路,以免不必要地导致实施例模糊。
为更好地理解本申请,对本申请所涉及的概念做简单介绍如下。属性动画是一种动画制作中对值进行操作的机制,通过将值赋给对象的指定属性来得到动画效果,其中对象可以是任意对象,属性可以是对象的任意属性。时间插值器(为方便描述,以下简称插值器)和估值器是属性动画中两个重要的工具,插值器本质是时间的函数,定义了动画在时间上的变化规律;估值器定义了属性值的计算方式,有int、float和color等类型,主要根据属性的开始值、结束值和插值一起计算出各个时间点的属性值。在属性动画实现过程中,插值器和估值器通常会联合使用,插值器生成时间序列,估值器根据时间序列顺序计算每个时刻属性的值。插值器和估值器都可以由用户自定义以实现更丰富的动画效果。
位图(Bitmap,BMP文件格式)是一种广泛使用的图像文件格式,由于位图可以不作任何变化地保存图像像素域的数据,因此成为取得RAW数据(原始数据)的重要来源。画笔是属性动画中的绘制工具,可以根据设置的属性对图片进行绘制。颜色过滤,指整体改变图片的颜色,仿佛对图片的颜色进行了过滤一样,故称之为颜色过滤。
图1为本申请一示例性实施例示出的一种基于属性动画的色调变化动画实现方法的流程示意图,如图1所示,所述方法包括:
步骤S101,获取原始静态图片;
步骤S102,将所述原始静态图片转换为位图。
其中,原始静态图片可以预存于某个文件或数据库中,使用系统的图片读取函数来读取,原始静态图片也可以为某个动画或者视频的某一帧,使用帧抓取函数来获取。原始静态图片可以为单独的图片,也可以是合成动画中的背景图片。获取到原始静态图片后,将图片进行格式转换,得到位图,后续以该位图作为Bitmap对象,从该Bitmap对象中读取图片的像素数据来进行相关计算。
步骤S103,根据预设的时间分段规则生成n个时间节点。
其中,在属性动画中,使用插值器生成n个时间节点,所有时间节点组成一个时间序列,因此也可视为插值器生成包含n个时间节点的时间序列。所述时间序列决定了生成的图片序列的显示频率,每个时间节点生成的图片沿着时间序列依次显示,形成动画效果,因此时间节点之间的时间间隔需满足视觉暂留效果的要求。为满足视觉暂留效果,时间间隔须在0.4s以下,优选的是时间间隔在0.1s以下,这样动画效果更好更为平滑。所述预设的时间分段规则可以为线性也可以为非线性,线性指时间节点之间的时间间隔相等,非线性指时间节点之间的时间间隔不相等,非线性可以为多种形式例如呈抛物线增加或减少。按线性的时间分段规则得到的时间序列显示的动画平稳渐进,比较符合人的视觉习惯,按非线性的时间分段规则得到的时间序列显示的动画可以制造闪烁等视觉效果,但容易有杂乱之感。
步骤S104,在第i个时间节点,根据预设的颜色矩阵初始值F、颜色矩阵结束值L以及颜色矩阵计算规则,计算第i个时间节点的颜色矩阵值;以及,
步骤S105,在第i个时间节点,以所述颜色矩阵值为颜色过滤属性的值,根据所述颜色过滤属性对所述位图进行绘制,得到新的图片并显示;
其中i为自然数,i=1,2……n。
其中,在插值器每生成一个时间节点时,计算该时间节点对应的颜色矩阵值,在属性动画中,可以使用估值器计算时间节点对应的颜色矩阵值。图片像素的颜色都包含有红色R分量、绿色G分量、蓝色B分量和透明度Alpha分量这四个分量,颜色矩阵则将每个分量作为矩阵的一行,按R、G、B、A(Alpha,简写为A)的顺序排列,每行默认分为5列,也就是以4×5的矩阵来表示颜色矩阵,颜色矩阵规范式为:
其中V为偏移量。例如:
F为颜色矩阵。像素颜色计算公式为:
r=R*m11+G*m12+B*m13+A*m14+m15*255;
g=R*m21+G*m22+B*m23+A*m24+m25*255;
b=R*m31+G*m32+B*m33+A*m34+m35*255;
a=R*m41+G*m42+B*m43+A*m44+m45*255。
其中,大写的R、G、B和A为经颜色矩阵计算前的原颜色分量值,小写的r、g、b和a为计算后的颜色分量值。颜色矩阵中的元素通常在0和1之间取值,0表示none,也就是颜色不可见,1表示保持原值,用户也可以根据图片的情况和计算的需要自定义元素的取值范围,也就是不限定于在0和1之间取值。通过将颜色矩阵值与像素的颜色值进行计算,可以改变像素的颜色,将颜色矩阵值与图片中的所有像素颜色值进行计算,可以一致地改变图片中所有像素的颜色,从而能够整体上改变图片的色调。
较常用的颜色矩阵为4×5的矩阵,为使计算更为方便,在颜色矩阵中引入占位符分量,以占位符分量为第5行,构成5×5的对称矩阵,对称矩阵更方便计算,而且占位符分量有利于引入另外的偏移量,使颜色矩阵对像素颜色的控制更为灵活。
本申请的目的在于跟随插值器生成的时间序列渐进地修改图片的颜色,因此每个时间节点都要计算得到新的颜色矩阵以改变图片像素的颜色值,也就是要得到一个与时间序列对应的颜色矩阵序列。为计算得到颜色矩阵序列,可以使用内插法,预设一个颜色矩阵初始值F和颜色矩阵结束值L,然后插值得到中间一系列的值。F和L由用户根据图片原本的色调和希望达到的最终色调来设定,所述颜色矩阵计算规则由用户根据希望达到的色调变化动画的中间效果来设定,颜色矩阵计算规则可以为线性也可以为非线性,线性颜色矩阵计算规则使颜色矩阵线性变化,非线性颜色矩阵计算规则使颜色矩阵非线性变化。颜色矩阵线性变化指颜色矩阵中的每个分量的值按线性规律变化,例如按等差规律变化,颜色矩阵非线性变化则指颜色矩阵中的每个分量的值按非线性规律变化,例如按等比规律变化。在线性变化的颜色矩阵序列作用下,图片色调均匀变换,动画效果匀速渐进,视觉上较为平缓,非线性变化的颜色矩阵序列作用下,图片色调变换不均匀,动画效果存在突变,视觉上较有冲击感,但割裂感也较强。
在一种可能的实施方式中,线性计算颜色矩阵序列,可以包括:
若i=1,则以颜色矩阵初始值F为第1个时间节点的颜色矩阵值M1
若i=n,则以颜色矩阵结束值L为第n个时间节点的颜色矩阵值Mn;否则,
对于第i个时间节点的颜色矩阵值Mi中的第j个分量hj(Mi),当hj(L)≥hj(F)时,hj(Mi)=hj(F)+[hj(L)-hj(F)]×i/n,当hj(L)<hj(F)时,hj(Mi)=hj(L)-[hj(F)-hj(L)]×i/n。
其中,在插值器生成第1个时间节点时,以F为第1个颜色矩阵,在生成第n个时间节点时,以L为第n个颜色矩阵,这中间,对于第i个时间节点,以第1个颜色矩阵(即F)为基础,逐步按线性规律计算第i个颜色矩阵,具体地,将第i个颜色矩阵Mi的每个分量线性递增或线性递减,对于颜色矩阵的第j个分量,当hj(L)≥hj(F),也就是L中第j个分量的值大于或等于F中第j个分量的值时,第i个颜色矩阵的第j个分量hj(Mi)=hj(F)+[hj(L)-hj(F)]×i/n,hj(Mi)依次递增,其中hj(L)=hj(F)相当于分量没有变化,该分量的各个中间值也就保持不变;当hj(L)<hj(F),也就是L中第j个分量的值小于F中第j个分量的值时,第i个颜色矩阵的第j个分量hj(Mi)=hj(L)-[hj(F)-hj(L)]×i/n,hj(Mi)依次递减。这种实施方式中,颜色矩阵序列中颜色矩阵的分量线性递增或递减,计算方法简单,动画效果渐进平稳,占用计算资源也少。
颜色矩阵计算规则也可以为非线性的,例如使颜色矩阵的分量等比变化,也可以根据特效要求设计其他计算规则例如正弦变化规则,也可以不依据数学规则而在设定的范围内随机为颜色矩阵中的分量赋值,设定的范围由颜色矩阵初始值和颜色矩阵结束值决定。例如,希望让绿色植物图的绿色变深,可以将颜色矩阵中的G分量从初始值开始增加,每次增加多少可以随机指定,不超过最终值即可,例如:
增加G分量,
在第i个时间节点,得到第i个颜色矩阵后,将画笔(paint)的颜色过滤属性设置为第i个颜色矩阵值,使用所述画笔对所述位图进行绘制,得到第i个新图片。生成的所有新图片构成动画图片序列,沿时间序列显示而实现色调变化动画。其中,画笔为图片绘制工具,本申请中画笔对图片进行绘制即画笔将颜色矩阵和图片像素的颜色矩阵进行计算,改变图片像素的颜色值,从而改变图片的颜色,颜色矩阵则作为画笔的颜色过滤属性由画笔在绘制时调用。具体地,画笔在绘制时可以调用绘制函数例如Android系统中的Ondraw函数来完成新图片的绘制,更新原图片像素。
本申请所提供的基于属性动画的色调变化动画实现方法,与通常使用OpenGL进行复杂编程实现的方法不同,只需在时间序列的每个时间节点生成不同的颜色矩阵,使用颜色矩阵改变颜色过滤属性,根据颜色过滤属性对图片进行绘制,从而在每个时间节点动态改变图片的整体颜色(色调),得到图片色调变化动画,本申请所提供的方法简单易行,占用资源少,执行效率高,更利于实时在线地实现图片色调变化的动画效果。另外,需要说明的是,按照本申请所提供的方法生成的图片色调变化动画,不仅可以单独显示,也可以和其他动画例如图片元素位置变化动画叠加在一起形成更丰富的动画效果。
本申请所提供的基于属性动画的色调变化动画实现方法,可以应用于具有属性动画的系统,包括但不限于Android(安卓)和iOS(苹果移动系统)等。
图2为本申请一示例性实施例示出的另一种基于属性动画的色调变化动画实现方法的流程示意图,如图2所示,所述方法包括:
步骤S201,获取原始静态图片;
步骤S201,将所述原始静态图片转换为位图;
步骤S203,根据显示区域的大小对所述位图进行缩放。
其中,步骤S201至步骤S202与步骤S101至步骤S102相同。在将静态图片转为位图后,为更准确地获取位图像素,防止像素缺失(图片大于显示区域时),以及消除边框的影响(图片小于显示区域时在图片周围可能会出现边框),对所述位图进行缩放以使位图与显示区域的大小一致。通常在图像处理程序中,图片为View(视图)中的一个对象,为更方便地对图片进行缩放等处理,可以使图片的View继承于包含缩放功能函数的父视图,例如安卓系统中的ImageView,将包含位图的View继承于ImageView,可以方便地调用父视图中的缩放功能函数对位图进行缩放,使位图和显示区域一致。
步骤S204,获取所述原始静态图片的主色,所述主色为所述原始静态图片中像素点最多的颜色;
步骤S205,根据所述主色确定预设的颜色矩阵初始值F和颜色矩阵结束值L。
图片的色调通常由图片的主要颜色决定,图片的主色发生变化在视觉上也会形成色调变化的效果,在有些应用场景下,需要从图片本来具有的主色基调出发来设计动画效果,比如图片中有多种颜色区别较大的色块例如红色块、蓝色块和绿色块,由于色块颜色区别较大,难以直接确定整体色调变化的起始颜色值和结束颜色值,这种情况下便可以先获取图片的主色,从主色出发改变图片的色调。主色即图片中像素点最多的颜色,在得到原始静态图片的位图后,读取位图的像素数据,根据像素数据统计同颜色值的像素点,哪种颜色值的像素点最多,则该颜色值对应的颜色为主色。由于像素点的颜色值与标准颜色值之间可能存在误差,因此也可以将颜色值在预设的偏差范围内的像素点归为同一颜色,然后统计各个偏差范围内的像素点,比较各个偏差范围内的像素点的个数,以像素点最多的偏差范围为主色偏差范围,然后取该主色偏差范围内的颜色值的平均值,以该平均值对应的颜色为主色。所述偏差范围可以根据图片颜色分布情况确定,如果图片色块颜色差别较大,则偏差范围可以预设得较小,以使颜色归类更精确,若色块很多,色块颜色差别较小或者有大有小,则可以将偏差范围预设得较大,以方便得到主色。
在获取到位图的主色后,可以以保持主色的原颜色值的颜色矩阵值为颜色矩阵初始值F,具体地,若得到的主色与图片中最大色块的颜色值相同,则F为单位矩阵即可,若得到的主色如前面所述是根据主色偏差范围内的颜色值的平均值得到的,则主色的颜色值可能与图片色块的实际颜色值存在数学计算上的偏差,这种情况下,取最大色块的某一像素点的颜色值,以能够将该颜色值改变为主色颜色值的颜色矩阵为F。确定L后,再以F为边界值之一根据预设的主色变化值设定主色变化范围,以主色变化范围的另一边界值为颜色矩阵结束值L,其中主色变化值可以由用户根据期望达到的色调变化程度在程序中预先设定,主色变化值即主色变化范围两个边界值之差的绝对值。或者,系统在获取到位图的主色后,通过用户界面显示主色信息,并在用户界面上设置用于输入F和L的输入框,用户在查看图片的主色信息后,根据期望的效果自定义F和L,并通过F和L的输入框进行输入,系统通过所述输入框获取F和L,完成F和L的确定。
步骤S206,根据预设的时间分段规则生成n个时间节点;
步骤S207,在第i个时间节点,根据预设的颜色矩阵初始值F、颜色矩阵结束值L以及颜色矩阵计算规则,计算第i个时间节点的颜色矩阵值;以及,
步骤S208,以所述颜色矩阵值为颜色过滤属性的值,根据所述颜色过滤属性对所述位图进行绘制,得到新的图片并显示;
其中i为自然数,i=1,2……n。
其中,步骤S206至步骤S208与步骤S103至步骤S105相同。本实施例所提供的基于属性动画的色调变化动画实现方法,在得到位图后,根据显示区域的大小对位图进行缩放,以防止像素缺失以及消除边框的影响,从而更精确地得到图片的像素数据,并且本实施例所提供的方法先获取图片的主色,基于主色确定颜色矩阵初始值和颜色矩阵结束值,可以更方便地实现多色块图片的色调变化动画效果。
图3为本申请一示例性实施例示出的又一种基于属性动画的色调变化动画实现方法的流程示意图,如图3所示,所述方法包括:
步骤S301,获取原始静态图片;
步骤S302,将所述原始静态图片转换为位图;
步骤S303,根据预设的颜色矩阵初始值F、颜色矩阵结束值L、时间节点个数n以及颜色矩阵计算规则,计算第i个时间节点的颜色矩阵值;
步骤S304,根据预设的时间分段规则生成n个时间节点;
步骤S305,在第i个时间节点,以第i个时间节点的颜色矩阵值为颜色过滤属性的值,根据所述颜色过滤属性对所述位图进行绘制,得到新的图片并显示;
其中i为自然数,i=1,2……n。
图3所示实施例与图1所示实施例的主要区别在于,图1所示实施例是在每个时间节点实时计算颜色矩阵值,而图3所示实施例是在生成时间节点之前先将各个时间节点的颜色矩阵值计算好,然后使用插值器生成时间节点,在生成每个时间节点的同时,不必再计算颜色矩阵值,只需根据已生成的对应于当前时间节点的颜色矩阵值来设置颜色过滤属性的值,具体地,在第i个时间节点,将画笔的颜色过滤属性设置为已生成的第i个颜色矩阵值,再使用画笔对位图进行绘制。本实施例由于先计算颜色矩阵值,因此时间序列生成过程及动画图片序列生成过程中不需耗费计算时间和资源,相比图1所示的方法,时间序列中时间节点之间的间隔可以更小,程序执行效率更高,不过图3所示的方法中颜色矩阵值在计算完毕后需依次保存,而图1中实时计算得到的颜色矩阵值可以只在当前暂存,内存消耗可以较少。
图4为本申请一示例性实施例示出的又一种基于属性动画的色调变化动画实现方法的流程示意图,如图4所示,所述方法包括:
步骤S401,获取原始静态图片;
步骤S402,将所述原始静态图片转换为位图;
步骤S403,根据显示区域的大小对所述位图进行缩放。
步骤S404,获取所述原始静态图片的主色,所述主色为所述原始静态图片中像素点最多的颜色;
步骤S405,根据所述主色确定预设的颜色矩阵初始值F和颜色矩阵结束值L;
步骤S406,根据预设的颜色矩阵初始值F、颜色矩阵结束值L、时间节点个数n以及颜色矩阵计算规则,计算第i个时间节点的颜色矩阵值;
步骤S407,根据预设的时间分段规则生成n个时间节点;
步骤S408,在第i个时间节点,以第i个时间节点的颜色矩阵值为颜色过滤属性的值,根据所述颜色过滤属性对所述位图进行绘制,得到新的图片并显示;
其中i为自然数,i=1,2……n。
其中,步骤S401至步骤S402与步骤S301至步骤S302相同,步骤S403至步骤S405与步骤S203至步骤S205相同,步骤S406至步骤S408与步骤S303至步骤S305相同。在本申请中,步骤S403与步骤S404至S405可以同时加入到图1和图3所示的基于属性动画的色调变化动画实现方法中,也可以只加入步骤S403,或者只加入步骤S404和S405。
通过以上的方法实施例的描述,所属领域的技术人员可以清楚地了解到本申请可借助软件加必需的通用硬件平台的方式来实现,当然也可以通过硬件,但很多情况下前者是更佳的实施方式。基于这样的理解,本申请的技术方案本质上或者说对现有技术做出贡献的部分可以以软件产品的形式体现出来,并存储在一个存储介质中,包括若干指令用以使得一台智能设备执行本申请各个实施例所述方法的全部或部分步骤。而前述的存储介质包括:只读存储器(ROM)、随机存取存储器(RAM)、磁碟或者光盘等各种可以存储数据和程序代码的介质。
图5为本申请一示例性实施例示出的一种基于属性动画的色调变化动画实现装置的框图,如图5所示,所述装置包括:
原始静态图片获取单元U501,用于获取原始静态图片;
图片转换单元U502,用于将所述原始静态图片转换为位图;
插值单元U503,用于根据预设的时间分段规则生成n个时间节点;
第一颜色矩阵计算单元U504,用于在第i个时间节点,根据预设的颜色矩阵初始值F、颜色矩阵结束值L以及颜色矩阵计算规则,计算第i个时间节点的颜色矩阵值;
绘制单元U505,用于在第i个时间节点,以所述颜色矩阵值为颜色过滤属性的值,根据所述颜色过滤属性对所述位图进行绘制,得到新的图片并显示;
其中i为自然数,i=1,2……n。
其中,若原始静态图片预存于某个文件或数据库中,则原始静态图片获取单元U501可以使用系统的图片读取函数来获取原始静态图片,若原始静态图片为某个动画或者视频的某一帧,则原始静态图片获取单元U501可以使用帧抓取函数来获取原始静态图片。在U501获取到原始静态图片后,图片转换单元U502将图片进行格式转换,得到位图,后续绘制单元U505以该位图作为Bitmap对象,从该Bitmap对象中读取图片的像素数据来进行计算和绘制。
其中,插值单元U503使用插值器生成n个时间节点,所有时间节点组成一个时间序列,每个时间节点生成的图片沿着时间序列依次显示,形成动画效果。为满足视觉暂留效果,所述时间节点的时间间隔须在0.4s以下,优选的是时间间隔在0.1s以下,这样动画效果会更为平滑。插值单元U503所使用的预设的时间分段规则可以为线性也可以为非线性,线性指时间节点之间的时间间隔相等,非线性指时间节点之间的时间间隔不相等。按线性的时间分段规则得到的时间序列显示的动画平稳渐进,比较符合人的视觉习惯,按非线性的时间分段规则得到的时间序列显示的动画可以制造闪烁等视觉效果,但容易有杂乱之感。
插值单元U503每生成一个时间节点,第一颜色矩阵计算单元U504计算该时间节点对应的颜色矩阵值,第一颜色矩阵计算单元可以使用属性动画的估值器来计算颜色矩阵值。颜色矩阵规范式为:
其中V为偏移量。F为颜色矩阵。像素颜色计算公式为:
r=R*m11+G*m12+B*m13+A*m14+m15*255;
g=R*m21+G*m22+B*m23+A*m24+m25*255;
b=R*m31+G*m32+B*m33+A*m34+m35*255;
a=R*m41+G*m42+B*m43+A*m44+m45*255。
其中,大写的R、G、B和A为经颜色矩阵计算前的原颜色分量值,小写的r、g、b和a为计算后的颜色分量值。较常用的颜色矩阵为4×5的矩阵,为使计算更为方便,在颜色矩阵中引入占位符分量,以占位符分量为第5行,构成5×5的对称矩阵,对称矩阵更方便计算,而且占位符分量有利于引入另外的偏移量,使颜色矩阵对像素颜色的控制更为灵活。
绘制单元U505跟随插值器生成的时间序列渐进地使用第一颜色矩阵计算单元U504计算得到的颜色矩阵修改图片的颜色,第一颜色矩阵计算单元U504每个时间节点计算得到新的颜色矩阵,从而得到与时间序列相对应的颜色矩阵序列。第一颜色矩阵计算单元U504可以使用内插法进行计算,预设颜色矩阵初始值F和颜色矩阵结束值L,然后插值得到中间一系列的值。F和L由用户根据图片原本的色调和希望达到的最终色调来设定,所述颜色矩阵计算规则由用户根据希望达到的色调变化动画的中间效果来设定,颜色矩阵计算规则可以为线性也可以为非线性,线性颜色矩阵计算规则使颜色矩阵线性变化,非线性颜色矩阵计算规则使颜色矩阵非线性变化。在线性变化的颜色矩阵序列作用下,图片色调均匀变换,动画效果匀速渐进,非线性变化的颜色矩阵序列作用下,图片色调变换不均匀,动画效果存在突变。
在一种可能的实施方式中,第一颜色矩阵计算单元U504线性计算颜色矩阵序列时,具体用于:
若i=1,则以颜色矩阵初始值F为第1个时间节点的颜色矩阵值M1
若i=n,则以颜色矩阵结束值L为第n个时间节点的颜色矩阵值Mn;否则,
对于第i个时间节点的颜色矩阵值Mi中的第j个分量hj(Mi),当hj(L)≥hj(F)时,hj(Mi)=hj(F)+[hj(L)-hj(F)]×i/n,当hj(L)<hj(F)时,hj(Mi)=hj(L)-[hj(F)-hj(L)]×i/n。
其中,在插值单元U503生成第1个时间节点时,第一颜色矩阵计算单元U504以F为第1个颜色矩阵,在插值单元U503生成第n个时间节点时,第一颜色矩阵计算单元U504以L为第n个颜色矩阵,这中间,对于第i个时间节点,第一颜色矩阵计算单元U504以第1个颜色矩阵(即F)为基础,逐步按线性规律计算第i个颜色矩阵,具体地,将第i个颜色矩阵Mi的每个分量线性递增或线性递减,对于颜色矩阵的第j个分量,当hj(L)≥hj(F)时,第i个颜色矩阵的第j个分量hj(Mi)=hj(F)+[hj(L)-hj(F)]×i/n,hj(Mi)依次递增,其中hj(L)=hj(F)相当于分量没有变化,该分量的各个中间值也就保持不变;当hj(L)<hj(F)时,第i个颜色矩阵的第j个分量hj(Mi)=hj(L)-[hj(F)-hj(L)]×i/n,hj(Mi)依次递减。这种实施方式中,颜色矩阵序列中颜色矩阵的分量线性递增或递减,计算方法简单,动画效果渐进平稳,占用计算资源少。
第一颜色矩阵计算单元U504使用的颜色矩阵计算规则也可以为非线性的,例如使颜色矩阵的分量等比变化,也可以根据特效要求设计其他颜色矩阵计算规则例如正弦变化规则,也可以不依据数学规则而在设定的范围内随机为颜色矩阵中的分量赋值,设定的范围由颜色矩阵初始值和颜色矩阵结束值决定。
在第i个时间节点,第一颜色矩阵计算单元U504得到第i个颜色矩阵后,绘制单元U505将画笔的颜色过滤属性设置为第i个颜色矩阵值,使用所述画笔对所述位图进行绘制改变图片的色调,得到第i个新图片。生成的所有新图片构成动画图片序列,沿时间序列显示而实现色调变化动画。
本申请所提供的基于属性动画的色调变化动画实现装置,在时间序列的每个时间节点生成不同的颜色矩阵,通过画笔使用颜色矩阵在每个时间节点动态改变图片的整体颜色,从而得到图片色调变化动画,所述装置执行时占用资源少,执行效率高,更利于实时在线地实现图片色调变化的动画效果。按照本申请所提供的装置生成的图片色调变化动画,不仅可以单独显示,也可以和其他动画叠加在一起形成更丰富的动画效果。本申请所提供的基于属性动画的色调变化动画实现装置,可以应用于具有属性动画的系统,包括但不限于Android(安卓)和iOS(苹果移动系统)等。
图6为本申请一示例性实施例示出的另一种基于属性动画的色调变化动画实现装置的框图,如图6所示,所述装置包括:
原始静态图片获取单元U601,用于获取原始静态图片;
图片转换单元U602,用于将所述原始静态图片转换为位图;
缩放单元U603,用于根据显示区域的大小对所述位图进行缩放;
主色获取单元U604,用于获取所述原始静态图片的主色,所述主色为所述原始静态图片中像素点最多的颜色;
预设颜色矩阵确定单元U605,用于根据所述主色确定预设的颜色矩阵初始值F和颜色矩阵结束值L;
插值单元U606,用于根据预设的时间分段规则生成n个时间节点;
第一颜色矩阵计算单元U607,用于在第i个时间节点,根据预设的颜色矩阵初始值F、颜色矩阵结束值L以及颜色矩阵计算规则,计算第i个时间节点的颜色矩阵值;
绘制单元U608,用于在第i个时间节点,以所述颜色矩阵值为颜色过滤属性的值,根据所述颜色过滤属性对所述位图进行绘制,得到新的图片并显示;
其中i为自然数,i=1,2……n。
其中,在图片转换单元U602将静态图片转为位图后,缩放单元U603对所述位图进行缩放以使位图与显示区域的大小一致,从而能够更准确地获取位图像素,防止像素缺失,以及消除边框的影响。为更方便地对图片进行缩放等处理,图片转换单元U602将原始静态图片转换为位图后,可以使位图对象的View继承于包含缩放功能函数的父视图,这样缩放单元U603可以方便地调用父视图中的缩放功能函数对位图进行缩放。
其中,所述主色获取单元U604,可以包括:
像素点统计模块,用于将颜色值在预设偏差范围以内的像素点归为同一颜色的像素点,统计各个预设偏差范围内的像素点;
主色偏差范围确定模块,用于比较各个预设偏差范围以内像素点的个数,以像素点最多的预设偏差范围为主色偏差范围;
主色确定模块,用于计算主色偏差范围内的颜色值的平均值,以所述平均值对应的颜色为主色。
主色即图片中像素点最多的颜色,在缩放单元U603对位图进行缩放后,主色获取单元U604读取位图的像素数据,根据像素数据统计同颜色值的像素点,哪种颜色值的像素点最多,则该颜色值对应的颜色为主色。由于像素点的颜色值与标准颜色值之间可能存在误差,因此可以由像素点统计模块将颜色值在预设的偏差范围内的像素点归为同一颜色,然后统计各个偏差范围内的像素点,然后主色偏差范围确定模块比较各个偏差范围内的像素点的个数,以像素点最多的偏差范围为主色偏差范围,主色确定模则取该主色偏差范围内的颜色值的平均值,以该平均值对应的颜色为主色。所述偏差范围可以根据图片颜色分布情况确定,如果图片色块颜色差别较大,则偏差范围可以预设得较小,以使颜色归类更精确,若色块很多,色块颜色差别较小或者有大有小,则可以将偏差范围预设得较大,以方便得到主色。
其中,所述预设颜色矩阵确定单元U605,可以包括:
颜色矩阵初始值确定模块,用于以保持主色的原颜色值的颜色矩阵值为颜色矩阵初始值F;
主色变化范围设定模块,用于以F为边界值之一根据预设的主色变化值设定主色变化范围;
颜色矩阵结束值确定模块,以所述主色变化范围的另一边界值为颜色矩阵结束值L。
在主色获取单元U604获取到位图的主色后,预设颜色矩阵确定单元U605中的颜色矩阵初始值确定模块以保持主色的原颜色值的颜色矩阵值为颜色矩阵初始值F,若得到的主色与图片中最大色块的颜色值相同,则F为单位矩阵即可,若得到的主色是由主色确定模块根据平均值得到的,则主色的颜色值可能与图片色块的实际颜色值存在数学计算上的偏差,这种情况下,颜色矩阵初始值确定模块可以取最大色块的某一像素点的颜色值,以能够将该颜色值改变为主色颜色值的颜色矩阵为F。确定L后,主色变化范围设定模块再以F为边界值之一根据预设的主色变化值设定主色变化范围,颜色矩阵结束值确定模块以主色变化范围的另一边界值为颜色矩阵结束值L,其中主色变化值可以由用户根据期望达到的色调变化程度在程序中预先设定。或者预设颜色矩阵确定单元U605在主色获取单元U604获取到位图的主色后,通过用户界面显示主色信息,并在用户界面上设置用于输入F和L的输入框,用户在查看图片的主色信息后,根据期望的效果自定义F和L,并通过F和L的输入框进行输入,预设颜色矩阵确定单元U605通过所述输入框获取F和L,完成F和L的确定。
图7为本申请一示例性实施例示出的又一种基于属性动画的色调变化动画实现装置的框图,如图7所示,所述装置包括:
原始静态图片获取单元U701,用于获取原始静态图片;
图片转换单元U702,用于将所述原始静态图片转换为位图;
第二颜色矩阵计算单元U703,根据预设的颜色矩阵初始值F、颜色矩阵结束值L、时间节点个数n以及颜色矩阵计算规则,计算第i个时间节点的颜色矩阵值;
插值单元U704,用于根据预设的时间分段规则生成n个时间节点;
绘制单元U705,用于在第i个时间节点,将以第i个时间节点的颜色矩阵值为颜色过滤属性的值,根据所述颜色过滤属性对所述位图进行绘制,得到新的图片;
其中i为自然数,i=1,2……n。
图7所示装置与图5所示装置的主要区别在于,第二颜色矩阵计算单元U703在查找单元U704之前,先由第二颜色矩阵计算单元U703执行颜色矩阵计算,再由插值单元U704生成各个时间节点,图5所示装置则插值单元在先,由第一颜色矩阵计算单元跟随插值单元时间节点的生成在每个时间节点实时计算颜色矩阵值。图7所示装置在生成时间节点之前先将各个时间节点的颜色矩阵值计算好,这样插值单元U704生成每个时间节点的同时,不需要再计算颜色矩阵值,只需由绘制单元U705根据已生成的对应于当前时间节点的颜色矩阵值来设置画笔的颜色过滤属性,再使用画笔对位图进行绘制,得到新的图片并显示。图7所示装置相比图5所示装置可以节省计算时间和资源,时间节点之间的间隔也可以更小,程序执行效率更高,但图5所示装置中实时计算得到的颜色矩阵值可以只在当前暂存,图7所述装置中颜色矩阵值在计算完毕后需依次保存,内存消耗可能会较大。
图8为本申请一示例性实施例示出的又一种基于属性动画的色调变化动画实现装置的框图,如图8所示,所述装置包括:
原始静态图片获取单元U801,用于获取原始静态图片;
图片转换单元U802,用于将所述原始静态图片转换为位图;
缩放单元U803,用于根据显示区域的大小对所述位图进行缩放;
主色获取单元U804,用于获取所述原始静态图片的主色,所述主色为所述原始静态图片中像素点最多的颜色;
预设颜色矩阵确定单元U805,用于根据所述主色确定预设的颜色矩阵初始值F和颜色矩阵结束值L;
第二颜色矩阵计算单元U806,根据预设的颜色矩阵初始值F、颜色矩阵结束值L、时间节点个数n以及颜色矩阵计算规则,计算第i个时间节点的颜色矩阵值;
插值单元U807,用于根据预设的时间分段规则生成n个时间节点;
绘制单元U808,用于在第i个时间节点,以第i个时间节点的颜色矩阵值为颜色过滤属性的值,根据所述颜色过滤属性对所述位图进行绘制,得到新的图片;
其中i为自然数,i=1,2……n。
其中,所述主色获取单元U804,可以包括:
像素点统计模块,用于将颜色值在预设偏差范围以内的像素点归为同一颜色的像素点,统计各个预设偏差范围内的像素点;
主色偏差范围确定模块,用于比较各个预设偏差范围以内像素点的个数,以像素点最多的预设偏差范围为主色偏差范围;
主色确定模块,用于计算主色偏差范围内的颜色值的平均值,以所述平均值对应的颜色为主色。
其中,所述预设颜色矩阵确定单元U805,可以包括:
颜色矩阵初始值确定模块,用于以保持主色的原颜色值的颜色矩阵值为颜色矩阵初始值F;
主色变化范围设定模块,用于以F为边界值之一根据预设的主色变化值设定主色变化范围;
颜色矩阵结束值确定模块,以所述主色变化范围的另一边界值为颜色矩阵结束值L。
为了描述的方便,描述以上装置时以功能分为各种单元分别描述。当然,在实施本申请时可以把各单元的功能在同一个或多个软件和/或硬件中实现。
本说明书中的各个实施例均采用递进的方式描述,各个实施例之间相同相似的部分互相参见即可,每个实施例重点说明的都是与其他实施例的不同之处。尤其,对于装置或系统实施例而言,由于其基本相似于方法实施例,所以描述得比较简单,相关之处参见方法实施例的部分说明即可。以上所描述的装置及系统实施例仅仅是示意性的,其中所述作为分离部件说明的单元可以是或者也可以不是物理上分开的,作为单元显示的部件可以是或者也可以不是物理单元,即可以位于一个地方,或者也可以分布到多个网络单元上。可以根据实际的需要选择其中的部分或者全部模块来实现本实施例方案的目的。本领域普通技术人员在不付出创造性劳动的情况下,即可以理解并实施。
需要说明的是,在本文中,诸如“第一”和“第二”等之类的关系术语仅仅用来将一个实体或者操作与另一个实体或操作区分开来,而不一定要求或者暗示这些实体或操作之间存在任何这种实际的关系或者逆序。而且,术语“包括”、“包含”或者其任何其他变体意在涵盖非排他性的包含,从而使得包括一系列要素的过程、方法、装置或者设备不仅包括那些要素,而且还包括没有明确列出的其他要素,或者是还包括为这种过程、方法、装置或者设备所固有的要素。在没有更多限制的情况下,由语句“包括一个……”限定的要素,并不排除在包括所述要素的过程、方法、装置或者设备中还存在另外的相同要素。
以上所述仅是本申请的具体实施方式,使本领域技术人员能够理解或实现本申请。对这些实施例的多种修改对本领域的技术人员来说将是显而易见的,本文中所定义的一般原理可以在不脱离本申请的精神或范围的情况下,在其它实施例中实现。因此,本申请将不会被限制于本文所示的这些实施例,而是要符合与本文所公开的原理和新颖特点相一致的最宽的范围。

Claims (20)

1.一种基于属性动画的色调变化动画实现方法,其特征在于,包括:
获取原始静态图片;
将所述原始静态图片转换为位图;
根据预设的时间分段规则生成n个时间节点;
在第i个时间节点,根据预设的颜色矩阵初始值F、颜色矩阵结束值L以及颜色矩阵计算规则,计算第i个时间节点的颜色矩阵值;以及,
以所述颜色矩阵值为颜色过滤属性的值,根据所述颜色过滤属性对所述位图进行绘制,得到新的图片并显示;
其中i为自然数,i=1,2……n。
2.如权利要求1所述的基于属性动画的色调变化动画实现方法,其特征在于,在将所述原始静态图片转换为位图之后,根据预设的时间分段规则生成n个时间节点之前,还包括:
根据显示区域的大小对所述位图进行缩放。
3.如权利要求1所述的基于属性动画的色调变化动画实现方法,其特征在于,所述预设的时间分段规则为时间节点之间的间隔相同且小于0.1秒。
4.如权利要求1所述的基于属性动画的色调变化动画实现方法,其特征在于,所述颜色矩阵包括红色R分量、绿色G分量、蓝色B分量、透明度Alpha分量和占位符分量。
5.如权利要求1所述的基于属性动画的色调变化动画实现方法,其特征在于,所述根据预设的颜色矩阵初始值F、颜色矩阵结束值L以及颜色矩阵计算规则,计算第i个时间节点的颜色矩阵值,包括:
若i=1,则以颜色矩阵初始值F为第1个时间节点的颜色矩阵值M1
若i=n,则以颜色矩阵结束值L为第n个时间节点的颜色矩阵值Mn;否则,
对于第i个时间节点的颜色矩阵值Mi中的第j个分量hj(Mi),当hj(L)≥hj(F)时,hj(Mi)=hj(F)+[hj(L)-hj(F)]×i/n,当hj(L)<hj(F)时,hj(Mi)=hj(L)-[hj(F)-hj(L)]×i/n。
6.如权利要求1所述的基于属性动画的色调变化动画实现方法,其特征在于,在将所述原始静态图片转换为位图之后,根据预设的时间分段规则生成n个时间节点之前,还包括:
获取所述原始静态图片的主色,所述主色为所述原始静态图片中像素点最多的颜色;
根据所述主色确定预设的颜色矩阵初始值F和颜色矩阵结束值L。
7.如权利要求6所述的基于属性动画的色调变化动画实现方法,其特征在于,所述获取所述原始静态图片的主色,包括:
将颜色值在预设偏差范围以内的像素点归为同一颜色的像素点,统计各个预设偏差范围内的像素点;
比较各个预设偏差范围以内像素点的个数,以像素点最多的预设偏差范围为主色偏差范围;
计算主色偏差范围内的颜色值的平均值,以所述平均值对应的颜色为主色。
8.如权利要求6或7所述的基于属性动画的色调变化动画实现方法,其特征在于,所述根据所述主色确定预设的颜色矩阵初始值F和颜色矩阵结束值L,包括:
以保持主色的原颜色值的颜色矩阵值为颜色矩阵初始值F;
以F为边界值之一根据预设的主色变化值设定主色变化范围;
以所述主色变化范围的另一边界值为颜色矩阵结束值L。
9.如权利要求1所述的基于属性动画的色调变化动画实现方法,其特征在于,
使用插值器根据预设的时间分段规则生成n个时间节点;
使用估值器计算第i个时间节点的颜色矩阵值;
所述以所述颜色矩阵值为颜色过滤属性的值,根据所述颜色过滤属性对所述位图进行绘制,包括:将画笔的颜色过滤属性的值设置为所述颜色矩阵值,并使用所述画笔对所述位图进行绘制。
10.一种基于属性动画的色调变化动画实现方法,其特征在于,包括:
获取原始静态图片;
将所述原始静态图片转换为位图;
根据预设的颜色矩阵初始值F、颜色矩阵结束值L、时间节点个数n以及颜色矩阵计算规则,计算第i个时间节点的颜色矩阵值;
根据预设的时间分段规则生成n个时间节点;
在第i个时间节点,以第i个时间节点的颜色矩阵值为颜色过滤属性的值,根据所述颜色过滤属性对所述位图进行绘制,得到新的图片并显示;
其中i为自然数,i=1,2……n。
11.一种基于属性动画的色调变化动画实现装置,其特征在于,包括:
原始静态图片获取单元,用于获取原始静态图片;
图片转换单元,用于将所述原始静态图片转换为位图;
插值单元,用于根据预设的时间分段规则生成n个时间节点;
第一颜色矩阵计算单元,用于在第i个时间节点,根据预设的颜色矩阵初始值F、颜色矩阵结束值L以及颜色矩阵计算规则,计算第i个时间节点的颜色矩阵值;
绘制单元,用于在第i个时间节点,以所述颜色矩阵值为颜色过滤属性的值,根据所述颜色过滤属性对所述位图进行绘制,得到新的图片并显示;
其中i为自然数,i=1,2……n。
12.如权利要求11所述的基于属性动画的色调变化动画实现装置,其特征在于,还包括缩放单元,所述缩放单元用于:在将所述原始静态图片转换为位图之后,根据预设的时间分段规则生成n个时间节点之前,根据显示区域的大小对所述位图进行缩放。
13.如权利要求11所述的基于属性动画的色调变化动画实现装置,其特征在于,所述预设的时间分段规则为时间节点之间的间隔相同且小于0.1秒。
14.如权利要求11所述的基于属性动画的色调变化动画实现装置,其特征在于,所述颜色矩阵包括红色R分量、绿色G分量、蓝色B分量、透明度Alpha分量和占位符分量。
15.如权利要求11所述的基于属性动画的色调变化动画实现装置,其特征在于,所述颜色矩阵计算单元,在计算第i个时间节点的颜色矩阵值时,具体用于:
若i=1,则以颜色矩阵初始值F为第1个时间节点的颜色矩阵值M1
若i=n,则以颜色矩阵结束值L为第n个时间节点的颜色矩阵值Mn;否则,
计算第i个时间节点的颜色矩阵值Mi中的第j个分量hj(Mi),当hj(L)≥hj(F)时,hj(Mi)=hj(F)+[hj(L)-hj(F)]×i/n,当hj(L)<hj(F)时,hj(Mi)=hj(L)-[hj(F)-hj(L)]×i/n。
16.如权利要求11所述的基于属性动画的色调变化动画实现装置,其特征在于,还包括:
主色获取单元,用于在将所述原始静态图片转换为位图之后,根据预设的时间分段规则生成n个时间节点之前,获取所述原始静态图片的主色,所述主色为所述原始静态图片中像素点最多的颜色;
预设颜色矩阵确定单元,用于根据所述主色确定预设的颜色矩阵初始值F和颜色矩阵结束值L。
17.如权利要求16所述的基于属性动画的色调变化动画实现装置,其特征在于,所述主色获取单元,包括:
像素点统计模块,用于将颜色值在预设偏差范围以内的像素点归为同一颜色的像素点,统计各个预设偏差范围内的像素点;
主色偏差范围确定模块,用于比较各个预设偏差范围以内像素点的个数,以像素点最多的预设偏差范围为主色偏差范围;
主色确定模块,用于计算主色偏差范围内的颜色值的平均值,以所述平均值对应的颜色为主色。
18.如权利要求16或17所述的基于属性动画的色调变化动画实现装置,其特征在于,所述预设颜色矩阵确定单元,包括:
颜色矩阵初始值确定模块,用于以保持主色的原颜色值的颜色矩阵值为颜色矩阵初始值F;
主色变化范围设定模块,用于以F为边界值之一根据预设的主色变化值设定主色变化范围;
颜色矩阵结束值确定模块,以所述主色变化范围的另一边界值为颜色矩阵结束值L。
19.如权利要求11所述的基于属性动画的色调变化动画实现装置,其特征在于,
所述插值单元,用于使用插值器根据预设的时间分段规则生成n个时间节点;
所述第一颜色矩阵计算单元,用于在第i个时间节点,根据预设的颜色矩阵初始值F、颜色矩阵结束值L以及颜色矩阵计算规则,使用估值器计算第i个时间节点的颜色矩阵值;
所述绘制单元,用于在第i个时间节点,将画笔的颜色过滤属性的值设置为所述颜色矩阵值,并使用所述画笔对所述位图进行绘制,得到新的图片并显示。
20.一种基于属性动画的色调变化动画实现装置,其特征在于,包括:
原始静态图片获取单元,用于获取原始静态图片;
图片转换单元,用于将所述原始静态图片转换为位图;
第二颜色矩阵计算单元,根据预设的颜色矩阵初始值F、颜色矩阵结束值L、时间节点个数n以及颜色矩阵计算规则,计算第i个时间节点的颜色矩阵值;
插值单元,用于根据预设的时间分段规则生成n个时间节点;
绘制单元,用于在第i个时间节点,以第i个时间节点的颜色矩阵值为颜色过滤属性的值,根据所述颜色过滤属性对所述位图进行绘制,得到新的图片并显示;
其中i为自然数,i=1,2……n。
CN201610811213.1A 2016-09-08 2016-09-08 一种基于属性动画的色调变化动画实现方法及装置 Active CN106408632B (zh)

Priority Applications (2)

Application Number Priority Date Filing Date Title
CN201610811213.1A CN106408632B (zh) 2016-09-08 2016-09-08 一种基于属性动画的色调变化动画实现方法及装置
PCT/CN2017/083033 WO2018045769A1 (zh) 2016-09-08 2017-05-04 一种基于属性动画的色调变化动画实现方法及装置

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
CN201610811213.1A CN106408632B (zh) 2016-09-08 2016-09-08 一种基于属性动画的色调变化动画实现方法及装置

Publications (2)

Publication Number Publication Date
CN106408632A true CN106408632A (zh) 2017-02-15
CN106408632B CN106408632B (zh) 2019-10-25

Family

ID=57998795

Family Applications (1)

Application Number Title Priority Date Filing Date
CN201610811213.1A Active CN106408632B (zh) 2016-09-08 2016-09-08 一种基于属性动画的色调变化动画实现方法及装置

Country Status (2)

Country Link
CN (1) CN106408632B (zh)
WO (1) WO2018045769A1 (zh)

Cited By (5)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
WO2018045769A1 (zh) * 2016-09-08 2018-03-15 广州阿里巴巴文学信息技术有限公司 一种基于属性动画的色调变化动画实现方法及装置
CN109064529A (zh) * 2018-07-30 2018-12-21 北京酷我科技有限公司 一种按钮动态闪烁的动画算法
CN110033501A (zh) * 2018-01-10 2019-07-19 武汉斗鱼网络科技有限公司 一种动画的实现方法及电子终端
US11132766B2 (en) * 2017-10-09 2021-09-28 Huawei Technologies Co., Ltd. Image processing method and device using multiple layers of an operating system
CN116797700A (zh) * 2023-07-13 2023-09-22 北京可利邦信息技术股份有限公司 动态颜色渐变背景图像生成方法、装置、系统及存储介质

Families Citing this family (1)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN109166166B (zh) * 2018-09-06 2022-11-22 北京酷我科技有限公司 一种扩散粒子动画的实现方法

Citations (9)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN101309377A (zh) * 2007-05-14 2008-11-19 深圳艾科创新微电子有限公司 一种实现osd背景渐变显示的方法
CN101828202A (zh) * 2007-10-17 2010-09-08 三菱电机株式会社 图像处理装置
CN103413342A (zh) * 2013-07-25 2013-11-27 南京师范大学 一种基于像素点的图像文字渐变方法
CN103761303A (zh) * 2014-01-22 2014-04-30 广东欧珀移动通信有限公司 一种图片的排列显示方法及装置
CN103903587A (zh) * 2012-12-27 2014-07-02 腾讯科技(深圳)有限公司 一种处理图片数据的方法及装置
CN104217452A (zh) * 2014-09-10 2014-12-17 珠海市君天电子科技有限公司 实现颜色渐变的方法及装置
CN104679380A (zh) * 2013-11-30 2015-06-03 富泰华工业(深圳)有限公司 用户界面背景色调整系统及其方法
CN104965631A (zh) * 2015-05-26 2015-10-07 深圳市万普拉斯科技有限公司 桌面配色方法、装置及智能终端
CN105427358A (zh) * 2015-12-23 2016-03-23 武汉斗鱼网络科技有限公司 一种基于安卓的视图动画生成方法及系统

Family Cites Families (3)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
GB9619119D0 (en) * 1996-09-12 1996-10-23 Discreet Logic Inc Processing image
CN103810739B (zh) * 2014-02-20 2017-01-04 南京师范大学 一种图像文字变形动画的生成方法
CN106408632B (zh) * 2016-09-08 2019-10-25 广州阿里巴巴文学信息技术有限公司 一种基于属性动画的色调变化动画实现方法及装置

Patent Citations (9)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN101309377A (zh) * 2007-05-14 2008-11-19 深圳艾科创新微电子有限公司 一种实现osd背景渐变显示的方法
CN101828202A (zh) * 2007-10-17 2010-09-08 三菱电机株式会社 图像处理装置
CN103903587A (zh) * 2012-12-27 2014-07-02 腾讯科技(深圳)有限公司 一种处理图片数据的方法及装置
CN103413342A (zh) * 2013-07-25 2013-11-27 南京师范大学 一种基于像素点的图像文字渐变方法
CN104679380A (zh) * 2013-11-30 2015-06-03 富泰华工业(深圳)有限公司 用户界面背景色调整系统及其方法
CN103761303A (zh) * 2014-01-22 2014-04-30 广东欧珀移动通信有限公司 一种图片的排列显示方法及装置
CN104217452A (zh) * 2014-09-10 2014-12-17 珠海市君天电子科技有限公司 实现颜色渐变的方法及装置
CN104965631A (zh) * 2015-05-26 2015-10-07 深圳市万普拉斯科技有限公司 桌面配色方法、装置及智能终端
CN105427358A (zh) * 2015-12-23 2016-03-23 武汉斗鱼网络科技有限公司 一种基于安卓的视图动画生成方法及系统

Cited By (7)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
WO2018045769A1 (zh) * 2016-09-08 2018-03-15 广州阿里巴巴文学信息技术有限公司 一种基于属性动画的色调变化动画实现方法及装置
US11132766B2 (en) * 2017-10-09 2021-09-28 Huawei Technologies Co., Ltd. Image processing method and device using multiple layers of an operating system
US20220058772A1 (en) * 2017-10-09 2022-02-24 Huawei Technologies Co., Ltd. Image Processing Method and Device
CN110033501A (zh) * 2018-01-10 2019-07-19 武汉斗鱼网络科技有限公司 一种动画的实现方法及电子终端
CN110033501B (zh) * 2018-01-10 2023-09-26 武汉斗鱼网络科技有限公司 一种动画的实现方法及电子终端
CN109064529A (zh) * 2018-07-30 2018-12-21 北京酷我科技有限公司 一种按钮动态闪烁的动画算法
CN116797700A (zh) * 2023-07-13 2023-09-22 北京可利邦信息技术股份有限公司 动态颜色渐变背景图像生成方法、装置、系统及存储介质

Also Published As

Publication number Publication date
CN106408632B (zh) 2019-10-25
WO2018045769A1 (zh) 2018-03-15

Similar Documents

Publication Publication Date Title
CN106408632A (zh) 一种基于属性动画的色调变化动画实现方法及装置
CN108229279A (zh) 人脸图像处理方法、装置和电子设备
CN111199518B (zh) Vr设备的图像呈现方法、装置、设备和计算机存储介质
CN105575314B (zh) 一种灰阶处理方法、灰阶处理装置及显示装置
CN109616080B (zh) 一种异形屏轮廓补偿方法及终端
CN101471063A (zh) 色度信号生成装置
CN106023276A (zh) 基于图像处理的铅笔画绘制方法及装置
CN103366045A (zh) 基于格子Boltzmann的流体可视化仿真方法
CN112995534A (zh) 视频生成方法、装置、设备及可读存储介质
Hrabovskyi et al. Development of a method for the creation of 3d advertising printing products
US7071947B1 (en) Automatic adjustment of floating point output images
US6252997B1 (en) Method for image processing
CN105513558A (zh) 医用专业显示器超高位宽图像增强显示装置及方法
Narayan et al. Optimized color models for high-quality 3d scanning
CN108596959A (zh) 一种视频图像时空特征点的提取方法
Welk et al. Quantile filtering of colour images via symmetric matrices
CN112102216B (zh) 自适应权重的全变差图像融合方法
CN102074042A (zh) 可利用日常物品生成丰富图案效果的图案生成系统及方法
CN103871024A (zh) 一种基于有理函数可调性适应人眼视觉的图像插值方法
Lu et al. A two-stage parametric subspace model for efficient contrast-preserving decolorization
Martín et al. Analysis of drawing characteristics for reproducing traditional hand-made stippling
CN110517333A (zh) 动态浅浮雕模型建模方法
JP6615818B2 (ja) 映像生成装置、映像生成方法、およびプログラム
CN105554487B (zh) 一种数字图像格式转换的方法及装置
US6903740B1 (en) Volumetric-based method and system for visualizing datasets

Legal Events

Date Code Title Description
C06 Publication
PB01 Publication
C10 Entry into substantive examination
SE01 Entry into force of request for substantive examination
GR01 Patent grant
GR01 Patent grant
TR01 Transfer of patent right

Effective date of registration: 20200721

Address after: 310052 room 508, floor 5, building 4, No. 699, Wangshang Road, Changhe street, Binjiang District, Hangzhou City, Zhejiang Province

Patentee after: Alibaba (China) Co.,Ltd.

Address before: 510627 Guangdong city of Guangzhou province Whampoa Tianhe District Road No. 163 Xiping Yun Lu Yun Ping radio square B tower 13 floor 03 unit self

Patentee before: GUANGZHOU ALIBABA LITERATURE INFORMATION TECHNOLOGY Co.,Ltd.

TR01 Transfer of patent right