Main Content

Design a Game by Using Stateflow

This example shows how to implement the game of Tetris by using a Stateflow® chart. This model is a redesigned version of the classic Stateflow demo sf_tetris. The new design incorporates these programming paradigms:

  • Parallel decomposition to separate pre- and post-processing tasks from the main game control logic.

  • State hierarchy and subcharts to provide semantic abstractions that simplify the design of the chart.

  • Change detection operators to query for input from the keyboard.

Separate Subcomponents by Using Parallel Decomposition

The chart TetrisLogic implements the logic behind the game. The chart consists of three parallel states, which execute in this order:

  • WaitingArea performs preprocessing tasks such as randomly generating the next tetronimo (a shape consisting of four squares). During simulation, the smaller square on the right of the game UI displays this tetronimo.

  • MainArea implements the main control logic for the game. To represent the playing arena, this state uses a 21-by-12 array arena. At each simulation step, the chart updates the array based on the state of the game and the input from the player.

  • Draw performs post-processing tasks such as calling the MATLAB® script sf_tetris_gui. This script displays the arena as an image and captures keystrokes from the player.

Simplify Chart Design by Using Hierarchy and Subcharts

By using state hierarchy and subcharts, you can graphically abstract the game logic, present a high-level overview of the flow of the game, and hide the inner complexity of each stage of the game. For example, each substate of the parallel state MainArea represents a separate stage in the flow of the game.

  • The game starts by generating a new tetronimo (substate NewShape).

  • The tetronimo moves down or sideways, depending on the input from the player (substate Moving).

  • When the tetronimo touches the bottom of the arena or an earlier tetronimo below it, the tetronimo stops moving (substate Stopped).

  • If the tetronimo stops at too high a point on the arena, the game ends (substate GameOver). Otherwise, the chart freezes the tetronimo (substate FreezeShape), adjusts the score (substate Score), advances to the next level if necessary (substate NextLevel), and proceeds to the next tetronimo (substate NewShape).

Capture Keyboard Input Through Change Detection

The Moving subchart moves the tetronimo based on the input from the player. By default, the substate MoveSlowly is active. The tetronimo moves slowly down the playing arena while the parallel substates in MoveSlowly monitor the input from the keyboard. If the player presses the space bar, the substate MoveFast becomes active. The tetronimo drops quickly to the bottom of the arena.

To gather input from the keyboard, the subchart uses the change detection operator hasChanged. Every time that the player presses a key, sf_tetris_gui increments an input to the chart, which makes the corresponding hasChanged operator return a value of true. Because MoveSlowly has a parallel decomposition, the chart can process multiple keystrokes each time step.

Key Mappings

To interact with the game UI, use these keys:

  • Move left: Left arrow or J

  • Move right: Right arrow or L

  • Rotate clockwise: Up arrow or I

  • Rotate counterclockwise: Down arrow or K

  • Drop to bottom: Space bar

  • To pause and resume play: P

  • To quit: Q

See Also

Related Topics