[es] - [tutorial] Kreiranje novih komponenti u Delphi-u

Srki_82
Srdjan Tot
Me @ My Home
Ljubljana

Član broj: 28226
Poruke: 1403
82.208.201.*

ICQ: 246436949

+10 Profil

[tutorial] Kreiranje novih komponenti u Delphi-u

^{31.12.2004. u 01:49 - pre 247 meseci}

Verovatno se vise puta desilo da ste pozeleli da imate neku kontrolu koja je vrlo slicna standardnoj, ali sa jos po nekim dodatnim property-em ili event-om, nekom novom mogucnoscu, itd... Delphi dozvoljava kreiranje novih komponenti (sto svi vec do sad znamo, zar ne :P) i ubacivanje istih u Component Palette. Kreiranje novih komponenti nije previse tesko u Dlephi-u. Uglavnom se sve svodi na nalsedjivanje i dodavanje novih mogucnosti postojecim klasama. Bla, bla, bla... da napravimo neku novu komponentu pa ce sve biti malo jasnije... mozda :P

Prvo sto treba da uradimo je da (osim da se rodimo, imamo kucu, racunar, struju, kablove, Delphi... itd) kliknemo na meni Component i izaberemo New component. To nam otvara Component wizzard koji izgleda ovako:

Tu biramo od koje komponente ce nasa da nasledi osobine (property, event, method), kako ce nasa nova klasa da se zove, paletu u kojoj ce se nova klasa pojaviti, ime fajla u kojem ce se klasa snimiti i search path koji treba da je popunje sam od sebe.

Prvu komponentu koju bi hteo da napravim je digitalni sat (to mi je prva custom komponenta koju sam napravio :P). Pocecemo tako sto cemo izabrati TCustomLabel [StdCtrls] za klasu od koje cemo sve naslediti. Ona ce nam sluziti za prikaz naseg sata. Imacemo sve property-e kao i obican TLabel osim Caption jer ce se on izracunavati na osnovu vremena. Nasu klasu cemo nazvati TESDigitalClock. Imena komponenti ne smeju da butu ista tako da je uvek dobra praksa da se pre imena komponete dodaju par slova (u nasem slucaju ES) po kojima ce se razlikovati od ostalih komponenti koje mogu biti instalirane. Komponentu cemo dodati u ES komponente paletu. Ja sam kreirao folder Controls u Projects folderu Delphi-ja i tu cu snimati source kodove, ali vi mozete izabrati bilo koji drugi folder. Delphi ce sam dati (putanju ce postaviti na neku koju on misli da je zgodna) ime fajla u koji ce se komponenta snimiti i nazvace ga ESDigitalClock.pas. Nama (ili bar meni) to sasvim odgovara pa cemo to tako ostaviti. Jedino sto mozete je da promenite putanju ako vam ne odgovara. To izgleda ovako:

Sada cemo da instaliramo nasu komponentu (jos nismo poceli da je pravimo, ali cemo je ubaciti u Component Palette). Kliknite na install i otvorice vam se nov prozor u kojem ce vas Delphi pitati u koji paket hocete da stavite novu komponentu. Sve komponete koje se instaliraju u Delphi-u moraju da budu u nekom paketu. Posto nemamo nikakav paket kreiracemo nov. Kliknite na jezicak Into new package i upisite putanju paketa koji zelite da kreirate. Kod mene trenutno stoji C:\Program Files\Borland\Delphi7\Projects\Controls\ESControls.dpk. U Description upisite nesto kao ES Component Creation Tutorial i kliknite Ok. Delphi ce vas pitati da kompajlirate paket i instalirace nasu kontrolicu koja jos uvek ne radi nista posebno. Kada pogledate u Component Palette videcete na kraju novi jezicak ES komponente i tu je nasa kontrola. Ako je stavite na formu videcete da nemate bas nesto mnogo property-a i event-a, ali cemo to sve srediti.

Sada idem malo da spavam... treba sutra slaviti novu godinu :)
Imate dobar help sa Delphi-em. Zove se Creating Custom Components. Procitajte to ako nikad niste pokusavali da pravite nove komponente.
Uskoro dodajemo sve sto nam treba da nas digitalni sat proradi :)

_{[Ovu poruku je menjao Srki_82 dana 04.01.2005. u 23:32 GMT+1]}

Play Store

Odgovor na temu

-zombie-
Tomica Jovanovic
freelance programmer
ni.ac.yu

Član broj: 4128
Poruke: 3448
*.83.beocity.net.

