Hitbox

This article is a stub. It may be incomplete, unfinished, or have missing parts/sections. If the article can be expanded, please do so! There may be suggestions on its talk page. (May 2018)

Scratch Cat with a suitable hitbox.

A hitbox is an invisible shape that detects collision with other objects. The shape is chosen and sized to best approximate the shape of the object. It is usually a primitive shape such as a circle or rectangle as these are easy to make and fast to calculate. Hitboxes may be represented with variables, lists, and for Scratch specifically, separate costumes to be briefly shown while a touching block is run.

Uses

Hitboxes are used for collision detection, often in games. Collisions could be between:

• the player and the ground
• the player and enemies
• an enemy and weapon projectile
• a user interface button and the mouse pointer

Where touching blocks are used in Scratch, hitboxes can be used to provide more reliable collision detection compared to detecting the displayed costumes. This can help avoid movement bugs in platformers and other similar games, for example.

A driving game (shown left) using costumes as hitboxes (visualized right).

For pen projects, hitboxes are usually implemented with variables/lists as the alternatives involve hidden sprites or the touching color block, which is slow and unreliable. Maths can be used to determine if the shapes are colliding and provide additional information like how much they intersect or where. This is useful for making objects realistically bounce.

Different Sprite Method

This method uses two sprites.

Drawing a Hitbox

To start, create a new sprite for the hitbox and open the "Costumes" tab. If you haven't already, backpack (or download onto your computer if you are using the offline editor) the first costume for your character, then upload it into a blank vector costume in your hitbox sprite. Using the rectangle tool, draw a rectangle over your character and make it as small possible without any part of the character showing. When you remove the character from behind, you will have your hitbox.

Programming the Hitbox

After you have made the sprite, you will need a platformer script inside the scripts area. If you don't know how to make one, a tutorial can be found here.

Linking the Two Sprites

Now that you have made the hitbox, you need to connect the character to it. Put this script in the character sprite:

when gf clicked
forever
  go to (Hitbox v)
end

Different Costume Method

This method uses one sprite with two different costumes.

Drawing the Costume

Duplicate the original costume. Rename it to "Hitbox". Then, create a rectangle that is roughly the same size and dimensions as the character. You can now delete the original character in the "Hitbox".

Using the Costume

The sprite will need a platformer script. After it has those scripts, put these blocks inside the main loop:

when gf clicked
forever
  switch costume to (Hitbox v)
  ... //main loop
  switch costume to (Original Costume v)
end

When you run your project, everything should be smoother.