

Інформатика, висвітлено 16.10.2023
Змінні та події #1 P5.JS
let x=20; - значення змінної х
noCursor(); - курсор відсутній
mouseX - змінна горизонтального переміщення курсора
mouseY - змінна вертикального переміщення курсора
setup() - подія запуску
draw() - подія рисування
mouseClicked() - подія Клацання мишки
doubleClicked() - подія Подвійне клацання мишки
mouseWheel() - подія Рух колеса миші
keyTyped(b) - подія Натиснення клавіши b на клавіатурі
Практична робота
1. У папці із власним прізвищем створіть папку із назвою JS#6
2. Перейдіть до сервісу p5.js: https://bit.ly/3zMVOJB
3. Виберіть веб-редактор (Editor) та зареєструйтесь/авторизуйтесь на p5.js
4. Змініть назву скетчу на назву Shapes_Events
5. Введіть код скетчe результат якого див. вище за зразком:
- полотно розміром 500х500
- курсор відсутній
- фон чорного кольору
- подія Рисування: жовтий круг, діаметр 20px, поява за рухом мишки
- подія Клацання мишки: червоний круг, діаметр 60px, поява після клацання мишки
- подія Подвійне клацання мишки: зелений круг, діаметр 40px, поява після подвійного клацання мишки
- подія Рух колеса мишки: білий круг, діаметр 40px, поява після руху колеса мишки
- подія Натиснення клавіши клавіатури: синій квадрат, сторона квадрата 40px, поява після натиснення клавіши А на клавіатурі

Додаткові матеріали
Фото