Sajt: localhost

+5 Profil

Re: Kreiranje novih komponenti u Delphi-u

^{31.12.2004. u 12:51 - pre 247 meseci}

odličan početak! samo nastavi.. ;)

btw, mali dodatak na ovaj uvod koji si zaboravio da pomeneš. ako pravite komponente koje su u suštini "nadogradnja" neke standardne delphi VCL komponente, nasledite klasu sa sličnim imenom kao ta komponenta, samo sa dodatkom Custom.

dakle, ako želite da napravite "nešto kao tButton", potražite tCustomButton. ako želite nešto "slično kao tMemo, samo malo različitio", nasledite tCustomMemo, etc..

tCustomKomponenta klasa obično ima svu funkcionalnost klase tKomponenta, osim što je većina propertija i eventa protected umesto public, pa nije obavezno da ih sve publikujete ako već nemaju smisla za vašu komponentu..

blogče :: unescaped beta^{^» ^{go-paste extenzija} ^» ^{reč dana: backup} ^» ^{bočne koalicije}}

Odgovor na temu

Srki_82
Srdjan Tot
Me @ My Home
Ljubljana

Član broj: 28226
Poruke: 1403
82.208.201.*

ICQ: 246436949

+10 Profil

Re: Kreiranje novih komponenti u Delphi-u

^{31.12.2004. u 13:22 - pre 247 meseci}

Wow... kakave je razlika kad pisem u dva poslepodne i u dva ujutro :)
Gde smo ono stali. Ovako... kada kreiramo komponentu treba da znamo u napred sta ona sve treba da radi. Nas digitalni sat kao sto smo vec rekli treba samo da ispisuje trenutno vreme. Znaci potpuno isto kao kad bi na formu postavili jedan label i jedan timer i za OnTimer napisemo

Code:
procedure TForm1.Timer1Timer(Sender: TObject);
begin
Label1.Caption := TimeToStr(Time);
end;

I to je to. Nasa komponenta ce to da radi sama od sebe. Vrlo nam je bitno da korisnik ne moze da menja Caption, zar ne? Zbog toga nasa klasa nasledjuje klasu TCustomLabel. Sve klase u Delphi-u koje pocinj sa TCustom...(Label, List, ComboBox...) su iste kao i klase bez Custom samo sto sakrivaju vecinu property-a. Tako i TCustomLabel sakriva svasta i izmedju ostalog i property Caption. Da napomenem-kada neka klasa nasledjuje drugu ne moze da sakrije published property-e (one koje se vide u Object Inspector-u) i cato nam je bitno da klasa koju nalsedjujemo nema published Caption. Ala sam se raspricao ni oko cega :) Da krenemo dalje. Dakle nasa komponenta treba da prikaze sve property-e kao i TLabel osim Caption-a i to cemo sad da uradimo

Code:
type
  TESDigitalClock = class(TCustomLabel)
  private
    { Private declarations }
  protected
    { Protected declarations }
  public
    { Public declarations }
  published
    { Published declarations }
    property Align;
    property Alignment;
    property Anchors;
    property AutoSize;
    property BiDiMode;
    property Color nodefault;
    property Constraints;
    property DragCursor;
    property DragKind;
    property DragMode;
    property Enabled;
    property FocusControl;
    property Font;
    property ParentBiDiMode;
    property ParentColor;
    property ParentFont;
    property ParentShowHint;
    property PopupMenu;
    property ShowAccelChar;
    property ShowHint;
    property Transparent;
    property Layout;
    property Visible;
    property WordWrap;
    property OnClick;
    property OnContextPopup;
    property OnDblClick;
    property OnDragDrop;
    property OnDragOver;
    property OnEndDock;
    property OnEndDrag;
    property OnMouseDown;
    property OnMouseMove;
    property OnMouseUp;
    property OnMouseEnter;
    property OnMouseLeave;
    property OnStartDock;
    property OnStartDrag;
  end;

Kada hocemo da promenimo vidljivost (private, protected, public, published) nekog property-a dovoljno je samo da napisemo property ImeProperty i to postavimo u odgovarajuci blok. Tako smo mi sad stavili sve ove property-e u published blok i sada kad kompajliramo nasu kontrolu i postavimo je na formu ponasace se potpuno isto kao TLabel, ali bez Caption-a.
Sada nam ostaje da jos nateramo komponentu da ispisuje vreme :) Videli smo kako to mozemo da uradimo sa obicnim TLabel-om i TTimer-om. I ovde cemo uraditi nesto slicno. Dodacemo novu promenljivu u nasoj klasi tipa TTimer (morate ubaciti u uses i ExtCtrls).

