动态壁纸水波纹效果

Posted

技术标签:

【中文标题】动态壁纸水波纹效果【英文标题】:Live Wallpaper Water Ripple Effect 【发布时间】:2012-05-06 18:00:07 【问题描述】:

我正在制作一个动态壁纸,它在触摸屏幕时加入了一些水波纹效果,但我有点卡住了。

创建多个图像并循环播放它们以创建波纹动画会更好,还是在将位图放置在画布上之前稍微扭曲位图会更好?

This 是一个通过 OpenGL 完成的非常漂亮的涟漪效果视频。

我还没有任何 OpenGL 经验,想知道是否仍然可以在动态壁纸上创建 2D 水效果?

【问题讨论】:

android内置的动态壁纸之一是涟漪水,所以这当然是可能的。 【参考方案1】:

我也想在 Android 中实现逼真的涟漪效果,所以分享一下我的经验:

作为参考实现,我采用了 Neil Wallis Java 算法的 Sergey 的 Chikuyonok javascript 端口。这是一个可以试验原始 JS 代码的游乐场:http://jsfiddle.net/esteewhy/5Ht3b/6/

起初,我将 JS 代码移植到 Java 只是为了意识到在我的华为 U8100 硬件上无法压缩超过 1 fps。 (网上有几个类似的尝试,唯一的结论是:它们慢得离谱)。

顺便说一句,这个 SO 答案对于基本了解如何在 Android 中编写交互式图形代码非常有用:https://***.com/a/4946893/35438。我从那里借了 fps 计数器。

然后我决定尝试 Android NDK 以用纯 C 重新实现原始算法(我在 10 多年前第一次遇到它!)。尽管 NDK 的文档有些混乱(尤其是在要求和先决条件方面),但一切都像一个魅力,所以我能够达到 30 fps——它可能不是太令人印象深刻,但仍然是对 Java 代码的根本改进.

最后,我把我所有的工作都放到网上了:https://github.com/esteewhy/whater,所以请随意玩。它包含:

    上面提到的互动弹跳球代码(仅供参考)。 Java 端口的水波纹(慢得要命!) 水波纹C实现(需要NDK编译,JDK创建.h文件)。

(该项目不是“干净”的,即:所有二进制文件都在那里,因此即使没有 NDK,也可以尝试“按原样”运行它。)

【讨论】:

您能告诉我如何在您的代码中更改图像的背景吗?当我尝试时,我有 NullPointerException 谢谢【参考方案2】:

您可以在此处找到触摸波纹效果的示例:

https://github.com/MasDennis/RajawaliExamples

它利用了 rajawali OpenGL ES 框架/库。您可以从市场上下载 rajawali 示例应用程序以查看它的外观。浏览“src”文件夹,您将看到 TouchRippleEffect 活动和渲染器。希望对您有所帮助。

【讨论】:

我已经从 playstore 下载了 Rajawali 示例。在那 27 是 Touch Ripples Effect 但是当我运行源代码时,该部分被注释...我的源代码中有以下行... org.rajawali3d:rajawali:1.1.346-SNAPSHOT@aar 任何人都可以帮助解决本期【参考方案3】:

我不是这方面的专家,但我相信在 OpenGL 中制作水效果的典型方法是使用片段着色器。使用静态图像作为纹理,您的着色器可以改变用于对该图像进行采样的纹理坐标,以任意方式对其进行扭曲。

计算像素的方向和距离圆心的距离,根据距离的正弦函数调整纹理坐标朝向或远离圆心,你应该会得到一个很好的波纹效果。

从您链接的那个 YouTube 视频的描述来看,这听起来像是通过使用三角形网格并仅在顶点处调整纹理坐标来完成的。这也应该有效,但除非您使用相当精细的网格,否则它看起来不会那么好。使用片段着色器按像素执行此操作是理想的,但我不知道这是否会导致手机 GPU 出现性能问题。

【讨论】:

您知道如何在 OpenGL 中执行此类操作的任何可能示例吗? 不是随便的,抱歉。如果您是 OpenGL 新手,我建议您大致了解片段着色器和纹理采样,一旦您了解了这些,然后担心使用它们来制造涟漪。

以上是关于动态壁纸水波纹效果的主要内容,如果未能解决你的问题,请参考以下文章

Android自定义动态壁纸开发

安卓怎么让壁纸动起来

ubuntu18.04桌面美化之动态壁纸(视频)

iPhone超好看的美女动态壁纸!

Windows10动态壁纸

iOS 7 - 自定义 UIView 的动态壁纸行为