Tic Tac Toe, the Rules

Before the game starts, players have to decide who will go first and who will mark his moves with an X. After the first move, game proceeds with the opponents alternately placing their marks at any unoccupied cell. The goal of this game is to be the first one with three marks in a row, where the row can be horizontal, diagonal or vertical. If all cells are occupied and both players don't have a winning combination, the game is a draw.

Back to the "drawing board" ...

Preparing the Tic Tac Toe Game

Saving for the first time
Before we move on, I suggest you to rename that default form, by assigning the string 'frMain' to the Name property (using the Object Inspector). Next, save the project, by pointing to File | Save All (Delphi IDE main menu). The Save As dialog box will be displayed, providing you with the option to first save the form's unit file, the default name will be Unit1.pas. The offered location will be inside the Projects folder under the Delphi install folder. It is advisable to save every project in a separate folder, therefore, use the 'Create New Folder' toolbar button to create a new folder, and name it 'TicTacToe'. Now, change the name of the Unit1.pas to Main.pas and click Save. You will then be prompted to save the project, by default Delphi will name this project 'Project1' (DPR), of course we'll change it to, let's say, 'TicTacToe'. That's it. Later on, when you want to save the current status of your project, just use Ctrl+Shift+S (keyboard shortcut for Save All).

GUI

The playfield. Your goal is to create a "grid" consisting of 9 cells, where each cell will display either nothing, X or O. The simplest is to use the Label component from the Standard palette. Drop one on the form. Note, we'll need 9 labels looking similar. The easiest way to do that is to create first label, name it, choose the appropriate font, color, and set every other property. For this purpose we will name the label 'lblCell0'.
Use the Object Inspector to set the following properties:

object lblCell0: TLabel // note Name = lblCell0
  Left = 8
  Top = 8
  Width = 81
  Height = 81
  Alignment = taCenter
  AutoSize = False
  Caption = 'lblCell0'
  Color = clCream	 
  Font.Size = 16
  Font.Name = 'Tahoma'
  Font.Style = [fsBold]
  Layout = tlCenter
end

Note: If you right click anywhere on your form, and choose 'View As Text' command from the context pop up menu, you are presented with text description of the form’s attributes, inside the Code Editor window. To switch back to 'For View', just right click this "code" window and choose 'View As Form'.

After we shape up the first (cell) label, we can create other eight elements of the grid. Select the label object, and press CTRL+C. Now, select the form (click anywhere on the form) and press CTRL+V to create another label object. The second object will inherit all properties from the first one, only the Name property will be re-set to Label1. Alter it manually to lblCell1, note that you must also manually change the Caption property to lblCell1. We do not really need the Caption property at this moment, but if you delete it (making it an empty string) you will not be able to differentiate one cell from another (without selecting one, of course).

Go on and create all nine labels. Make sure that the Name properties are sequential in the grid, we will build the game logic on the cell position / name. Label object with Name lblCell0 zero should be in the top left corner, and the bottom right label should be lblCell8.
When you are finished your form should be looking something like:

Next, we add some more objects to the form: