Prosty efekt wody (z użyciem plugin'a Canvas)

2

Tagged

Attached Files

The following files have been attached to this tutorial:

.capx

water-canvas.capx

Download now 207.22 KB

Stats

2,485 visits, 2,797 views

Tools

License

This tutorial is licensed under CC BY 4.0. Please refer to the license text if you wish to reuse, share or remix the content contained within this tutorial.

Published on 18 Aug, 2014. Last updated 25 Feb, 2019

Projekt z przykładem prostego efektu wody, który prototypowałem dla klienta.

Ostatecznie zdecydowaliśmy się na trochę inne podejście do tematu, w związku z czym postanowiłem podzielić się tym projektem.

Zamysł był taki, by stworzyć efekt wody, która wizualnie wyglądała i poruszała by się jako jeden obiekt bez widocznych łączeń. Zachowując przy tym płynność i łatwość w kontrolowaniu prędkości oraz wysokości fali.

Interactive demo

Zasada działania jest dość prosta. Efekt wykorzystuje plugin'a Canvas od R0J0hound, który tworzy krzywe bezier'a pomiędzy punktami (obiektami Sprite) rozłożonymi równomiernie wzdłuż layout'u. Każdy Sprite posiada sine behavior, który kontroluje wysokość oraz prędkość fali.

.CAPX

water-canvas.capx

Download now 207.22 KB
  • 0 Comments

Want to leave a comment? Login or Register an account!