Hiệu ứng gợn sóng hình nền động

Question

Tôi đang làm việc trên một hình nền sống kết hợp một số hiệu ứng gợn nước khi chạm vào màn hình nhưng tôi hơi bị kẹt. Có thể tốt hơn là tạo nhiều hình ảnh và lặp lại chúng để tạo ra một hình động gợn sóng hay nó sẽ tốt hơn để bóp méo bitmap một chút trước khi tôi đặt nó lên khung hình?

This là video có hiệu ứng gợn rất đẹp được thực hiện qua OpenGL.

Tôi chưa có kinh nghiệm với OpenGL và đã tự hỏi liệu vẫn có thể tạo hiệu ứng nước 2D trên hình nền động không?

Answer 1

Tôi muốn thực hiện một hiệu ứng gợn thực tế trong Android quá, như vậy sẽ chia sẻ kinh nghiệm của tôi:

Là một thực hiện tham khảo tôi mất cổng Chikuyonok Javascript Sergey của Neil Wallis Java algo. Đây là một sân chơi nơi bạn có thể thử nghiệm với mã JS gốc: http://jsfiddle.net/esteewhy/5Ht3b/6/

Lúc đầu, tôi đã chuyển mã JS sang Java chỉ để nhận ra rằng không có cách nào để ép hơn 1 fps trên phần cứng Huawei U8100 của tôi. (Có một số nỗ lực tương tự trên mạng với kết luận duy nhất: họ đang ridiculously chậm).

BTW, câu trả lời SO này khá hữu ích để hiểu cơ bản về cách mã đồ họa tương tác trong Android: https://stackoverflow.com/a/4946893/35438. Tôi đã mượn bộ đếm fps từ đó.

Sau đó, tôi quyết định dùng thử NDK của Android để thực hiện lại bản ngã gốc trong C thuần túy (lần đầu tiên tôi gặp nó trong 10+ năm!). Mặc dù các tài liệu của NDK hơi khó hiểu (đặc biệt là yêu cầu và điều kiện tiên quyết), tất cả đều hoạt động như một nét duyên dáng, vì vậy tôi có thể đạt tới 30 khung hình/giây - nó có thể không quá ấn tượng, nhưng vẫn là một cải tiến triệt để trên mã Java .

Cuối cùng, tôi đã đặt tất cả công việc của mình trực tuyến: https://github.com/esteewhy/whater, vì vậy vui lòng chơi với điều đó.Nó có chứa:

1. Mã bouncing bóng nảy tương tự được đề cập ở trên (chỉ để tham khảo).
2. Gợn sóng nước Cổng Java (chậm như địa ngục!)
3. Gợn sóng nước C triển khai (cần NDK để biên dịch và JDK để tạo tệp .h).

(Dự án này là không "sạch", nghĩa là: tất cả các mã nhị phân là ở đó, như vậy có thể cố gắng chạy nó "như là" ngay cả khi không NDK.)

Answer 2

Tôi không có chuyên gia về điều này, nhưng tôi tin rằng cách điển hình để làm hiệu ứng nước trong OpenGL là với trình đổ bóng phân đoạn. Với một hình ảnh tĩnh dưới dạng kết cấu, trình đổ bóng của bạn có thể thay đổi tọa độ kết cấu được sử dụng để lấy mẫu hình ảnh đó, để làm biến dạng nó theo các cách tùy ý.

Tính hướng và khoảng cách của điểm ảnh từ tâm vòng tròn và điều chỉnh tọa độ kết cấu theo hướng hoặc ra khỏi tâm của vòng tròn dựa trên chức năng hình sin của khoảng cách và bạn sẽ có hiệu ứng gợn sóng đẹp.

Đánh giá theo mô tả của video YouTube mà bạn đã liên kết, có vẻ như việc đó được thực hiện bằng cách sử dụng lưới hình tam giác và điều chỉnh tọa độ kết cấu chỉ ở các đỉnh. Điều đó cũng có tác dụng, nhưng nó sẽ không tốt nếu bạn không sử dụng lưới khá tốt. Làm cho nó mỗi pixel với một shader fragment là lý tưởng, nhưng tôi không biết liệu điều đó có gây ra vấn đề về hiệu năng trên GPU của điện thoại hay không.

Answer 3

Bạn có thể tìm thấy một ví dụ về một hiệu ứng gợn liên lạc ở đây:

https://github.com/MasDennis/RajawaliExamples

Nó sử dụng Rajawali OpenGL ES khuôn khổ/thư viện. Bạn có thể tải xuống ứng dụng ví dụ rajawali từ thị trường để xem nó trông như thế nào. Duyệt qua thư mục "src" và bạn sẽ thấy hoạt động TouchRippleEffect và trình kết xuất đồ họa. Hy vọng rằng sẽ giúp.