Code:
  TESDigitalClock = class(TCustomLabel)
  private
    { Private declarations }
    FTimer: TTimer;
  protected
    { Protected declarations }
  public
    { Public declarations }
    constructor Create(AOwner: TComponent); override;
    destructor Destroy; override;
  published
    { Published declarations }
    .
    .
    .
  end;

Primecujete da smo dodali i konstuktor i destruktor. To nam je potrebno da prilikom kreiranja nase kontrole mozemo da kreiramo i FTimer, a prilikom brisanja nase kontrole iz memorije da izbrisemo i FTimer (ovaj korak u ovom slucaju nije potreban, ali nece smetati ako i njega uradimo).

Code:
constructor TESDigitalClock.Create(AOwner: TComponent);
begin
  inherited Create(AOwner);
  FTimer := TTimer.Create(Self);
end;

destructor TESDigitalClock.Destroy;
begin
  FTimer.Free;
  inherited;
end;

Ko nije radio sa klasama i nasledjivanjem, inherited poziva funkciju iz klase od koje smo nasledili funkcije i sve ostalu (u nasem slucaju TCustomLabel). Kada se menjaju virtualne funkcije uglavnom uvek treba pozvati i inherited ImeFunkcije.
Tako... sada nam treba jos samo jedan korak... da podesimo sta ce FTimer da radi na OnTimer event. Dodacemo jos samo jednu proceduricu i nasa klasa ce raditi.

Code:
  TESDigitalClock = class(TCustomLabel)
  private
    { Private declarations }
    FTimer: TTimer;
    procedure UpdateCaption(Sender: TObject);
  protected
    { Protected declarations }
  public
    { Public declarations }
    constructor Create(AOwner: TComponent); override;
    destructor Destroy; override;
  published
    .
    .
    .
  end;

procedure TESDigitalClock.UpdateCaption(Sender: TObject);
begin
  Caption := TimeToStr(Time);
end;

constructor TESDigitalClock.Create(AOwner: TComponent);
begin
  inherited Create(AOwner);
  UpdateCaption(Self)
  FTimer := TTimer.Create(Self);
  FTimer.OnTimer := UpdateCaption;
end;

Sada jos samo ostaje da kompajliramo komponentu i da je ubacimo na formu. Prikazivace se vreme i u design time i u run time.
Sledeci put cemo dodati nove property-e (za kontrolu da li da se vreme updatuje, koliko cesto da se updatuje, za uzimanje trenutnog vremena u String i TDateTime formatu, OnUpdate event tako da znamo kada je Caption promenjen i naravno jednu lepu slicicu za Component Palette).

Imate i gotov kod ako vas mrzi da kuckate.
Srecna vam nova godina. Lepo se provedite :)

P.S.
Hvala -zombie- :)
Uvek zaboravim da spomenem nesto... hvala sto si me podsetio :)

_{[Ovu poruku je menjao Srki_82 dana 04.01.2005. u 23:34 GMT+1]}

Play Store

Prikačeni fajlovi

Controls.zip - 2.12k

Odgovor na temu

Srki_82
Srdjan Tot
Me @ My Home
Ljubljana

Član broj: 28226
Poruke: 1403
82.208.201.*

ICQ: 246436949

+10 Profil

Re: [tutorial] Kreiranje novih komponenti u Delphi-u

^{01.01.2005. u 15:52 - pre 246 meseci}

Dobro jutro :)
Nadam se da ste se svi lepo proveli na doceku... idemo veceras na reprizu :)
Gde smo stali prosli put... danas cemo da dodamo nova svojstva nasoj komponenti. Nazvacemo ih EnableUpdate (da li da se vreme automatski update-uje), UpdateInterval (koliko cesto u milisekundama da se vreme update-uje ako je EnableUpdate = True), TimeStr (readonly svojstvo-vraca vreme koje je ispisano u string formatu) i Time (readonly svojstvo-vraca vreme koje je ispisano u TTime formatu).

