14.05.2010.

RAČUNARSKA GRAFIKA
1 Vežba 9

KREIRANJE APLIKACIJE
¢ Kreiraćemo aplikaciju Puzle
¢ To je poznata ručna igrica

¢ Problem je jednostavan:
— imamo tablu sa 16 polja (4 x 4) gde je jedno polje
izvađeno a ostala imaju na sebi ispisanu vrednost od
1 do 15
— postojećih 15 polja je smeštenu u nasumičan položaj
— cilj igre je da pomeranjem polja na prazno mesto
poređamo polja po redu (od 1 do 15)

1
 14.05.2010.

KREIRANJE APLIKACIJE
¢ Kreiraćemo novu VCL Forms aplikaciju

KREIRANJE NOVE APLIKACIJE

¢ Iz menija odaberemo File ® Save Project As
¢ U prozoru koji se otvori odaberemo lokaciju
(najbolje je kreirati poseban folder za svaku
aplikaciju npr. Vezba 9)
¢ Prvo biramo ime za .pas fajl (upisemo Forma) a
nakon toga ime za projekat (Puzle)

2
 14.05.2010.

KREIRANJE NOVE APLIKACIJE

¢ Promenićemo ime našoj formi u frmForma1
¢ Da bi to uradili kliknemo na našu formu, a zatim
u Object Inspector-u promenimo osobinu Name u
frmForma1
¢ Promenićemo i osobinu Caption u "Puzle"

¢ Osobinu Height ćemo postaviti na 330 a osobinu

Width na 275

KREIRANJE NOVE APLIKACIJE

¢ Na formu ćemo dodati dva dugmeta btnRandomize i
btnExit
¢ Dugmetu btnRandomize postavljamo sledeće osobine
— Caption - Randomize
— Width - 125
— Height - 25
— Top - 255
— Left - 4
¢ Dugmetu btnExit postavljamo sledeće osobine
— Caption - Exit
— Width - 125
— Height - 25
— Top - 255
— Left - 135 6

3
 14.05.2010.

KREIRANJE NOVE APLIKACIJE

KREIRANJE NOVE APLIKACIJE

¢ Na Formu ćemo dodati 15 panela
¢ Imena ćemo im ostaviti podrazumevana (Panel1
do Panel15)
¢ Caption na svakom panelu će biti broj od 1 do 15
pri čemu ćemo na panelu kojem je ime Panel1
Caption postaviti na 1 ...
¢ Sledeće osobine postavljamo za sve panele
— Height - 55
— Width - 60
— Color - clMaroon
— Font → Height - 50
8
— Font → Color - clWindow

4
 14.05.2010.

KREIRANJE NOVE APLIKACIJE

KREIRANJE I OBRADA DOGAĐAJA

¢ Dodaćemo događaj OnClick na dugme btnExit

procedure TfrmForma1.btnExitClick(Sender: TObject);

begin
Application.Terminate;
end;

10

5
 14.05.2010.

POKRETANJE APLIKACIJE
¢ Ako pokrenemo aplikaciju možemo je zatvoriti
pritiskom na dugme Exit

11

KREIRANJE APLIKACIJE
¢ Kreiraćemo promenljive koje su nam potrebne za
rad aplikacije

var
frmForma1: TfrmForma1;
blank: TPoint;
points: array [1..15] of TPoint;

implementation

12
{$R *.dfm}

6
 14.05.2010.

KREIRANJE APLIKACIJE
¢ Kreiraćemo događaj OnCreate koji ćemo vezati za
našu formu
¢ U ovom događaju ćemo postaviti početne tačke
našim panelima

13

KREIRANJE APLIKACIJE
procedure TfrmForma1.FormCreate(Sender: TObject);
var
i: integer;
begin
blank := Point(4, 4);
for I := 1 to 15 do begin
points[i] := Point((I mod 4) + 0, (I div 4) + 1);
if points[i].x = 0 then begin
points[i].x := 4;
end;
if i mod 4 = 0 then begin
points[i].Y := points[i].Y - 1;
end;
end;
for I := 1 to 15 do begin
RenderCell(i); 14
end;
end;

