Меня часто просят заснять видео по canvas. Вот собственно и оно. На видео мы разберем анимацию кружков которые будут рандомно отскакивать от стенок.
0:00 - Вступление
0:48 - Что такое canvas
1:17 - Примеры что можно сделать с помощью canvas
1:44 - Начало работы с canvas
2:19 - Получаем контекст
2:53 - Рисуем кружок arc(x,y, radius, 0, Math.PI * 2)
3:50 - Делаем скелет нашего приложения
6:15 - Знакомимся с Math.random()
12:40 - Первая анимация canvas
13:06 - Знакомимся с clearRect(x,y,width, height)
14:04 - Добавляем логику отскока
14:49 - Анимация отскока
15:06 - Делаем рандомную разрисовку каждой частицы
15:59 - Результат разрисовки
16:27 - Растягиваем canvas по все ширине и высоте экрана
17:13 - Результат работы
17:27 - Код из видео
Код находиться здесь - https://boosty.to/ineye/posts/5062fb4...
Контакт держу через
E-mail: [email protected]