Browser docs

Component

April 14, 2023 4 min read Behavioral
On this page

Intent

The component design pattern enables developers to decouple attributes of an objects. Essentially allowing a single component to be inheritable by multiple domains/objects without linking the objects to each other. In addition to this benefit, the component design pattern allows developer to write maintainable and comprehensible code which is less likely to result in monolithic classes.

Intent

Explanation

Real world example

Suppose your video game consists of a graphics component and a sound component. Including the methods and attributes of both of these features in a single java class can be problematic due to many reasons. Firstly, the graphics and sound code can create an extremely long java class which can be hard to maintain. Furthermore, graphics components may be written and implemented by a separate team as to the sound contents. If both parties work simultaneously on the same java class, this may cause conflicts and major delay. Using the component design pattern, the development team is able to create individual component classes for graphics and sound whilst providing the domain/object the reach to both of these attributes.

In plain words

The component design pattern provides a single attribute to be accessible by numerous objects without requiring the existence of a relationship between the objects themselves.

Key drawback

With the implementation of the component design pattern, it can be very difficult to create a relationship between components. For example, suppose we require the sound component to be aware of the current animation in order create a certain sound based upon the animation; this can be quite tricky as the component design pattern makes components ‘unaware’ of other components’ existence due to its decoupling nature.

Programmatic Example

The App class creates a demonstration of the use of the component pattern by creating two different objects which inherit a small collection of individual components that are modifiable.

 1public final class App {
 2    /**
 3     * Program entry point.
 4     *
 5     * @param args args command line args.
 6     */
 7    public static void main(String[] args) {
 8        final var player = GameObject.createPlayer();
 9        final var npc = GameObject.createNpc();
10
11
12        LOGGER.info("Player Update:");
13        player.update(KeyEvent.KEY_LOCATION_LEFT);
14        LOGGER.info("NPC Update:");
15        npc.demoUpdate();
16    }
17}

Much of the program exists within the GameObject class, within this class, the player and NPC object create methods are set up. Additionally, this class also consists of the method calls used to update/alter information of the object’s components.

 1public class GameObject {
 2  private final InputComponent inputComponent;
 3  private final PhysicComponent physicComponent;
 4  private final GraphicComponent graphicComponent;
 5
 6  public String name;
 7  public int velocity = 0;
 8  public int coordinate = 0;
 9
10  public static GameObject createPlayer() {
11    return new GameObject(new PlayerInputComponent(),
12        new ObjectPhysicComponent(),
13        new ObjectGraphicComponent(),
14        "player");
15  }
16
17  public static GameObject createNpc() {
18    return new GameObject(
19        new DemoInputComponent(),
20        new ObjectPhysicComponent(),
21        new ObjectGraphicComponent(),
22        "npc");
23  }
24
25  public void demoUpdate() {
26    inputComponent.update(this);
27    physicComponent.update(this);
28    graphicComponent.update(this);
29  }
30
31  public void update(int e) {
32    inputComponent.update(this, e);
33    physicComponent.update(this);
34    graphicComponent.update(this);
35  }
36
37  public void updateVelocity(int acceleration) {
38    this.velocity += acceleration;
39  }
40  
41  public void updateCoordinate() {
42    this.coordinate += this.velocity;
43  }
44}

Upon opening the component package, the collection of components are revealed. These components provide the interface for objects to inherit these domains. The PlayerInputComponent class shown below updates the object’s velocity characteristic based on user’s key event input.

 1public class PlayerInputComponent implements InputComponent {
 2    private static final int walkAcceleration = 1;
 3
 4    /**
 5     * The update method to change the velocity based on the input key event.
 6     *
 7     * @param gameObject the gameObject instance
 8     * @param e          key event instance
 9     */
10    @Override
11    public void update(GameObject gameObject, int e) {
12        switch (e) {
13            case KeyEvent.KEY_LOCATION_LEFT -> {
14                gameObject.updateVelocity(-WALK_ACCELERATION);
15                LOGGER.info(gameObject.getName() + " has moved left.");
16            }
17            case KeyEvent.KEY_LOCATION_RIGHT -> {
18                gameObject.updateVelocity(WALK_ACCELERATION);
19                LOGGER.info(gameObject.getName() + " has moved right.");
20            }
21            default -> {
22                LOGGER.info(gameObject.getName() + "'s velocity is unchanged due to the invalid input");
23                gameObject.updateVelocity(0);
24            } // incorrect input
25        }
26    }
27}

Class diagram

UML

Applicability

Use the component design pattern when

  • you have a class which access multiple features which you would like to keep separate.
  • you want to reduce the length of a class.
  • you require a variety of objects to share a collection of components but the use of inheritance isn’t specific enough.

Credits