Áttérés egy vizuális/grafikus program- fejlesztői környezetre (minimális tudnivalók)

Áttérés Áttérés egy vizuális/grafikus egy vizuális/grafikus

program- fejlesztői program- fejlesztői környezetrekörnyezetre

(minimális tudnivalók)(minimális tudnivalók)

Szlávi PéterELTE Informatika Szakmódszertani Csoport

[email protected]://izzo.inf.elte.hu/~szlavi

http://izzo.inf.elte.hu/~szlavi

2005.09.14. Áttérés egy 4GL programfejlesztői környezetre

2

TartalomTartalom1 A 4GL lényege

1.1 Egy mondatban…1.2 A A grafikus kezelőfelület elemei és „szervei”1.3 A működés „filozófiája”

2 Ablakkellékek és események3 Grafikus környezet és OOP4 Az „újszerű” programozási stílusról5 Programfelépítés6 GUI7 Praktika

7.1 A kezdő lépések7.2 A legfontosabb grafikus eszközök osztályai a palettákon7.3 Pozitív és negatív praktikák


3

1 A 4GL lényege1 A 4GL lényege?4GL?

1.1 Egy mondatban…Grafikus (operációs rendszer) környezeten keresztüli programfejlesztés.


4

1 A 4GL lényege1 A 4GL lényege1.2 A grafikus kezelőfelület elemei és „szervei”

AlapelemekBeavatkozó szervekElvárások


5

1 A 4GL lényege1 A 4GL lényege1.3 A működés „filozófiája”1. a „főprogram” feladata: ablak

felépítése, kirajzolása (minden ablakkellékkel), és ese-ményfigyelés, továbbá valamilyen esemény esetén a megfelelő eseménykezelő aktivi-zálása.

2. az eseménykezelő elvégzi az eseménykor végrehajtandó feladatokat.


6

2 Ablakkellékek és 2 Ablakkellékek és eseményekesemények

Egy „szerényen dekorált” ablak

címkesor; bezáró gomb, minima-lizáló gomb, teljes képernyőre kinyitó gomb; gördítő sávok; keret a méretezéshez.


7

2 Ablakkellékek és 2 Ablakkellékek és eseményekesemények

Egy „kellékekben gazdag” ablak

Füllel kiválasztható oldalak; konstans szövegek; lenyíló listák; választó- és egyéb gombok; kép.

A beállítás sorrendje a felhaszná-lóra van bízva.


8

3 Grafikus környezet és 3 Grafikus környezet és OOPOOP

? OOP ?

A grafikus „kellékek”grafikus „kellékek” (ablakok, ikonok, gombok, menük stb.) objektumokobjektumok. Ui.: oRendelkeznek számos jellemzővel. oTartoznak hozzájuk események által

kiváltott, fela-datfüggetlen és -függő tevékenységek.


9

4 Az „újszerű” 4 Az „újszerű” programozási stílusról programozási stílusról

Mennyiben más ez?1. megmeg kell terveznitervezni az alkalmazás

kommunikációskommunikációs felületétfelületét (ablakok, ablakösszetevők), azaz a GUI-t (osztály + „objektum-topológia”: mi, hol, mekkora, milyen … legyen);

2. a kezeléssel összefüggő (várt) eseményeketeseményeket (mi, mikor aktivizálódjon), és

3. kiviteleznikivitelezni a megfelelő eseménykezelőkeseménykezelők működésétműködését (mi, hogyan működjön).


10

5 Programfelépítés 5 Programfelépítés A szükséges (leíró) fájlok: • Maga a főprogramfőprogram (forrás és kód).• Az egyes ablakkellékek osztályosztályát

(leírását és eseménykezelőit) tartalmazó programegységek: unitok (forrás és kód).

• További, a hagyományos programozás is megkívánta, legfőképpen típusoktípusokat (pl. listát, sort stb.) megvalósító programegységek: unitok (forrás és kód).


11

5 Programfelépítés 5 Programfelépítés Továbbiak: • AblakleíróAblakleíró (minden egyeshez, külön-

külön): mik és milyen jellemzőkkel vannak az adott ablakon.

• MenüleíróMenüleíró (minden egyes ablakra került menü-höz): milyen a menüstruktúra, mely eljárások tartoznak az egyes menüpontokhoz.


12

5 Programfelépítés 5 Programfelépítés 1. példa: •projekt_0.exe:

az alkalmazás maga•projekt_0.lpi:

a projekt xml leírása•unit1.lfm, ~.lrs:

az osztály leírása(LazarusForm/-Resource)