Code:
  TESDigitalClock = class(TCustomLabel)
  private
    { Private declarations }
    function GetEnableUpdate: Boolean;
    procedure SetEnableUpdate(const Value: Boolean);
    function GetTime: TTime;
    function GetTimeStr: String;
    function GetUpdateInterval: Cardinal;
    procedure SetUpdateInterval(const Value: Cardinal);
    .
    .
    .
  protected
    { Protected declarations }
  public
    { Public declarations }
    property TimeStr: String read GetTimeStr;
    property Time: TTime read GetTime;
    .
    .
    .
  published
    { Published declarations }
    property EnableUpdate: Boolean
      read GetEnableUpdate write SetEnableUpdate default True;
    property UpdateInterval: Cardinal
      read GetUpdateInterval write SetUpdateInterval default 1000;
    .
    .
    .
  end;

EnableUpdate i UpdateInterval smo stavili da budu published jer je potrebno da mozemo da ih menjamo u design time-u, a TimeStr i Time su public svojstva, nece biti vidljive u Object Inspector-u, ali cemo moci da im pristupimo u run time-u. TimeStr i Time imaju samo read funkciju i zbog toga su readonly. Kada bi pokusali da upisemo nesto u njih to bi proizvelo gresku u programu.
Sad da napisemo i funkcije koje nam dozvoljavaju da vidimo i menjamo ova svojstva.

Code:
function TESDigitalClock.GetEnableUpdate: Boolean;
begin
  Result := FTimer.Enabled;
end;

procedure TESDigitalClock.SetEnableUpdate(const Value: Boolean);
begin
  FTimer.Enabled := Value;
end;

function TESDigitalClock.GetUpdateInterval: Cardinal;
begin
  Result := FTimer.Interval;
end;

procedure TESDigitalClock.SetUpdateInterval(const Value: Cardinal);
begin
  FTimer.Interval := Value;
end;

function TESDigitalClock.GetTime: TTime;
begin
  Result := StrToTime(Caption);
end;

function TESDigitalClock.GetTimeStr: String;
begin
  Result := Caption;
end;

Nista komplikovano, zar ne :) Ovde vidimo kako mozemo uz pomoc property-a da vidimo i menjamo svojstva komponenti koje su u sastavu nase komponete (u ovom slucaju FTimer.Enable i FTimer.Interval).
Posto korisnik nase komponente ima mogucnost da bira da li ce se vreme automatski update-ovati ili ne bilo bi lepo dodati jos jednu proceduru koja bi mogla da "natera" komponentu da se update-uje. Tu proceduru cemo nazvati UpdateTime. Posto vec imamo jednu proceduru koja update-uje vreme (UpdateCaption) samo cemo pozvati nju

Code:
TESDigitalClock.UpdateTime;
begin
UpdateCaption(Self);
end;

Posto ova procedura treba da bude dostupna korisniku stavicemo je u public blok i to je to :)
Sledeci put dodajemo jedan event (OnUpdate) i slicicu za nasu kontrolu.

_{[Ovu poruku je menjao Srki_82 dana 04.01.2005. u 23:35 GMT+1]}

Play Store

Prikačeni fajlovi

Controls.zip - 2.35k

Odgovor na temu

Srki_82
Srdjan Tot
Me @ My Home
Ljubljana

Član broj: 28226
Poruke: 1403
82.208.201.*

ICQ: 246436949

+10 Profil

Re: [tutorial] Kreiranje novih komponenti u Delphi-u

^{02.01.2005. u 15:45 - pre 246 meseci}

Dobro jutro :)
Ovaj post ce biti prilicno kratak... dodacemo OnUpdate event i slicicu za nasu kontrolu. Property koji je tipa procedure(...) of object ili function(...) of object se u Object Inspector-u prikazuje kao event. U nasoj klasi to je ustvari pokazivac na neku proceduru koja ce se izvrsiti u odredjenom trenutku. Za nas OnUpdate event cemo iskoristiti tip TNotifyEvent. One je deklarisan ovako:

Code:
TNotifyEvent = procedure(Sender: TObject) of object;

Verovatno se do sad milion puta naletali na ovakav tip event-a. On daje samo jednu promenjivu... komponenta koja je izazvala taj event. Pa... hajde da dodamo event nasoj klasi

Code:
TESDigitalClock = class(TCustomLabel)
  private
    { Private declarations }
    FOnUpdate: TNotifyEvent;
    .
    .
    .
  protected
    { Protected declarations }
  public
    { Public declarations }
    .
    .
    .
  published
    { Published declarations }
    property OnUpdate: TNotifyEvent read FOnUpdate write FOnUpdate;
    .
    .
    .
  end;

To je to :) Sada korisnik moze da postavi svoju proceduru za nas event. Ostalo nam je jos da odredimo kad ce se on pozivati. Pozivacemo ga kad god budemo menjali Caption... znaci u UpdateCaption proceduri.

