Creating a Collision Component

This lesson builds on concepts we covered in the previous chapter - reviewing those lessons is recommended if you're not already familiar with bounding boxes and calculating intersections in SDL.

So far in our entity-component system, entities have TransformComponent for position/scale, PhysicsComponent for movement, ImageComponent for rendering, and InputComponent for control.

However, they lack any sense of physical presence beyond their single point position managed by their TransformComponent. We'll address that by continuing working from where we left off in the previous lesson and adding a CollisionComponent.

Our CollisionComponent will inherit from Component, and work closely with the entity's TransformComponent. For reference, our Component.h and TransformComponent.h are provided below:

In an earlier lesson, we introduced bounding boxes as simple shapes (usually rectangles or cuboids) used to approximate the physical space an object occupies.

We used Axis-Aligned Bounding Boxes (AABBs) - rectangles whose sides are parallel to the coordinate axes. These are simpler to work with than rotated boxes.

We represented them using SDL_Rect (for integer coordinates) and SDL_FRect (for floating-point coordinates).

We also created a BoundingBox class back then. Now, we'll create a CollisionComponent that encapsulates similar ideas but integrates with our entity-component system.

Let's define CollisionComponent.h. It will inherit from Component and manage the shape of the entity for collision purposes.

Crucially, this component will not store the entity's position directly. That's the job of the TransformComponent. Instead, the CollisionComponent defines its shape relative to the entity's origin (the TransformComponent's position).

Let's start by giving it some member variables, alongside getters and setters. We'll give it:

• Offset: A Vec2 representing the top-left corner's offset from the entity's origin.
• Width, Height: Floating-point values defining the size of the collision box.
• Bounds: An SDL_FRect that will store the calculated bounding box each frame. This is the rectangle we'll use for intersection tests.

1#pragma once
2#include "Component.h"
3#include "Vec2.h"
4#include <SDL3/SDL.h>
5
6class CollisionComponent : public Component {
7 public:
8  // Inherit constructor
9  using Component::Component;
10
11  // Setters for defining the collision shape
12  void SetOffset(const Vec2& NewOffset);
13  void SetSize(float NewWidth, float NewHeight);
14
15  // Getter for the calculated bounds
16  const SDL_FRect& GetBounds() const;
17
18 private:
19  // Shape definition relative to owner's origin
20  Vec2 Offset{0.0, 0.0};
21  float Width{1.0};  // Default 1x1
22  float Height{1.0};
23
24  // Calculated bounds updated each tick
25  SDL_FRect Bounds{0.0, 0.0, 0.0, 0.0};
26};

Now, let's implement the basic setters and the getter in CollisionComponent.cpp:

1#include <iostream>
2#include <cmath>
3#include "CollisionComponent.h"
4
5void CollisionComponent::SetOffset(
6  const Vec2& NewOffset
7) {
8  Offset = NewOffset;
9  // Bounds will be recalculated in Tick()
10}
11
12void CollisionComponent::SetSize(
13  float NewWidth, float NewHeight
14) {
15  if (NewWidth < 0 || NewHeight < 0) {
16    std::cerr << "Warning: CollisionComponent "
17      "width/height cannot be negative. "
18      "Using absolute values.\n";
19    Width = std::abs(NewWidth);
20    Height = std::abs(NewHeight);
21  } else {
22    Width = NewWidth;
23    Height = NewHeight;
24  }
25  // Bounds will be recalculated in Tick()
26}
27
28const SDL_FRect& CollisionComponent::GetBounds() const {
29  return Bounds;
30}

The CollisionComponent needs to recalculate its Bounds rectangle every frame, as the owning entity might have moved. We'll do this in the Tick() method.

1// ...
2
3class CollisionComponent : public Component {
4 public:
5  // ...
6
7  // Called each frame to update Bounds
8  void Tick(float DeltaTime) override; // <h>
9  // ...
10};

Tick() needs to:

1. Get the owner entity's current position - GetOwnerPosition() - and scale - GetOwnerScale().
2. Calculate the top-left corner of the bounds: OwnerPosition + Offset.
3. Calculate the scaled width and height: Width * OwnerScale, Height * OwnerScale.
4. Store these values in the Bounds member.

1// ...
2
3void CollisionComponent::Tick(float DeltaTime) {
4  Vec2 OwnerPos{GetOwnerPosition()};
5  float OwnerScale{GetOwnerScale()};
6
7  // Calculate position and dimensions
8  Bounds.x = OwnerPos.x + Offset.x;
9  Bounds.y = OwnerPos.y + Offset.y;
10  Bounds.w = Width * OwnerScale;
11  Bounds.h = Height * OwnerScale;
12}
13
14// ...

The CollisionComponent needs a TransformComponent to know the entity's position and scale. Let's enforce this in Initialize():

We'll add the standard AddCollisionComponent() and GetCollisionComponent() methods to Entity.h.

For simplicity in this lesson, we'll assume only one CollisionComponent per entity. If multiple shapes are needed, a more advanced design might involve a GetCollisionComponents() function that returns a std::vector, similar to GetImageComponents().

Let's update our Entity class:

1// ...
2#include "CollisionComponent.h" 
3// ...
4
5class Entity {
6public:
7  // ...
8
9  CollisionComponent* AddCollisionComponent() { 
10    // Allow multiple for now, but 
11    // GetCollisionComponent below only gets the
12    // first one.
13    ComponentPtr& NewComponent{
14      Components.emplace_back(
15        std::make_unique<CollisionComponent>(this)
16      )
17    };
18    NewComponent->Initialize();
19    return static_cast<CollisionComponent*>(
20      NewComponent.get()
21    );
22  } 
23
24  CollisionComponent* GetCollisionComponent() const {
25    // Returns the *first* collision component found
26    for (const ComponentPtr& C : Components) {
27      if (auto Ptr{
28        dynamic_cast<CollisionComponent*>(C.get())
29      }) {
30        return Ptr;
31      }
32    }
33    return nullptr;
34  }
35
36  // ...
37};

Now, let's implement IsCollidingWith() in CollisionComponent.cpp. This function will determine if this component's Bounds overlaps with another CollisionComponent's Bounds.

We rely on SDL3's SDL_HasRectIntersectionFloat() function to perform the overlap check.

Sometimes, just knowing if a collision occurred isn't enough. For collision response, we often need to know the exact region where the two objects overlap. We can create a variation of IsCollidingWith() that calculates this intersection rectangle.

This function will take a pointer to an SDL_FRect as an output parameter (OutIntersection).

1// ...
2
3class CollisionComponent : public Component {
4 public:
5  // ...
6
7  // Check collision and get intersection rectangle
8  bool GetCollisionRectangle( 
9    const CollisionComponent& Other, 
10    SDL_FRect* OutIntersection 
11  ) const; 
12
13  // ...
14};

If a collision occurs, the function will populate this rectangle with the overlapping area and return true. If there's no collision, it will return false. We use SDL_GetRectIntersectionFloat() for this.

1// ...
2
3bool CollisionComponent::GetCollisionRectangle(
4  const CollisionComponent& Other,
5  SDL_FRect* OutIntersection
6) const {
7  if (!OutIntersection) {
8    std::cerr << "Error: OutIntersection pointer "
9      "is null in GetCollisionRectangle.\n";
10    return false;
11  }
12
13  return SDL_GetRectIntersectionFloat(
14    &Bounds, &Other.Bounds, OutIntersection
15  );
16}
17
18// ...

The IsCollidingWith() method checks if two specific components collide. To check all potential collisions in the scene, we need to iterate through pairs of entities in Scene::Tick().

This is often done after all entities have finished their individual Tick() updates (including physics and collision bound updates).

Let's add debug drawing to visualize the Bounds.

We'll use the DrawRectOutline() helper from Utilities.h which we created earlier in the chapter.

Let's set up two entities in Scene.h with collision components and make one fall onto the other:

1// ...
2
3class Scene {
4 public:
5  Scene() {
6    std::string BasePath{SDL_GetBasePath()};
7
8    // --- Falling Entity ---
9    EntityPtr& Player{Entities.emplace_back(
10      std::make_unique<Entity>(*this)
11    )};
12
13    Player->AddTransformComponent()
14      ->SetPosition({
15        2.f * PIXELS_PER_METER,
16        1.f * PIXELS_PER_METER,
17      });
18    Player->AddPhysicsComponent()
19      ->SetMass(50.0);
20    Player->AddImageComponent(BasePath + "player.png");
21    Player
22      ->AddCollisionComponent()
23      // Match rough image size
24      ->SetSize(
25        1.9f * PIXELS_PER_METER,
26        1.7f * PIXELS_PER_METER
27      );
28
29    // --- Static Entity ---
30    EntityPtr& Floor{Entities.emplace_back(
31      std::make_unique<Entity>(*this)
32    )};
33
34    Floor->AddTransformComponent()
35      ->SetPosition({
36        1.f * PIXELS_PER_METER,
37        4.f * PIXELS_PER_METER,
38      });
39    // Add an image - optional - we can see where the
40    // the object is based on the collision component
41    // drawn by DrawDebugHelpers()
42    Floor->AddImageComponent(BasePath + "floor.png");
43    Floor
44      ->AddCollisionComponent()
45      ->SetSize(
46        5.0f * PIXELS_PER_METER,
47        2.0f * PIXELS_PER_METER
48      );
49
50    // Note the floor has no physics component
51    // so will not be affected by gravity
52  }
53
54  // ...
55};

Now, when you run the game, the "Player" entity will fall due to gravity (from its PhysicsComponent). As it falls, its CollisionComponent's Bounds will update. The Scene::CheckCollisions() loop will compare the player's bounds with the floor's bounds on every tick.

Once they overlap, you'll see "Collision detected..." messages printed to the console, and the yellow debug rectangles will visually confirm the overlap.

1Collision detected between Entity 0 and Entity 1!
2Collision detected between Entity 0 and Entity 1!
3Collision detected between Entity 0 and Entity 1!
4// ...

The player still passes through the floor because we haven't implemented any collision response yet. That's the topic for the next lesson!

Here are the complete CollisionComponent.h/.cpp files and the updated Scene.h/.cpp and Entity.h files incorporating the changes from this lesson.

In this lesson, we created a CollisionComponent that defines the physical shape of our entities for interaction. This component calculates its bounding box (Bounds) each frame based on its owner's TransformComponent and its own offset and size properties.

We implemented a basic IsCollidingWith method using SDL's intersection functions and integrated a scene-level check to detect overlaps between entities. Debug drawing helps visualize these collision bounds.

Key takeaways:

• CollisionComponent defines shape (Offset, Width, Height) relative to the TransformComponent origin.
• Bounds (SDL_FRect) is calculated each frame in Tick(), incorporating owner position and scale.
• The component relies on TransformComponent, checked during Initialize().
• Collision detection (IsCollidingWith) compares Bounds of two components.
• Scene-level collision checks iterate through entity pairs, currently requiring $O(n^2)$ checks.
• Debug drawing of Bounds is crucial for verifying collision shapes and detection.

Our entities can now detect collisions, but they don't yet react to them. Implementing collision response (stopping, bouncing, taking damage, etc.) will be the focus of the next lesson.