Game Code Bites

Пікірлер

@lostmotion18 4 ай бұрын

I accidentally put the index.js file ONTOP of the of the health-bar file.. DOH! Haha thanks for helping me learn to code!

@sweetlobster3939 5 ай бұрын

cool

@bistbist1615 Жыл бұрын

You're good in creating games keep going.😊

@RictorScale Жыл бұрын

Great video! I am wondering if you can expand on why clearin the canvas every frame is a bad idea, and what an alternate approach should be? thanks!

@RokSlana Жыл бұрын

Clean, clear. Very nice.

@juanca5333 Жыл бұрын

Como puedo solocitar un sitio para cloud gaming

@lucutes2936 Жыл бұрын

thx

@EyeoftheNyte 2 жыл бұрын

out of curiosity does this still work? I've tried it and the bar never shows. Perhaps I'm missing something though.

@Retrofire-47 2 жыл бұрын

my only grievance with this technique is that you are kinda polluting the global scope with all these variables... for a small animation loop that defines a program it makes sense, but if you have an actual video game then introducing like 10 entirely proprietary variables right at the top of the script becomes unsustainable almost immediately.. you would need a better way to store them

@Nodsaibot 2 жыл бұрын

why not add matrix as string then split?? matrix = '1111111111 1000000001 1111111111'

@Bullet-ShawnSak 2 жыл бұрын

If my player takes a damage, it decreases. But if the player gain hp, bar doesn’t gain hp. How could I do it? Could you please give me the idea or how to think to make it happen? Thank you for uploading the helpful video 👍

@agent-33 2 жыл бұрын

Thanks a lot. I like the final note. What I do for static images is draw them in another canvas behind the canvas with animations involve. About looping collision check, I can only do optimized check for tile-based games because I can just check neighbor coordinates of player if collision is solid or not. (so not really checking vertices collision) Another guess is to get all solid objects around the player within a limited boundary so you only have to loop over nearby solid objects.

@gamecodebites4672 2 жыл бұрын

What you suggested is correct, this is what I do when building a real optimized game, but for the sake of not confusing the learners, I don't dig into those details and focus only on what they need to learn. Thanks!

@agent-33 2 жыл бұрын

What is the use of beginPath and closePath in renderQuad function? Can't it achieve the same thing without those? Why store functions in a variable? Can't it achieve the same by declaring function?

@gamecodebites4672 2 жыл бұрын

Briefly speaking, beginPath will start a new path and remove the list of paths. closePath, will connect the current path, with the first point. It's confusing, but sometimes you'll get weird results without them. For the second question, the difference is in the hosting, but my personal reason is to distinguish between a function that will be treated like a class (instantiate an instance out of it), but with const/let, I use them as real functions. Note that, when using direct function declaration (without const, let, or var) you'll be able to call that function event if the declaration was after the location of calling.

@jbertrow1056 2 жыл бұрын

i remember solitaire game..

@someuser3383 2 жыл бұрын

Do a full course of javascript game, please.

@mattshroom33 2 жыл бұрын

Thank you for this it helped a lot!

@kakesh4690 2 жыл бұрын

Admin please make maze game using grid but each coordinate is like a room and this rooms rotates so that if it is available to to enter to another room it goes through and collects coins and then return back. Please admin do that game even if you have two-three comments on your video???

@soniamaklouf1178 2 жыл бұрын

Hi Fahad Will you keep posting content in this channel in the future ? Thanks

@gamecodebites4672 2 жыл бұрын

Hi Sonia, I have plans to return and start posting more videos. Thanks

@megavore1201 2 жыл бұрын

joe

@aylictal 3 жыл бұрын

For something like a health bar, why would you use canvas to draw one instead of using a div that laid over the canvas for this?

@paleta3984 2 жыл бұрын

for the maleability, if you will do a game using canvas its very flexible than use css to style the lifebar

@paleta3984 2 жыл бұрын

you can do the lifebar with sprites made by yourself, dont need a huge css knowledge to do something cool

@zakhariihusar6975 3 жыл бұрын

The best tutorial on spritesheet i've seen!

@augustusmark715 3 жыл бұрын

instaBlaster...

@zakhariihusar6975 3 жыл бұрын

@eboatwright_ 3 жыл бұрын

Thanks! :D

@goncalolucas1103 3 жыл бұрын

i like you

@AIToolzai 3 жыл бұрын

Great channel. Keep up the good work! Haven't seen new videos from you recently. Hope all is good with you.

@kiraireal 3 жыл бұрын

I am the 1k view

@sertansantos3032 3 жыл бұрын

Thanks for sharing

@James-bu1ds 3 жыл бұрын

Any samples of Vertical Sprite Images?

@gamecodebites4672 3 жыл бұрын

Sorry, this one only handles one row (row = 0) with multiple columns, but it's not hard to traverse through multiple vertical columns, you just need to add a variable to handle those slices, based on frame index and the position of slice in terms of the desired row.

@James-bu1ds 3 жыл бұрын

@@gamecodebites4672 Can you help me how? Been stuck of this problem yesterday... just sample of vertical images

@gamecodebites4672 3 жыл бұрын

@@James-bu1ds should be something like this instead of what we have in the original animate function (didn't test it) function animate(state) { context.drawImage( spriteSheet, 0, state.frameIndex * frameHeight, frameWidth, frameHeight, xPos, yPos, frameWidth * scale, frameHeight * scale ); Notice that I changed the second param to be 0 and the third param to be state.frameIndex * frameHeight, and with this approach it will navigate vertically rather than horizontally, also you have to make sure to have the proper Sprite Sheet to have multiple rows rather than one single row. But again, I didn't test it, but it should give you an insight on how to achieve your goal. Good luck!

@James-bu1ds 3 жыл бұрын

@@gamecodebites4672 That's hella help! Thank you very much

@gopalmandloi6374 3 жыл бұрын

why do we need strokeRect method ?

@gamecodebites4672 3 жыл бұрын

To draw borders around the health bar

@gopalmandloi6374 3 жыл бұрын

Awesome as always Fahad. But, why we are doing it on canvas, we can do it on regular html page right with the same javascript mainly

@gamecodebites4672 3 жыл бұрын

Thanks! Health Bar is a component that lives within the game cycle itself. It makes sense to treat it like any other game components (player for example), they are all within the Canvas. If you put it on the HTML, then you'll have to deal with some CSS positioning operations not to mention + "px" and thing like that. Also, you can apply and unify your scaling (someVal * GAME_SCALE) on the health bar and other components when it lives in the Canvas, other than that you have to tweak your CSS. Also, it makes more sense to have the UI layer rendered in a different Canvas, but for the sake of simplicity I kept it in one single Canvas.

@yaseeno0 3 жыл бұрын

Great video, can you make a video showing what specific software you use and how to get started on it so we can follow along?

@gamecodebites4672 3 жыл бұрын

Thanks Yaseen! The IDE/code editor called Atom. The programming language is JavaScript, and for sure I'm using HTML5 to host the Canvas element so I can draw things on it. You can search up some examples that explain how to get started with creating a simple web page. Let me know if you have more questions.

@gopalmandloi6374 4 жыл бұрын

As always Awesome Fahad.

@gamecodebites4672 3 жыл бұрын

Thank you!