Code:
procedure TESDigitalClock.UpdateCaption(Sender: TObject);
begin
  Caption := TimeToStr(SysUtils.Time);
  If (Assigned(FOnUpdate)) and
     (Not (csDesigning in ComponentState)) then
  FOnUpdate(Self);
end;

Prvo promenimo Caption zatim proverimo da li je dodeljena neka funkcija nasem event-u i da li korisnik mozda jos uvek edituje kontrolu u design time-u. Ako imamo proceduru i program radi u run time-u pozivamo tu proceduricu i prosledjujemo joj pokazivac nase kontrole (Self). Nas event sada radi bas kako treba :)
I za kraj smo ostavili slicicu. Uobicajeno je da je slika dimenzija 24x24 gde su poslednji red i kolona transparentna boja (Delphi uzima boju donjeg levog ugla kao transparentnu boju). Necu vam objasnjavati kako se crtaju slicice jer taj deo ne znam (nisam neki umetnik), ali cu vam objasniti kako mozete iskoristiti Image Editor koji ide sa Delphi-em da kreirate odgovarajuci fajl. Pokrenete Image Editor i izaberete File->New...->Component Resource File. Otvorice se mali prozorcic u kojem ce pisati Contents. Kliknite desnim tasterom misa na njega i izaberite New->Bitmap. Dimenzije postavite na 24x24 i mozete ostaviti 16 boja (ne treba nam vise). Uvek pre nego sto pocnem da crtkam nesto izaberem boju koju znam da necu koristiti u slici i postavim je za pozadinu i posle crtam preko nje. Kada zavrsite sa crtanjem novu slicicu nazovite kao i vasu kontrolu (u nasem slucaju TESDIGITALCLOCK). Snimite taj fajl (ja sam mu dao ime ESControls.dcr) i dodajte taj fajl nasoj kontroli

Code:
{$R ESControls.dcr}

Kada budete kompajlirali kontrolu u Component Palette pojavice se nasa slicica :)

Konacno smo zavrsili jednu vrlo laku kontrolu za pravljenje i koriscenje. Mogli smo dodati jos neke stvarice... da recimo moze da se bira format (12h-24h) u kojem se prikazuje vreme, da dodamo alarm i OnAlarm event i ko zna sta jos. Na format cu se vratiti kasnije jer cemo koristiti enumeration tip podataka za izbor formata i to ce lepo izgledati u Object Inspector-u (combobox sa izborom es24h i es12h), a alarm vec sad mozete da napravite sami. Treba vam jos jedna procedure tipa TNotifyEvent (nazovite je FOnAlarm), jedan property OnAlarm za FOnAlram promenljivu i kada se menja Caption proverite da li je vreme za alarm :) Trebace vam jos po neka promenljiva, ali to ostavljam vama :)

Sledeci put cemo praviti dugmence koje pusta neki zvukic kada se klikne... koristicemo i property editors i component editors.

P.S.
Voleo bih da znam sta mislite o ovom tutorialu?

Play Store

Prikačeni fajlovi

Controls.zip - 2.75k

Odgovor na temu

Srki_82
Srdjan Tot
Me @ My Home
Ljubljana

Član broj: 28226
Poruke: 1403
82.208.201.*

ICQ: 246436949

+10 Profil

Re: [tutorial] Kreiranje novih komponenti u Delphi-u

^{04.01.2005. u 23:01 - pre 246 meseci}

Evo mene ponovo. Izvinite sto ste cekali, ali posao, prijatelji, devojka, ovo-ono... sve trazi vremena. Sada cemo napraviti jednu jaaaaako laku klasu ako ste ukapirali sve ono do sad. Za sad cu samo to napisati i malo objasniti jednu jedinu proceduru koja se pojavljuje u klasi. Znaci... pravimo dugmence koje odsvira neki zvuk (wav) kada se na njega klikne. Kod izgleda ovako

Code:
TSoundButton = class(TButton)
private
  { Private declarations }
  FSound: String;
protected
  { Protected declarations }
public
  { Public declarations }
  procedure Click; override;
published
  { Published declarations }
  property Sound: String read FSound write FSound;
end;

procedure TSoundButton.Click;
begin
  inherited;
  PlaySound(PChar(FSound), 0, SND_ASYNC or SND_FILENAME);
end;