7
 14.05.2010.

KREIRANJE APLIKACIJE
¢ Ispod date obrade događaja ćemo dodati još jednu
proceduru

procedure RenderCell(id: integer);

begin
TPanel(frmForma1.FindComponent('Panel' +
inttostr(id))).Top := (61 * (points[id].y - 1)) + 3;
TPanel(frmForma1.FindComponent('Panel' +
inttostr(id))).Left := (66 * (points[id].x - 1)) + 4;
end;
15

KREIRANJE APLIKACIJE
¢ Kreiraćemo događaj klika na dugme Randomize
¢ Pomoću ovog dugmeta ćemo da rasporedimo
panele na slučajan način na formi

16

8
 14.05.2010.

KREIRANJE APLIKACIJE
unit Forma;

interface

uses
Windows, Messages, SysUtils, Variants, Classes,
Graphics, Controls, Forms, Dialogs, ExtCtrls,
StdCtrls, Math;

17

KREIRANJE APLIKACIJE
procedure TfrmForma1.btnRandomizeClick(Sender: TObject);
var
i, j, x: integer;
buffer: array[1..15] of TPoint;
bufpoint: TPoint;
begin
for x := 0 to 35 do begin
Randomize;
for I := 1 to 15 do begin
buffer[i] := points[i];
end;
j := randomrange(2, 16);
for I := j downto 1 do begin
points[i] := buffer[i + 1];
end;
points[j] := buffer[1];
end;
for I := 1 to 15 do begin
RenderCell(i); 18
end;
end;

9
 14.05.2010.

KREIRANJE APLIKACIJE
¢ Nakon ovoga ćemo dodati događaj klika na
panele
¢ Selektovaćemo sve panele i u kartici Events
odabrati događaj OnClick
¢ U njega unosimo ime Pomeranje nakon čega nas
razvojno okruženje smešta u deo za kucanje koda

19

KREIRANJE APLIKACIJE
procedure TfrmForma1.Pomeranje(Sender: TObject);
var
id: integer;
p, p2: TPoint;
begin
id := StrToInt((Sender as TPanel).Caption);
p := blank;
p2 := point(0,0);
if (p.x = points[id].x - 1) and (p.y = points[id].y) then begin
p2 := points[id];
points[id] := p;
p := p2;
end else if (p.x = points[id].x + 1) and (p.y = points[id].y) then begin
p2 := points[id];
points[id] := p;
p := p2;
end else if (p.y = points[id].y - 1) and (p.x = points[id].x) then begin
p2 := points[id];
points[id] := p;
p := p2;
end else if (p.y = points[id].y + 1) and (p.x = points[id].x) then begin
p2 := points[id];
points[id] := p;
p := p2;
end; 20
blank := p;
RenderCell(id);
end;

10
 14.05.2010.

POKRETANJE APLIKACIJE

21

RAČUNJANJE VREMENA
¢ Dodaćemo kod koji će nam računati vreme
proteklo od pokretanja igrice do njenog rešenja
¢ Dodaćemo nove promenljive koje su nam
potrebne u našoj aplikaciji

var
frmForma1: TfrmForma1;
blank: TPoint;
points: array [1..15] of TPoint;
time: int64;
22
done, go: boolean;

11
 14.05.2010.

RAČUNJANJE VREMENA
¢ Nakon ovoga ćemo promeniti procedure koje smo
do sada kreirali
¢ Prvo ćemo promeniti proceduru za obradu
događaja kreiranja same forme
¢ U njoj ćemo postaviti inicijalne vrednosti novih
promenljivih

23

