Live Wallpaper Water Ripple Effect

Question

Я работаю над живыми обоими, которые включают некоторые эффекты пульсации воды при касании экрана, но я немного застрял.

Было бы лучше создать несколько изображений и прокрутить их, чтобы создать анимацию пульсации, или было бы лучше исказить растровое изображение немного, прежде чем поместить его на холст?

This - это видео очень приятного эффекта пульсации, выполняемого через OpenGL.

У меня еще нет опыта работы с OpenGL, и мне было интересно, можно ли создать 2D-эффект воды на живых обоях?

Answer 1

Я хотел реализовать реалистичную мультипликационный эффект в Android тоже, так что поделюсь опытом:

в качестве эталонной реализации я принял Chikuyonok JavaScript порта Сергея Нила Уоллиса Java алгоритмом. Вот игровая площадка, где вы можете поэкспериментировать с оригинальным JS-кодом: http://jsfiddle.net/esteewhy/5Ht3b/6/

Сначала я портировал JS-код на Java только для того, чтобы понять, что на моем оборудовании Huawei U8100 нет возможности сжать более 1 кадра в секунду. (Есть несколько подобных попыток в сети с единственным заключением: они смехотворно медленны).

BTW, этот ответ был очень полезен, чтобы получить базовое представление о том, как закодировать интерактивную графику в Android: https://stackoverflow.com/a/4946893/35438. Я заимствовал счетчик fps оттуда.

Тогда я решил попробовать Android NDK, чтобы повторно реализовать оригинальный алгоритм в чистом C (моя первая встреча с ним в 10+ лет!). Несмотря на то, что документы NDK несколько сбивают с толку (особенно в отношении требований и предварительных условий), все это работало как шарм, поэтому я смог достичь до 30 кадров в секунду - это может быть не слишком впечатляющим, но все же радикальным улучшением по сравнению с Java-кодом ,

Наконец, я поставил всю свою работу в Интернете: https://github.com/esteewhy/whater, поэтому не стесняйтесь играть с этим.В нем содержатся:

1. Интерактивный код отскока шарика, упомянутый выше (только для справки).
2. Вода рябит Java-порт (медленный, как ад!)
3. Реализация воды (C) (требуется NDK для компиляции и JDK для создания файла .h).

(Проект не является «чистым», то есть: все исполняемые файлы там, так что можно попробовать запустить его «как есть» и без НДК.)

Answer 2

Я не эксперт в этом, но я считаю, что типичный способ делать водные эффекты в OpenGL - это фрагментарный шейдер. Со статическим изображением в качестве текстуры ваш шейдер может изменять координаты текстуры, используемые для выборки этого изображения, искажать его произвольным образом.

Рассчитайте направление и расстояние пикселя от центра круга и отрегулируйте координату текстуры в направлении или от центра круга на основе синусоидальной функции расстояния, и вы должны получить хороший эффект пульсации.

Судя по описанию связанного с этим видео YouTube, похоже, что это делается с помощью сетки треугольников и корректировки координат текстуры только в вершинах. Это тоже должно работать, но оно не будет выглядеть так хорошо, если вы не используете довольно тонкую сетку. Выполнение этого на пиксель с помощью фрагментарного шейдера является идеальным, но я не знаю, вызовет ли это проблемы производительности на графическом процессоре телефона.

Answer 3

Вы можете найти пример сенсорный эффект ряби здесь:

https://github.com/MasDennis/RajawaliExamples

Он использует Rajawali OpenGL ES рамки/библиотеки. Вы можете скачать приложение примера rajawali с рынка, чтобы посмотреть, как он выглядит. Просмотрите папку «src», и вы увидите активность и рендеринг TouchRippleEffect. Надеюсь, это поможет.