To je to :) Treba napomenuti da u uses blok treba ubaciti MMSystem unit zbog funkcije PlaySound. Necu je objasnjavati jer nema neke velike veze sa kreiranjem kontrola.
Ovog puta smo izmenuli proceduru Click. Uvek na pocetku pozivamo inherited kako bi se procedure TButton.Click pozvala pa onda radimo ono sto zelimo tj. pustamo zvukic.

Dodali smo i jedno svojstvo (Sound) koje u sebi drzi putanju do fajla koji treba dugmence da odsvira kada kliknemo na njega. Sada to sve radi... ako u Sound property upisemo putanju do nekog postojeceg wav fajla sve ce raditi kako treba. Kucanje cele putanje nije bas lako... ne znamo uvek gde nam se nalazi koji fajl, mozda pogresimo neko slovo prilikom kucanja, itd... zato bi bilo lepo da mozemo nekako lakse da zadamo ime fajla... nesto kao OpenDialog pa da lepo izaberemo... mozda cak i da cujemo pre nego sto izaberemo da budemo sigurni da je to bas ono sto nam treba. E, pa, to je sve moguce uraditi :) Setite se samo kako izabirate sliku za TImage kontrolu... zgodno, zar ne?
Sledeci put cemo da uradimo tako nesto i za nasu kontrolu. Moci cemo da izaberemo fajl, da ga slusamo i ako nam odgovara da ga izaberemo... naravno, ko vise voli da kucka sam putanju, neka je i dalje kucka :)

Play Store

Prikačeni fajlovi

Controls.zip - 3.21k

Odgovor na temu

Srki_82
Srdjan Tot
Me @ My Home
Ljubljana

Član broj: 28226
Poruke: 1403
82.208.201.*

ICQ: 246436949

+10 Profil

Re: [tutorial] Kreiranje novih komponenti u Delphi-u

^{06.01.2005. u 21:26 - pre 246 meseci}

Posle krace pauze, evo me ponovo :)
Danas dodajemo editor za svojstvo nase komponente. Pre nego sto pocnemo samo da napomenem nesto. Ove komponente koje smo do sad napravili se nalaze u paketu ESControls i taj paket je i design-time paket i run-time paket. Znaci da se on ucitava i kada editujemo forme i kada se program pokrene. Nas property editor treba samo da se ucita kada editujemo formu (kada se nas program pokrene u njemu vise nema Object Inspectora koji ce poretati property editore i oni vise nisu potrebni) i zato pakete u kojima se nalaze editori obelezavamo kao design-time only. Do Delphi 5 je bilo moguce editore postaviti u bilo koje paketa, a od Delphi 6 ih je moguce postaviti samo u design-time only. Dobro... da ne davim mnogo sa tim. Prva stvar je da kreiramo nov paket i da podesimo da bude design-time only. Kliknite na File->New->Other...->Package. Otvorice nam se nov paket i sada kliknite na Project->Options... Obelezite Designtime only i u opis napisite nesto kao ES Component Design Time Package. Sada treba da uradimo jos nesto pre nego sto pocnemo da radimo na editoru. Videli ste da su prethodne dve kontrole u svojim unit-ima imale proceduru Register. Ta procedura je odgovorna za postavljanje nasih kontrola u Component Palette. Posto necemo da korisnik moze da postavi samo nase koponente bez ucitavanja i editora izbrisacemo proceduru Register i u ESDigitalClock.pas i u ESSoundButton.pas. Kada smo to obavili vracamo se ponovo na nas novo otvoreni paket. Trebalo bi da vidite mali folder Contains koji je za sad prazan i Requires koji sadrzi rtl.dcp. Kliknite desnim na Requires i izaberite Add. Dodajte fajl ESControls.dcp koji bi trebalo da se nalazi u folderu C:\Program Files\Borland\Delphi7\Projects\Bpl\. Zatim ponovite desni klik na Requires pa opet Add i ovog puta dodajte DesignIDE.dcp koji bi trebalo da se nalazi u folderu C:\Program Files\Borland\Delphi7\Lib\. E, tako... sada smo lepo podesili sve sto nam je potrebno i mozemo snimiti nas paket kao ESDTimePak.dpk ili tako nesto.

Sada cemo poceti sa pravljenjem editora. Sada jedino sto treba da vidimo u Delphi-u je IDE i nas paket. Kliknite na File->New->Unit. Snimite nov unit kao ESDesignTime.pas ili tako nesto :) Ovaj unit se automatski pojavljuje u Contains folderu naseg paketa. Sada cemo dodati kod

Code:
unit ESDesignTime;

