发明的一种可选实施例中,子步骤S21还可以包括如下子步骤:
[0202] 子步骤S214,在所述特征区域外的像素点映射到在所述扭曲图片中的相同位置。
[0203] 本发明实施例中,如果静态图片上像素点在凸特征区域外,则可以直接拷贝到扭 曲图片上对应的相同位置,不产生扭曲。
[0204] 当然,本发明实施例也可以不对特征区域外的像素点进行映射,仅基于特征区域 中的像素点进行映射,本发明实施例对此不加以限制。
[0205] 在本发明的一种可选实施例中,子步骤S21还可以包括如下子步骤:
[0206] 子步骤S215,对扭曲图片中位置重叠的像素点进行像素点叠加处理。
[0207] 在本发明实施例中,由于静态图片进行映射产生扭曲,在扭曲图片中像素点较为 集中的区域,可能会产生像素点的位置重叠的情形。
[0208] 针对像素点的位置重叠的情形,本发明实施例可以进行像素点叠加处理。
[0209] 例如,若应用RGB色彩模式,则可以通过对像素点的红(R)、绿(G)、蓝(B)三个颜 色通道的变化以及它们相互之间的叠加来得到各式各样的颜色的。
[0210] 当然,为了进一步减少计算量,也可以从叠加的像素点中选取一个像素点(如随 机选取像素点、选取最后拷贝到该位置的像素点)作为该位置的像素点,还可以采用其他 方式选取该位置的像素点,本发明实施例对此不加以限制。
[0211] 在本发明的一种可选实施例中,子步骤S21还可以包括如下子步骤:
[0212] 子步骤S216,对扭曲图片中的空白位置进行像素点插值处理。
[0213] 在本发明实施例中,由于静态图片进行映射产生扭曲,在扭曲图片中像素点较为 稀疏的区域,可能会由某些像素点没有被赋值(即没有像素点映射到该位置,该位置的像 素点为原始状态,如白色),产生空白位置的情形。
[0214] 针对扭曲图片中的空白位置的情形,本发明实施例可以进行像素点插值处理,以 补全扭曲图片。
[0215] 例如,对于没有被赋值的像素点Px,选取距离它最近的已经赋值的像素点Py(如 上方的像素点、下方的像素点、左侧的像素点、右侧的像素点等),将像素点Py的值赋给像 素点Px。
[0216] 在实际应用中,当参考点(如图4A所示的Cl)移动到某一个位置的时候,可以根 据参考点(如图4A所示的C1)的位置映射出一张扭曲图片,随着参考点(如图4A所示的 C1)移动到不同的位置,扭曲图片也发生变化,扭曲图片可以连续播放,从而形成动态效果。
[0217] 如图5A所示,若参考点(如图4A所示的C1)在特征点(如图4A所示的C0)的左 侦牝则特征图像中整体可以往左侧扭曲;图5B所示,若参考点在特征点(如图4A所示的C0) 的右侧,则特征图像中整体可以往右侧扭曲。
[0218] 进一步地,若参考点的位置根据指定的交互操作事件确定,则参考点可以从特征 点的位置出发,沿指定的交互操作事件对应的方向(如摇晃事件的摇晃方向、指向发生屏 幕点击事件的方向)在特征点两侧分布,最终与特征点重合,则特征区域映射出的扭曲图 片可以沿指定的交互操作事件对应的方向来回扭曲,产生抖动效果,并最终静止。
[0219] 例如,如图4A所示,参考点C1沿着经过重心点C0的X轴方向上做震荡移动,参考 点C1每移动到一个位置就会生成一个扭曲图片,扭曲图片逐帧播放,可以产生如图5A和图 5B所示的特征区域内的图像表现出左右震动的动态效果。
[0220] 本发明实施例基于一个或多个参考点将静态图片的像素点映射到一帧或多帧扭 曲图片中,生成动态效果,计算简单、无需依赖第三方开发包、库文件或者工具,渲染生成速 度快,对资源消耗少,容易跨平台。
[0221] 在本发明的一种可选实施例中,步骤103可以包括如下子步骤:
[0222] 子步骤S31,在所述运动方向上,按照预设模式对所述特征区域中的至少部分像素 点进行纹理映射,产生包含一帧或多帧扭曲图片变化的动态效果。
[0223] 在本发明实施例中,可以以运动方向(包括加速度)作为扭曲的幅度参考,对静态 图片进行映射,以生成扭曲图片。
[0224] 静态图片中的特征区域中的像素点可以沿运动方向映射,造成静态图片的扭曲。
[0225] 当运动方向的幅度越大(如加速度的幅度越大、点击屏幕的位置离特征区域的中 心越远),扭曲的幅度可以越大,当运动方向的幅度越小(如加速度的幅度越小、点击屏幕 的位置离特征区域的中心越近),扭曲的幅度可以越小。
[0226] 在本发明的一种可选实施例中,子步骤S31可以包括如下子步骤:
[0227] 子步骤S311,将所述特征区域划分一个或多个绘制图形;
[0228] 在本发明实施例中,可以应用图形学的方式,即可以基于网格的生成动态效果。
[0229] 具体而言,可以将特征区域划分为一个或多个绘制图形,可选为三角形或其他形 状的网格(即绘制图形),采用三角形是因为图形绘制接口,如〇penGL(OpenGraphics Library),对于三角形的图形植染有高效率的加速算法。
[0230] 每个绘制图形中可以具有多个顶点,每个绘制图形(如三角形)可以由顶点(如 三个顶点)表示,除了对应的二维坐标外,每个顶点可以具有静态图片的纹理坐标。
[0231] 在一个实施例中,可以对特征区域的中心区域划分一个或多个绘制图形,以模拟 类似于物理水球的抖动效果(近似装满水的气球)。
[0232] 子步骤S312,在所述运动方向上,按照预设模式在一个或多个时间点移动每个绘 制图像的顶点;
[0233] 在本发明实施例中,可以按照预设模式,沿该运动方向的相同方向、相反方向移动 每个绘制图形的顶点。
[0234] 在本发明的一种可选实施例中,所述预设模式可以包括简谐运动模式和/或阻尼 振动模式;则在本发明实施例中,子步骤S312可以包括如下子步骤:
[0235] 子步骤S3121,在所述运动方向上,按照简谐运动模式和/或阻尼振动模式在一个 或多个时间点移动每个绘制图像的顶点。
[0236] 简谐运动,或简谐振动、谐振、SHM(SimpleHarmonicMotion),可以指某物体(如 每个绘制图形的顶点)进行简谐运动时,物体(如每个绘制图形的顶点)所受的力跟位移 成正比,并且力总是指向平衡位置。
[0237] 阻尼振动可以指在阻力作用下的震动,当阻力大小可以忽略时,可以说是简谐运 动。振动过程中受到阻力的作用,振幅逐渐减小,能量逐渐损失,直至振动停止。
[0238] 在本发明实施例的一种可选示例中,子步骤S3121可以包括如下子步骤:
[0239] 子步骤S31211,确定每个绘制图像的顶点的加速度;
[0240] 若交互操作事件为摇晃事件,则可以从该摇晃事件中提取摇晃时初始的加速度, 作为每个绘制图形的顶点的加速度,摇晃的幅度越大,每个绘制图形的顶点的加速度也越 大。
[0241] 若交互操作事件为屏幕点击事件,则可以提取预设的加速度作为每个绘制图形的 顶点初始的加速度。
[0242] 子步骤S31212,按照所述加速度和/或预设的阻尼系数,计算在一个或多个时间 点内沿所述运动方向移动每个绘制图像的顶点的移动距离;
[0243] 对于简谐运动,可以按照该加速度模拟每个绘制图形的顶点所受的力,该力指向 平衡位置,构建弹簧模型,模拟每个绘制图形的顶点沿运动方向进行简谐运动。
[0244] 对于阻尼振动,可以按照该阻尼系统模拟每个绘制图形的顶点所受的阻力,模拟 每个绘制图形的顶点沿运动方向进行阻尼振动。
[0245] 基于加速度、阻尼系数、运动方向可以通过运动学公式计算出在一个或多个时间 点内移动距离。
[0246] 子步骤S31213,由所述原始坐标和所述移动距离计算每个绘制图像的顶点的目标 坐标。
[0247] 在本发明实施例中,每个绘制图形的顶点可以具有原始坐标,即在静态图片中的 原始的二维坐标,沿运动方向,添加上该移动距离,则可以获得移动后的每个绘制图形的顶 点的位置(即目标坐标)。
[0248] 子步骤S313,针对每个绘制图形,使用图形绘制接口按照每个顶点的纹理坐标对 绘制图形中的像素点进行纹理映射,产生包含一帧或多帧扭曲图片变化的动态效果。
[0249] 在具体实现中,图形绘制接口可以采用OpenGL,其可以提供纹理映射(Texture Mapping),即是将纹理空间中的纹理像素映射到屏幕空间中的像素的过程。
[0250] 通常,使用纹理映射的步骤可以如下:
[0251] 第一步:定义纹理对象
[0252] constintTexNumber4 ;
[0253] GLuintmes_Texture[TexNumber];// 定义纹理对象数组
[0254] 第二步:生成纹理对象数组
[0255] glGenTextures(TexNumber,m_Texture);
[0256] 第