RAČUNJANJE VREMENA
procedure TfrmForma1.FormCreate(Sender: TObject);
var
i: integer;
begin
time := 0;
done := true;
go := false;
blank := Point(4, 4);
for I := 1 to 15 do begin
points[i] := Point((I mod 4) + 0, (I div 4) + 1);
if points[i].x = 0 then begin
points[i].x := 4;
end;
if i mod 4 = 0 then begin
points[i].Y := points[i].Y - 1;
end;
end;
for I := 1 to 15 do begin
RenderCell(i); 24
end;
end;

12
 14.05.2010.

RAČUNJANJE VREMENA
¢ Nakon ovoga menjamo obradu događaja klika na
dugme Randomize
¢ Klikom na ovo dugme počinje računjanje
vremena

25

RAČUNJANJE VREMENA
procedure TfrmForma1.btnRandomizeClick(Sender: TObject);
var
i, j, x: integer;
buffer: array[1..15] of TPoint;
bufpoint: TPoint;
begin
for x := 0 to 10 do begin
Randomize;
for I := 1 to 15 do begin
buffer[i] := points[i];
end;
j := randomrange(5, 16);
for I := j downto 1 do begin
points[i] := buffer[i + 1];
end;
points[j] := buffer[1];
end;
for I := 1 to 15 do begin
RenderCell(i);
end;
go := true;
26
end;

13
 14.05.2010.

RAČUNJANJE VREMENA
¢ Na obradu događaja klika na panel ćemo dodati
proveru da li je slagalica rešena
¢ Takođe ćemo onemogućiti korisnika da pomera
elemente sve dok ne klikne na dugme Randomize

27

RAČUNJANJE VREMENA
procedure TfrmForma1.Pomeranje(Sender: TObject);
var
id: integer;
p, p2: TPoint;
begin
if go then begin
if done then begin
time := GetTickCount();
end;
done := false;
id := StrToInt((Sender as TPanel).Caption);
p := blank;
p2 := point(0,0);
if (p.x = points[id].x - 1) and (p.y = points[id].y) then begin
...
end;
blank := p;
RenderCell(id);
Check();
end; 28
end;

14
 14.05.2010.

RAČUNJANJE VREMENA
¢ Dodaćemo proceduru Check za proveru da li smo
poređali sve kockice po redu
¢ Procedure koje se pozivaju u nekoj drugoj
proceduri moraju biti iznad date procedure

29

RAČUNJANJE VREMENA
procedure Check();
var
timestr: string;
begin
if (pe(points[1], Point(1 , 1))) and (pe(points[2], Point(2 , 1))) and (pe(points[3], Point(3 , 1)))
and (pe(points[4], Point(4 , 1))) and (pe(points[5], Point(1 , 2))) and (pe(points[6], Point(2 ,
2))) and (pe(points[7], Point(3 , 2))) and (pe(points[8], Point(4 , 2))) and (pe(points[9],
Point(1 , 3))) and (pe(points[10], Point(2 , 3))) and (pe(points[11], Point(3 , 3))) and
(pe(points[12], Point(4 , 3))) and (pe(points[13], Point(1 , 4))) and (pe(points[14], Point(2 ,
4))) and (pe(points[15], Point(3 , 4))) then begin
done := true;
time := GetTickCount - time;
go := false;
if time div 1000 > 60 then begin
timestr := IntToStr(time div 60000) + '.' + IntToStr((time mod 60000) div 6000) + ' Minutes';
end else begin
timestr := IntToStr(time div 1000) + '.' + IntToStr(time mod 1000) + ' Seconds';
end;
Showmessage('You Won!' + #13 + 'Time: ' + timestr);
time := 0;
end; 30
end;

15
 14.05.2010.

RAČUNJANJE VREMENA
function pe(p1, p2: TPoint): boolean;
begin
if (p1.X = p2.x) and (p1.Y = p2.y) then begin
Result := true;
end else begin
Result := false;
end;
end;

31

POKRETANJE APLIKACIJE

32

16