interface

uses
  DesignIntf, DesignEditors;

type
  TESSoundProperty = class(TStringProperty)
  private
    { Private declarations }
  protected
    { Protected declarations }
  public
    { Public declarations }
    function GetAttributes: TPropertyAttributes; override;
    procedure Edit; override;
  published
    { Published declarations }
  end;

procedure Register;

implementation

uses
  ESDigitalClock, ESSoundButton, Classes, Forms, ESSoundForm,
  Controls;

procedure Register;
begin
  RegisterComponents('ES komponente', [TESDigitalClock, TESSoundButton]);
  RegisterPropertyEditor(TypeInfo(String), TESSoundButton, 'Sound', TESSoundProperty);
end;

{ TESSoundProperty }

procedure TESSoundProperty.Edit;
var
  SoundForm: TESSndForm;
begin
  SoundForm := TESSndForm.Create(Application);
  try
    SoundForm.Filename := GetValue;
    if SoundForm.ShowModal = mrOK then
      SetValue(SoundForm.Filename);
  finally
    SoundForm.Free;
  end;
end;

function TESSoundProperty.GetAttributes: TPropertyAttributes;
begin
  Result := [paDialog, paMultiSelect];
end;

end.

Ovo je konacna verzija ovog fajla... hmmmm... idemo od pocetka sa objasnjenjem.
Napravili smo novu klasu koja se zove TESSoundProperty. U Delphi-u postoji neko nepisano pravilo da se property editori zavrsavaju sa Property pa smo i mi tako nazvali nas editor. Posto je property Sound ustvari string nas editor ce naslediti editor za stringove tj. TStringProperty. Nas editor je jedan vrlo jednostavan editor i za sad cu samo da objasnim funkcije koje cemo menjati, a to su GetAttributes i Edit.

GetAttributes govori Object Inspector-u sta nas editor ume da radi... da li otvara nov dialog, da li sadrzi listu predefinisanih vrednosti, da li sadrzi podproperty-e...
Edit je procedura koja se poziva kada korisnik klikne na '...' prilikom unosenja vrednosti u property u Object Inspector-u. Sa Delphi-em dolazi jedan lep help fajl koji sve ovo i jos vise objasnjava. Zove se Creating Custom Components i koga trenutno interesuje vise o ovim funkcijama moze tu da pogleda.
Ovako... u GetAttributes vracamo vrednost [paDialog, paMultiSelect]. paDialog znaci da editor moze da pokaze dialog i da Object Inspector postavi '...' na kraju property-a. paMultiSelect znaci da ako obelezimo dva ili vise TESSoundButton-a izmedju ostalih property-a koja ce ostati vidljiva, ostace i Sound.

procedura Edit jednostavno poziva formu koju sam napravio (forma je sasvim jednostavna pa je necu objasnjavati... objasnicu samo kako se dodaje forma u paket). Ovde su bitne dve funkcije: GetValue i SetValue. Te dve funkcije uzimaju i vracaju vrednost Object Inspector-u za property. Posto smo nasledili nas editor od TStringProperty GetValue i SetValue rade sa stringovima.

Forma se sasvim lako dodaje... isto kao i unit. Kliknete na File->New->Form i forma je tu :)

Ostala nam je jos samo Register procedura. Ona je skoro ista kao i u proslim slucajevima osim sto postoji jos jedan red koji registruje nas editor za Sound property TESSoundButton klase.

Kada budete kompajlirali pakete dobicete instalirane komponente TESDigitalClock (ista kao i pre) i TESSoundButton (sa editorom za Sound property).

Play Store

Prikačeni fajlovi

Controls.zip - 6.34k

Odgovor na temu

Srki_82
Srdjan Tot
Me @ My Home
Ljubljana

Član broj: 28226
Poruke: 1403
82.208.201.*

ICQ: 246436949

+10 Profil

Re: [tutorial] Kreiranje novih komponenti u Delphi-u

^{08.01.2005. u 17:04 - pre 246 meseci}

Sledece sto cemo dodati na nase kontrole je stavka u popup meni-u (kada se klikne desnim na nasu kontrolu) i sta se desava kada kliknemo dva puta na nju.
Dodacemo jos jedan published property About u obe nase klase

Code:
property About: String read GetAbout write SetAbout stored False;

function ImeKontrole.GetAbout: String;
begin
Result := '1.0';
end;

procedure ImeKontrole.SetAbout(const Value: String);
begin
{}
end;

