graphic programming

Hi experts,

I want to write a program which can do the following:

a) Display a 8x8 EMPTY chessboard on the screen.

b) Display the chess pieces at the left and the right side of the chess board

c) Write a routine which enables me to move the chess pieces with the mouse to the chess board - drag and drop- ,
so I can setup a new position. If I made a mistake, I want to be able to correct this.

d) After finishing setup the new position should be saved in an ASCII text file.

Can you please give me some hints how I can write such a program? For example: Which components should I use?
What is the principle structure of such a program?

With kind regards

Who is Participating?
lopemConnect With a Mentor Commented:

I wrote a Delphi program to build chess diagrams for word documents using truetype fonts... Want the source code? Please send me a request to

Of course, it is free!

Take care,
Manuel López
- Use TImage, to draw the board, you can drow it at run time, by create TImage instance at run time using two nested for loops, and you can set the background color for that images at run time.

- Use TImageList to store all chess pices, (White pices and Black pices) or you can use two TIMageList to store each color.

- Display that Pices in the board, and use Drag and Drop technique to move the pices.

- Store current pices in two dimension array 8*8

- The most ineresting part of this project is the calculation of right and wrong movements, it will let you make a lot of calculation using two dimension arrays

That is my advice,

mathesAuthor Commented:
Dear Motaz,

thank you for your suggestion. How can I calculate the position where I placed a piece. BTW: The pieces will never be moved, they will be placed only once. I don't want to write a chess program, I only need a tool that enables me to setup and save a position.

With kind regards

Cloud Class® Course: Microsoft Office 2010

This course will introduce you to the interfaces and features of Microsoft Office 2010 Word, Excel, PowerPoint, Outlook, and Access. You will learn about the features that are shared between all products in the Office suite, as well as the new features that are product specific.

You have conceived a not simple thing. It will borrow from the programmer with wide experience about one week. I speak about drawing.

The easy way to do is TDrawGrid. It will draw chessboard, have a good support to drag&drop, and you can draw all what you want in it's cells.
There must be no troubles to save situation in two dimension array (as Motaz suggested). But it will be difficult to draw chess pieces when you drag it. And one more hint. Make you own TChessPiece control, derived from one of TWinControl. It must have a transparent background with image of chess piese on it. And it must be able to allign automatically to TDrawGrid's cell.

Good luck,
yeah, TDrawGrid is more easy.
I did an Apple Chess with it before.
mathesAuthor Commented:
Hi experts,

thank you all for your hints. They were all useful for me.

With kind regards


Dear Christian (Mathes)...

Im sending attached to this message the chess diagram software. Because I'm from México and my remarks are in spanish
most of the time, let me explain how it works a little bit.

First of all, i created a two dimensional array of component Timage... I want to work around a chessboard and this is the
obvious and natural idea. I declared it in the private part of the Tform1 class:

    Tab  : array[1..8,1..8] of TImage;

Now you have in the code a 2D array of Timages... You have to initialize them in your code, because you are going to use
them in real time and not design time. Then, you have to create the Timages in your form. The next procedure does this...

procedure CreaEscaques;

{ Crea las casillas del tablero. Esto lo hace }
{ de manera dinámica, de manera tal que la    }
{ manipulación de cada casilla pueda hacerse  }
{ vía un índice x,y, en lugar de asignar un   }
{ valor a cada Timage definido en el proceso  }
{ de diseño...}

    y     : integer;
    YPos  : integer;

  YPos := 88;
  for y := 1 to 8 do
    XPos := 12;
    for x := 1 to 8 do
    with Form1 do
      Tab[x,y] := Timage.Create(Form1); {Inicializa la imagen}
      Tab[x,y].Parent := Form1;
      Tab[x,y].Top := YPos;
      Tab[x,y].Left := XPos;
      Tab[x,y].Height := 41;
      Tab[x,y].Width := 41;
      Tab[x,y].Tag := y - 1 + 8 * (x - 1);
      XPos := XPos + 40;
      Tab[x,y].OnClick := Form1.PonFigura;
      Tab[x,y].Visible := TRUE;
      if Tablero[x,y]=TRUE then
        Tab[x,y].Picture.LoadFromFile(PathBMP + 'black1.bmp')
        Tab[x,y].Picture.LoadFromFile(PathBMP + 'white1.bmp');
    YPos := YPos + 40;
end; {CreaEscaques}

Now the subtle point. All the visible components have their own coordinate system. For example, if you put two timages in a
form, you have the position (0,0) for the image 1 and the position (0,0) for the image 2. I thinks this is a clever scheme,
because you dont have to keep track of the global position of the mouse which could be a very nightmare any time you move
your form to another place on the screen...

Anyway, because your Timage chessboard has 64 squares and each one has its own coordinate system, you cant use the
global position of the mouse to know in which square you are. Because you want to drag the figures and drop them in the right
squares, you need a way to find out this. The trick is to use the tag property of each timage component. Think of the tag as an
ID number of the component. I then numbered them 11, 12, 13, 14, 15, 16, 17, 18 for the first row, 21, 22,23, 24 25, 26, 27
28, for the second row, etc. This was a good idea because I know Tab[1,1] is Tag 11, Tag[5,6] is Tag 56, etc.

The last trick to find the square in which Im pointing with the mouse is this procedure...

procedure TForm1.PonFigura;

     ColorEscaque : String;
     x11, y11     : integer;

  y11 := ((Sender as TImage).Tag mod 8) + 1;
  x11 := ((Sender as TImage).Tag div 8) + 1;
  ColorEscaque := '';
  if Tablero[x11,y11]=TRUE then ColorEscaque := 'n'
                           else ColorEscaque := 'b';
  if ((Pieza = '') and (ColorEscaque = 'b')) then Figura := 'white1.bmp';
  if ((Pieza = '') and (ColorEscaque = 'n')) then Figura := 'black1.bmp';
  if Pieza <> '' then Figura := Pieza + ColorEscaque + '1.bmp';
  Tab[x11,y11].Picture.LoadFromFile(PathBMP + Figura);
  { Actualiza el tablero simbólico }
  if ((Figura = 'white1.bmp') or (Figura = 'black1.bmp'))
  then TabSymb[y11,x11] := '1'
    if Pieza[2] = 'n' then TabSymb[y11,x11] := Pieza[1];
    if Pieza[2] = 'b' then TabSymb[y11,x11] :=  UpCase(Pieza[1]);
end; {PonFigura}
Who call this procedure?  see the CreaEscaques procedure... You can see a line that says:

Tab[x,y].OnClick := Form1.PonFigura;

So any time you click with the mouse over a chess square, you will know which one it is because you are looking at its Tag

Ok, enough about that. Let me explain something about drag and drop. When I wrote this software I had no idea of how to
do that. I would like to drag a chess figure and drop it to the right square. Instead of this, I changed the approach: I change the
windows cursor when you pick the figure you want to drag to the board (as in chessbase). So you dont have to deal with all
the drag and drop of images. Use the image editor of Delphi to create some resource files. In each file you can have your own
custom cursors...

When you have all this, I put the chessboard (in execution time) in the form. have all the chess figures in a menu so I can pick
any figure and then "drag and drop" it over the square I want. Hope This answer your question. Please, tell me if you have any
further question about this...

I have chess figurine fonts (most of them are free availbale in some many chess sites). If you need them and cant find over the
net, send me a message and I sent them to you.

Best regards,
Manuel López

Ps. I included a custom Installation program. If you get an error during instalation, forget it and just copy all in a subdirectory...

Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.