Skip to content

Building Colliders

hugh5 edited this page Sep 8, 2022 · 3 revisions

The Colliders were changed from rectangles to various shaped polygons to fit with the isometric view.

Entity Collision with buildings

As you can see with the old collider, it contatins a lot of empty space that entities would get caught up on which is big problem. At first the colliders were rotated 60 degrees to fit with the isometric view. This worked for the walls but the other buildings have a more complex structure. It was more accurate to find the points on the texture, convert it to a shape and set it as the new collider. This decision was made because when navigating around the world, you would expect to only get caught up on things you see (since you will not actually be able to see the colliders without the debug mode on) so the colliders need to be exactly representative of the sprite.

The colliders can be seen as the fine green bounding boxes around the buildings.

Old collider New colliders
Screenshot 2022-09-08 235444

Wall coliders

The wall coliders were rotated 60 degrees (isometric view):
This can be seen in BuildingFactory.java:createWall()

Entity wall = new Entity();
// other irrelevant create wall stuff ommited
PolygonShape boundingBox = new PolygonShape();
Vector2 center = wall.getCenterPositon(); // Collider to be set around center of entity
boundingBox.setAsBox(center.x * 0.25f, center.y * 0.25f, center, (float) (60 * Math.PI / 180));
wall.getComponent(ColliderComponent.class).setShape(boundingBox);

Entities also don't get stuck when moving along the walls and the colliders are connected smoothly. (better explained in the video linked below)
Video demo: Collision with wall demonstration.mp4 - Demonstrates how the player collider can now slide up down against the walls without a lot of impedance.

\

TownHall and Barracks Collider

As explained above, a different method was used for more complex buildings.

How pixel coordinates were found from the textures

By using an image paint program, it was easy to pinpoint the exact pixel locations to set the points on the collider. And as you can see the drafted points below directly line up with the colliders seen at the top of this page.

TownHall Barracks
base isometric barracks current

For TownHall: BuildingFactory.java:createTownHall()

final float TH_SCALE = 7f;
Entity townHall = new Entity();
/*
... other irrelevant townhall creation stuff
*/
// Setting Isometric Collider
// Points (in pixels) on the texture to set the collider to
float[] points = new float[] {      // Four vertices
        31f, 607f,      // Vertex 0       3--2
        499f, 835f,     // Vertex 1      /  /
        958f, 515f,     // Vertex 2     /  /
        486f, 289f      // Vertex 3    0--1
};
// Defines a polygon shape on top of a texture region
PolygonRegion region = new PolygonRegion(new TextureRegion(ServiceLocator.getResourceService()
        .getAsset("images/base.png", Texture.class)), points, null);
float[] cords = region.getTextureCoords();

Vector2[] vertices = new Vector2[region.getTextureCoords().length / 2];
for (int i = 0; i < cords.length / 2; i++) {
    vertices[i] = new Vector2(cords[2*i], cords[2*i+1]).scl(TH_SCALE);
}
PolygonShape boundingBox = new PolygonShape();  // Collider shape
boundingBox.set(vertices);
townHall.getComponent(ColliderComponent.class).setShape(boundingBox); // Setting Isometric Collider

For Barracks: BuildingFactory.java:createBarracks()

final float BARRACKS_SCALE = 5f;
Entity barracks = new Entity();
/*
... other irrelevant townhall creation stuff
*/
// Setting Isometric Collider
// Points (in pixels) on the texture to set the collider to
float[] points = new float[]{
        895f, 1649f,    // Vertex 0        3
        1568f, 1312f,   // Vertex 1    4 /   \ 2
        1568f, 1088f,   // Vertex 2     |     |
        893f, 749f,     // Vertex 3    5 \   / 1
        228f, 1078f,    // Vertex 4        0
        228f, 1311f     // Vertex 5
};
// Defines a polygon shape on top of a texture region
PolygonRegion region = new PolygonRegion(new TextureRegion(ServiceLocator.getResourceService()
        .getAsset("images/isometric barracks current.png", Texture.class)), points, null);
float[] cords = region.getTextureCoords();
Vector2[] vertices = new Vector2[region.getTextureCoords().length / 2];
for (int i = 0; i < cords.length / 2; i++) {
    vertices[i] = new Vector2(cords[2*i], cords[2*i+1]).scl(BARRACKS_SCALE);
}
PolygonShape boundingBox = new PolygonShape(); // Collider shape
boundingBox.set(vertices);
barracks.getComponent(ColliderComponent.class).setShape(boundingBox); // Setting Isometric Collider

return barracks;

Mouse Click Collision with buildings

Another problem was when trying to select an entity and a building in close proximity was also selected when it shouldn't have been selected. Also when trying to select a single wall, a lot of walls around it would also be selected at the same time. This was fixed by using these new colliders to test collision instead using a square around the entity This can be seen in the SelectableComponent.java:isIn(xCoordinate, yCoordinate)

Vector2 pointInWorld = screenToWorldPosition(xCoordinate, yCoordinate);
// If entity is a building, test if the clicked point is in building collider
if (entity.getComponent(BuildingActions.class) != null) {
    selected = entity.getComponent(ColliderComponent.class).getFixture().testPoint(pointInWorld);
    return;
}

Table of Contents

Home

Game

Game Home

Design Influences

Gameplay Features

Style

Story

Friendly Units
Map
City
Buildings
Unit Selections

Spell

Game User Testing: Theme of Unit Selection & Spell System

UI User Testing

Tutorial

Resource Stats Display

Loading Screen Bar

Health Bars
In Game menu
  • Feature
  • User Testing:In Game Menu

Landscape Tile Design

Landscape Tile Design Feedback

Weather Design

Weather Design Feedback

Camera Movement

Enemy design

Enemy Units

Enemy AI

How Animation Works

Map Flooding

Game Engine

Getting Started

Entities and Components

Service Locator

Loading Resources

Logging

Unit Testing

Debug Terminal

Input Handling

UI

Animations

Audio

AI

Physics

Game Screens and Areas

Terrain

Concurrency & Threading

Settings

Troubleshooting

MacOS Setup Guide

Clone this wiki locally