Postavio sam praznu proceduru za SetAbout jer ako je ne stavim property About nece da se pojavi u Object Inspactor-u!?

Dodacemo sledecu klasu u ESDesignTime.pas i malo modifikovati Register proceduru.

Code:
TESAboutEditor = class(TComponentEditor)
  private
    { Private declarations }
  protected
    { Protected declarations }
  public
    { Public declarations }
  function GetVerbCount: Integer; override;
  function GetVerb(Index: Integer): String; override;
  procedure ExecuteVerb(Index: Integer); override;
  procedure Edit; override;
  published
    { Published declarations }
end;

procedure Register;
begin
  RegisterComponents('ES komponente', [TESDigitalClock, TESSoundButton]);
  RegisterPropertyEditor(TypeInfo(String), TESSoundButton, 'Sound', TESSoundProperty);
  RegisterPropertyEditor(TypeInfo(String), TESSoundButton, 'ESAbout', TESAboutProperty);
  RegisterPropertyEditor(TypeInfo(String), TESDigitalClock, 'ESAbout', TESAboutProperty);
  RegisterComponentEditor(TESSoundButton, TESAboutEditor);
  RegisterComponentEditor(TESDigitalClock, TESAboutEditor);
end;

{ TESAboutProperty }

procedure TESAboutProperty.Edit;
var
  AboutForm: TESAbtForm;
begin
  AboutForm := TESAbtForm.Create(Application);
  try
    AboutForm.ShowModal;
  finally
    AboutForm.Free;
  end;
end;

function TESAboutProperty.GetAttributes: TPropertyAttributes;
begin
  Result := [paDialog, paMultiSelect, paReadOnly];
end;

{ TESAboutEditor }

procedure TESAboutEditor.Edit;
var
  AboutForm: TESAbtForm;
begin
  AboutForm := TESAbtForm.Create(Application);
  try
    AboutForm.ShowModal;
  finally
    AboutForm.Free;
  end;
end;

procedure TESAboutEditor.ExecuteVerb(Index: Integer);
var
  AboutForm: TESAbtForm;
begin
  AboutForm := TESAbtForm.Create(Application);
  try
    AboutForm.ShowModal;
  finally
    AboutForm.Free;
  end;
end;

function TESAboutEditor.GetVerb(Index: Integer): String;
begin
  Result := '&About'
end;

function TESAboutEditor.GetVerbCount: Integer;
begin
  Result := 1;
end;

To bi bilo to.
Kada pravimo component editor nasledjujemo ga od klase TComponentEditor.
Procedura GetVerbCount treba da vrati koliko cemo stavki u meni-u dodati. Unasem slucaju dodajemo samo jednu stavku.
Funkcija GetVerb vraca string za svaku stavku koju dodajemo. Promenljiva Index nam govori poziciju stavke. Posto u nasem slucaju imamo samo jednu stavku Index ce uvek biti 1 i dovoljeno je da samo vratimo ime stavke. Da smo imali vise stavki napisali bi nesto ovako

Code:
function TESAboutEditor.GetVerb(Index: Integer): String;
begin
  Case Index of
    1: Result := '&About'
    2: Result := '&Do something'
    3: Result := 'Do &something else'
  end;
end;

Procedura ExecuteVerb se poziva kada korisnik klikne na neku od nasih stavki u meniu. Index nam i ovde govori na koju je stavku korisnik kliknuo. Ovde mozemo prikazati neku formu (kao sto radimo u nasem primeru) i menjati neke od property-a ako je to potrebno. TComponentEditor ima property Component koje nam daje komponentu sa kojom radimo i slobodno mozemo menjati property-e (Component.Tag := 50 ce postaviti Tag na 50). Bitno je samo da se posle promene property-a pozove i Designer.Modified.
Ostala nam je samo jos procedura Edit. Ona se poziva kada se na komponentu klikne dva puta. U njoj moze da se radi sva sto moze i u ExecuteVerb.

I to je to... ustvari, dodao sam i jos jedan property editor za About property-e. Nista novo, zar ne :) Jedina razlika od proslog property editora je sto sam u GetAttribute funkciji dodao i paReadOnly sto oznacava da se property ne moze menjati u Object Inspactor-u.

Toliko za sad. Sledeci put cemo napraviti neku non-visual komponentu... ne znam tacno sta, ali cu smisliti (verovatno neki dialog) :) Ako imate neki predlog mozemo i to praviti :)

Play Store

Prikačeni fajlovi

Controls.zip - 16.56k

Odgovor na temu