https://xc-basic.net/ 2026-04-29T15:56:11+00:00 https://xc-basic.net/ https://xc-basic.net/lib/tpl/writr/images/favicon.ico text/html 2021-06-28T21:26:54+00:00 Anonymous (anonymous@undisclosed.example.com) https://xc-basic.net/doku.php?id=tutorial1-tetris:start&rev=1624908414&do=diff Tutorial 1: TETRIS This tutorial will guide you in writing a simple Tetris game in XC=BASIC. The game is relatively easy to implement and I think it is going to be a good start to get you started. Index * Step 1: Setting up the development environment * Step 2: Planning the game * Step 2.1: Designing the screen * Step 2.2: Designing the shapes * Step 2.3: Designing the playfield * Step 2.4: Planning the program flow * Step 3: Coding * text/html 2021-02-02T21:26:47+00:00 Anonymous (anonymous@undisclosed.example.com) https://xc-basic.net/doku.php?id=tutorial1-tetris:step_3.2.2&rev=1612297607&do=diff Step 3.2.2: Testing if a piece overlaps The next one is the overlaps() function that is to check if a piece overlaps the blocks on the playfield. This is a key function as it has to run every time we're about to move or rotate a piece, to check whether a move is legal. text/html 2021-02-02T21:29:52+00:00 Anonymous (anonymous@undisclosed.example.com) https://xc-basic.net/doku.php?id=tutorial1-tetris:step_3.2.3&rev=1612297792&do=diff Step 3.2.3: Drawing or erasing a piece To be able move a piece on the screen, we need a routine that draws it and another one that erases it off of the screen. But since these two operations are very similar, we can code them into a single procedure. I'll explain how. text/html 2021-02-04T09:15:40+00:00 Anonymous (anonymous@undisclosed.example.com) https://xc-basic.net/doku.php?id=tutorial1-tetris:step_3.2.4&rev=1612426540&do=diff Step 3.2.4: Locking a piece When a piece can not move further to the bottom, it is locked, which means it becomes part of the playfield. This routine is very similar to the one where we were checking if the piece overlaps the playfield. We will use the same function to extract individual rows from the shape but this time we use the OR bitwise operator to merge the row of the shape to the row of the playfield. Here is the function: text/html 2021-02-04T09:15:57+00:00 Anonymous (anonymous@undisclosed.example.com) https://xc-basic.net/doku.php?id=tutorial1-tetris:step_3.2.5&rev=1612426557&do=diff Step 3.2.5: Clearing a row When a piece is locked, we need to check if there are full rows to be removed. If there are, we'll call a procedure that removes the row and brings everything down from above. We will call this procedure to each full row. text/html 2021-02-02T21:50:39+00:00 Anonymous (anonymous@undisclosed.example.com) https://xc-basic.net/doku.php?id=tutorial1-tetris:step_3.3.1&rev=1612299039&do=diff Step 3.3.1: The update loop This loop is responsive for a updating the falling piece as long as it doesn't hit the bottom. Its algorithm is very simple: * Draw the piece * Check if there was input from joystick * Check if move is possible * text/html 2021-02-03T10:58:53+00:00 Anonymous (anonymous@undisclosed.example.com) https://xc-basic.net/doku.php?id=tutorial1-tetris:step_3.3.2&rev=1612346333&do=diff Step 3.3.2: Checking how far we've got The previous steps must have been pretty boring as we haven't yet had the chance to actually try the game. As we already coded the loop where the pieces are falling down, why not do a little testing? Click on this link to see the code what we've written so far. Note that I have added some testing code before the loop to initialize some variables with test data. We will remove these lines later: text/html 2021-02-03T11:39:33+00:00 Anonymous (anonymous@undisclosed.example.com) https://xc-basic.net/doku.php?id=tutorial1-tetris:step_3.3.3&rev=1612348773&do=diff Step 3.3.3: The game loop The game loop is the middle loop of our program where the actual gameplay happens. This loop is responsible for the following: * Put the current piece on the top of the playfield, above the ceiling * Get the next piece and display the piece preview text/html 2021-02-03T12:09:48+00:00 Anonymous (anonymous@undisclosed.example.com) https://xc-basic.net/doku.php?id=tutorial1-tetris:step_3.3.4&rev=1612350588&do=diff Step 3.3.4: The program loop We have reached the final step in our game development, the outermost loop! This loop is responsible for starting the game loops endlessly. The algorithm is super simple: * Wait until the player presses fire * Clear the outdated messages on screen text/html 2021-02-02T20:26:13+00:00 Anonymous (anonymous@undisclosed.example.com) https://xc-basic.net/doku.php?id=tutorial1-tetris:step1&rev=1612293973&do=diff Step 1: Setting up the development environment Important note: even if you have already done this, please make sure you have the latest version of XC=BASIC. The code published on the following pages may not work with earlier versions. You'll need the following tools to write a game in XC=BASIC: text/html 2021-02-04T09:13:14+00:00 Anonymous (anonymous@undisclosed.example.com) https://xc-basic.net/doku.php?id=tutorial1-tetris:step2.1&rev=1612426394&do=diff Step 2.1: Designing the screen Let's do the easy part first, that is drawing the screen. Let's enlist what need to be visible on the screen: * A falling piece, that can be of 7 kinds of shapes, called Tetrominoes, each can be rotated 90 degrees. text/html 2021-02-02T22:04:25+00:00 Anonymous (anonymous@undisclosed.example.com) https://xc-basic.net/doku.php?id=tutorial1-tetris:step2.2&rev=1612299865&do=diff Step 2.2: Designing the shapes The following shapes may appear in a standard Tetris game: They are often called I, J, L, O, S, T and Z, respectively. If we take all of them in all rotations, we will get 28 shapes: Now we must decide how we store each shape in memory. We have 28 shapes, four times each of the 7 distinct shapes (we will store the 4 rotations for each shape). We know that they'll be all text/html 2021-02-04T09:13:58+00:00 Anonymous (anonymous@undisclosed.example.com) https://xc-basic.net/doku.php?id=tutorial1-tetris:step2.3&rev=1612426438&do=diff Step 2.3: Designing the playfield The playfield is where the gameplay happens. In the TETRIS world, it is often called the Tetrion. It is a 10×20 block surrounded with a frame. The playfield also has an invisible part above its ceiling the top where the pieces start falling. text/html 2021-02-04T09:14:19+00:00 Anonymous (anonymous@undisclosed.example.com) https://xc-basic.net/doku.php?id=tutorial1-tetris:step2.4&rev=1612426459&do=diff Step 2.4: Planning the program flow This is a step that programmers, including me, often skip, however a well prepared plan can save a lot of headache later. The following flow chart is trying to explain the key parts of the program. The chart on the left side is a high-level plan that roughly describes the flow of the program, that we'll call the text/html 2021-02-03T11:43:03+00:00 Anonymous (anonymous@undisclosed.example.com) https://xc-basic.net/doku.php?id=tutorial1-tetris:step2&rev=1612348983&do=diff Step 2: Planning the Game To keep it simple, let's define some restrictions against the game we're going to develop: * There will be a single screen only. * The game will display unmodified PETSCII characters only. * Shapes will be displayed in different colors. text/html 2021-02-04T09:14:46+00:00 Anonymous (anonymous@undisclosed.example.com) https://xc-basic.net/doku.php?id=tutorial1-tetris:step3.1&rev=1612426486&do=diff Step 3.1: Defining variables Our game will store its state in a couple of variables. Defining variables in XC=BASIC can be a little confusing if you come from CBM BASIC, but don't worry, the differences are easy to understand. The following commands can define a variable: text/html 2021-02-02T21:25:45+00:00 Anonymous (anonymous@undisclosed.example.com) https://xc-basic.net/doku.php?id=tutorial1-tetris:step3.2.1&rev=1612297545&do=diff Step 3.2.1: Finding a shape The function get_shape() serves to find a shape in the array that we defined in step 2.2. It is rather simple but offers a little trick to make our program run faster. To find a shape in the array, we will use the following formula: text/html 2021-02-02T21:11:56+00:00 Anonymous (anonymous@undisclosed.example.com) https://xc-basic.net/doku.php?id=tutorial1-tetris:step3.2&rev=1612296716&do=diff Step 3.2: Writing routines XC=BASIC is a procedural language which means that you can define routines that have their own variable scope and therefore they don't mess up the rest of the program (although they can access global variables as previously seen). These routines can be called by the main program flow, by another routine, or by the routine itself as well. The latter is called recursion. There are two types of routines in XC=BASIC: text/html 2021-02-04T09:16:16+00:00 Anonymous (anonymous@undisclosed.example.com) https://xc-basic.net/doku.php?id=tutorial1-tetris:step3.3&rev=1612426576&do=diff Step 3.3: Coding the loops If you remember the flow chart from Step 2.4, there we designed the program flow in several loops that are nested into one another. * The inner loop, reponsive for moving the current piece in the playfield, let's call it the update loop text/html 2021-02-02T21:05:31+00:00 Anonymous (anonymous@undisclosed.example.com) https://xc-basic.net/doku.php?id=tutorial1-tetris:step3&rev=1612296331&do=diff Step 3: Coding! Finally, let's do the fun part and start the actual coding! We will do it in the following order: * First we'll define all the global variables that we need, * Then we'll write the procedures and functions that will be commonly used,