•unit1.pas:az osztály Pascal leírása

•projekt_0.lpraz alkalmazás pascal főprogramja


13

5 Programfelépítés 5 Programfelépítés unit1.lfm:object Form1: TForm1

Caption = '0. programom' ClientHeight = 300 ClientWidth = 400 PixelsPerInch = 96 Position = poDesktopCenter HorzScrollBar.Page = 399 VertScrollBar.Page = 299 Left = 290 Height = 300 Top = 149 Width = 400end


14

5 Programfelépítés 5 Programfelépítés unit1.lrs:

object Form1: TForm1 Caption = '0. programom' ClientHeight = 300 ClientWidth = 400 PixelsPerInch = 96 Position = poDesktopCenter HorzScrollBar.Page = 399 VertScrollBar.Page = 299 Left = 290 Height = 300 Top = 149 Width = 400end

{ This is an automatically generated lazarus resource file }LazarusResources.Add('TForm1','FORMDATA',[ 'TPF0'#6'TForm1'#5'Form1'#7'Caption' +#6#12'0. programom'#12'ClientHeight' +#3','#1#11'ClientWidth'#3#144#1#13 +'PixelsPerInch'#2'`'#8'Position' +#7#15'poDesktop' +'Center'#18'HorzScrollBar.Page' +#3#143#1#18'VertScrollBar.Page' +#3'+'#1#4'Left'#3'"'#1#6'Height' +#3','#1#3'Top'#3#149#0#5'Width' +#3#144#1#0#0]);


15

5 Programfelépítés 5 Programfelépítés projekt_0.lpr:

{$mode objfpc}{$H+}uses Interfaces, // this includes the LCL widgetset Forms { add your units here }, Unit1;begin Application.Initialize; Application.CreateForm(TForm1, Form1); Application.Run;end.


16

5 Programfelépítés 5 Programfelépítés unit1.pas:unit Unit1; {$mode objfpc}{$H+}interfaceuses Classes, SysUtils, LResources, Forms, Controls, Graphics, Dialogs;type { TForm1 } TForm1 = class(TForm) private { private declarations } public { public declarations } end; »»»»»»

»»»»»»var Form1: TForm1; implementation{ TForm1 }initialization {$I unit1.lrs}end.


17

5 Programfelépítés 5 Programfelépítés 2. példa:

az előbbi minimálisan bővítve


18

5 Programfelépítés 5 Programfelépítés unit1.lfm: object Form1: TForm1

Caption = '0. programom' … Width = 400 objectobject Vege: TButton Vege: TButton BorderSpacing.OnChange = nilBorderSpacing.OnChange = nil Caption = 'Vége'Caption = 'Vége' OnClick = VegeClickOnClick = VegeClick TabOrder = 0TabOrder = 0 Left = 295Left = 295 Height = 34Height = 34 Hint = 'Kilépés'Hint = 'Kilépés' Top = 243Top = 243 Width = 73Width = 73 endendend


19

5 Programfelépítés 5 Programfelépítés unit1.pas:unit Unit1; {$mode objfpc}{$H+}interfaceuses Classes, SysUtils, LResources, Forms, Controls, Graphics, Dialogs, ButtonsButtons;type { TForm1 } TForm1 = class(TForm) Vege: TButton;Vege: TButton; procedureprocedure VegeClick(Sender: VegeClick(Sender: TObject); TObject); private { private declarations } public { public declarations } end; »»»»»»

»»»»»»var Form1: TForm1; implementation{ TForm1 }procedure TForm1.VegeClick( Sender: TObject);begin ShowMessage('Sikeresen kilépett.'); closeend;initialization {$I unit1.lrs}end.


20

5 Programfelépítés 5 Programfelépítés 3. példa: „tisztességesebb”, klasszikus alkalmazás, amely menütmenüt és két „memómemó”-t tartalmaz, de semmi „feladatfüggőt” elvégzőt nem; a menüpontok is éppen csak jelzik az elvégzendő részfeladatot:

• beolvasás, • feldolgozás, • kiírás:


21

5 Programfelépítés 5 Programfelépítés Néhány screenshot a futásáról:


22

5 Programfelépítés 5 Programfelépítés


23

5 Programfelépítés 5 Programfelépítés unit1.lfm:object EgyszeruEsTipikus: TEgyszeruEsTipikus Caption = 'EgyszeruEsTipikus' ClientHeight = 280 ClientWidth = 400 Menu = MainMenu1 … object LabelBe: TLabel BorderSpacing.OnChange = nil Caption = 'Paraméterek:' Color = clNone Left = 21 Height = 17 Top = 30 Width = 67 end …

object MemoBe: TMemo BorderSpacing.OnChange = nil Lines.Strings = ( 'Ide kerülnek a beolvasott ' 'paraméterek.' '1 paraméter = 1 sor.' ) ReadOnly = True ScrollBars = ssAutoBoth TabOrder = 0 Left = 21 Height = 206 Hint = 'Paraméterértékek' Top = 54 Width = 165 End

… object MainMenu1: TMainMenu object MenuItem1: TMenuItem Caption = '&Vezérlés' object MenuItem4: TMenuItem Caption = 'Paraméter&beolvasás' ShortCut = 16450 OnClick = MenuItem4Click end … end


24

5 Programfelépítés 5 Programfelépítés unit1.pas:unit Unit1; {$mode objfpc}{$H+}interfaceuses … MenusMenus, StdCtrlsStdCtrls;type { TEgyszeruEsTipikus } TEgyszeruEsTipikus = class(TForm) LabelBe: TLabel;LabelBe: TLabel; MemoBe: TMemo;MemoBe: TMemo; LabelKi: TLabel;LabelKi: TLabel; MemoKi: TMemo;MemoKi: TMemo; MainMenu1: TMainMenu;MainMenu1: TMainMenu; MenuItem1: TMenuItem; MenuItem1: TMenuItem; (* (* Vezérlés -- Főmenü Vezérlés -- Főmenü *) *) MenuItem4: TMenuItem; MenuItem4: TMenuItem; (* (* Paraméterbeolvasás Paraméterbeolvasás *)*) …

procedureprocedure MenuItem4Click( MenuItem4Click( Sender: TObject); Sender: TObject); … private { private declarations } public { public declarations } end; var EgyszeruEsTipikus: TEgyszeruEsTipikus;

implementation{ TEgyszeruEsTipikus }procedureprocedure TEgyszeruEsTipikus.Menu TEgyszeruEsTipikus.Menu Item4Click(Sender: TObject); Item4Click(Sender: TObject); (*(* Paraméterbeolvasás Paraméterbeolvasás *)*)beginbegin (*(*itt olvassuk be a paramétereketitt olvassuk be a paramétereket*)*) MenuItem2.Enabled:=True; MenuItem2.Enabled:=True; (* (*a Feldolgozás most már a Feldolgozás most már kiválasztható kiválasztható*)*) MenuItem6.Enabled:=False; MenuItem6.Enabled:=False; (* (*Paraméterbeovasás után az Ered-Paraméterbeovasás után az Ered- ménykiírás nem választható ki ménykiírás nem választható ki*)*) ShowMessage('A paramétereket ShowMessage('A paramétereket beolvastuk.'); beolvastuk.');endend;;…initialization {$I unit1.lrs}end.


25

6 GUI 6 GUI A GUI „munka

közben”:•Menü- és eszköz-

sor•Object inspector•Source editor•Messages•Form


26

7 Praktika7 Praktika7.1 A kezdő lépések 1.A Lazarus elindítása 2.New + Application 3.Az eszközpalettáról kiválasztjuk a kívánt

(grafikus) eszközöket, 4.beállítjuk kezdő állapotukat,5.kiválasztjuk a kívánatos eseményeket, s

elkészítjük az eseménykezelő eljárás kódját,6.kimentjük (azaz Save As a megfelelő

alkönyvtárba)7.lefordítjuk, futtatjuk (Run + Run = F9)


27

7 Praktika7 Praktika7.2 A legfontosabb grafikus

eszközök osztá-lyai a palettákon

Standard komponens-paletta:

TMain, TButton, TLabel, TEdit, TMemo, TCheckBox, TCheckGroup, TListbox, TRedioButton, TRadioGroup


28

7 Praktika7 PraktikaAdditional komponens-paletta:

TStringGrid – szövegek mátrixos elrendezésben

Common Control komponens-paletta:

TPageControl – fülekkel lapozható „füzet”


29

7 Praktika7 Praktika7.3 Pozitív és negatív praktikák … Lazarus „nem-szeretemségei, szerencsét-

lenségei” és egyéb tanácsok …Saját névkonvenció (pl. lbBe: TLabel,

mmBe:TMemo)Ha lehet, ne nyomkövessünk!

Utólag ne változtassunk a kontrolok nevén!Fordítás (nyomkövetés) közben nem tanácsos a formot mozgatni (minimalizálni)!

Áttérés egy vizuális/grafikus program- fejlesztői környezetre (minimális tudnivalók)

Documents