Pacman Game Tutorial with JavaScript and HTML5 Canvas

Опубликовано: 01 Февраль 2022
на канале: Chris Courses
148,289
3k

Want to next level this course? I added 5 1/2 hours of extra content that you can start at https://chriscourses.com/courses/pacm.... I'll teach you plenty of extras such as how to add and animate ghost sprites, create multiple levels, increase difficulties, and so much more. Enjoy!

Game Assets: https://drive.google.com/drive/folder...
GitHub Gist with pre-built map and switch case statements: https://gist.github.com/christopher4l...

Pacman is another classic game which can be coded in less than 1000 lines of code. Here, I'll teach you everything you need to know to get your own Pacman-style game up and running with the HTML5 canvas and vanilla JavaScript.

0:00 - What we're developing
1:42 - Project setup
9:01 - Generate map boundaries
28:16 - Add Pacman with movement
54:01 - Add collision detection
1:17:17 - Swap boundaries with images
1:28:54 - Generate pellets
1:32:41 - Remove pellets on collision
1:38:35 - Add score
1:44:59 - Create ghost
2:14:44 - Create power-up
2:25:07 - Add win condition
2:26:50 - Pacman chomp animation


Смотрите видео Pacman Game Tutorial with JavaScript and HTML5 Canvas онлайн без регистрации, длительностью часов минут секунд в хорошем качестве. Это видео добавил пользователь Chris Courses 01 Февраль 2022, не забудьте поделиться им ссылкой с друзьями и знакомыми, на нашем сайте его посмотрели 148,289 раз и оно понравилось 3 тысяч людям.