Komponen Desktop Studi Kasus: Delphi
Delphi • Pegunungan Delphi di Yunani – Awalnya tempat pemujaan terhadap dewi kesuburan, Gaea – Kemudian menjadi tempat dewa Oracle – Kini, tempat tinggal para dewa, kuil dewa Apolo
Delphi’s name
“If you want to talk to [the] Oracle, go to Delphi”
Borland Delphi • Bahasa pemrograman berbasis GUI • Pertama dikeluarkan oleh Borland – Sekarang dikembangkan oleh CodeGear & Embarcardero
• Versi : 1, 2, 3,4, 5, 7, 8, 2005, 2006, Turbo Delphi, 2010, dan XE • Menggunakan bahasa pemrograman OOP Object Pascal • Awalnya dibuat oleh Andres Hejlsberg • Jenis: Personal, Professional, Enterprise (sebelumnya Client/Server) dan Architect. • Menggunakan component -> Visual Component Library
Kelebihan • IDE-nya lengkap dan terintegrasi • Kompilasi yang dapat menghasilkan kode yang berjalan secara native x86 ataupun managed code pada arsitektur framework .NET. • Pendelegasian (type safe method pointer) yang digunakan untuk memproses event yang dipicu oleh component • Kode pemrogramannya lebih ringan dibanding pengkodean pada C, sebab Delphi menggunakan kode object pascal • Dapat terhubung ke beragam jenis database (MySQL, Paradox, Interbase, SQLite, SQLServer) • Mendukung pengembangan aplikasi modern (Jaringan/Distributed , Internet/WEB, Web Services…) • Tersedia juga untuk sistem yang berbeda (non Microsoft oriented), seperti di Linux – Kylix, Lazarus
Pro Delphi • Komunitas pengguna yang besar pada Internet – Delphi3000, torry.net, delphi-indo
• Dapat mengkompilasi menjadi single executable, memudahkan distribusi dan meminimalisir masalah yang terkait dengan versioning • Banyaknya dukungan dari pihak ketiga terhadap VCL (biasanya tersedia berikut source codenya) ataupun tools pendukung lainnya (dokumentasi, tool debugging) • Optimasi kompiler yang cukup cepat • Memiliki tool editor bantuan: CnPackWizard
Kontra Delphi • Partial single vendor lock-in (Borland menetapkan standar bahasa, kompatibilitas yang harus mengikutinya) • Terbatasnya kamampuan portabilitas antarplatform OS (sebelum ada Kylix dan .NET) • Akses pada platform dan library pihak ketiga membutuhkan file-file header yang diterjemahkan ke dalam bahasa Pascal • Dokumentasi atas platform dan teknik-teknik yang menyertainya sulit ditemukan dalam bahasa Pascal (contoh pada akses COM dan Win32)
Alternatif Delphi • BloodShed Dev Pascal • Free Pascal • Lazarus (http://www.lazarus.freepascal.org/) • GNU Pascal
Filosofi OOP di Delphi GUI - Komponen secara visual, adalah seperti object pada OOP - Property pada komponen, adalah data member (variabel) dari object - Method merupakan member dari object dalam bentuk prosedur - Event-handler merupakan prosedur milik komponen/object yang hanya akan bekerja saat kejadian khusus terjadi atau diberikan ke komponen tersebut
Memahami komponen-komponen Delphi • Delphi memiliki banyak sekali komponen yang digunakan untuk membangun interface aplikasi yang dibuat. • Dari sekian banyak komponen tersebut maka FORM adalah komponen utama/induk, dari aplikasi sebab semua komponen lain umumnya diletakkan di atas FORM • Delphi meletakkan komponen-komponen-nya pada satu tempat yang disebut : Componen Palette • Delphi mengelompokkan komponen-komponen tersebut dalam tab-tab sesuai dengan fungsi dan penggunaannya • Komponen Delphi juga ada yang berperan sebagai input (untuk menerima data) dan ada juga yang berperan sebagai output (untuk menampung dan menampilkan data • Komponen Delphi ada yg visual, ada yg non visual
IDE Delphi Standard
Component Pallete
Object Inspector dan Event
File-file Delphi • Satu aplikasi Delphi setidak-nya akan menghasilkan file-file : *.dpr - project *.pas – source pascal *.dfm – form designer *.cfg - configuration *.dof – option file *.res - resources • Setelah di-compile akan bertambah 2 jenis file lagi yaitu : *.dcu – compiled unit *.exe • Jika aplikasi di-Edit (ada yang diubah) kemudian disimpan lagi, akan bertambah file dengan ekstension : *.~pas – backup pasccal *.~.dfm – backup form designer
FileFile -file aplikasi Delphi 1 Form File :Projet1.res File :Projet1.cfg File :Projet1.dof
File :Projet1.exe
File :Projet1.dpr File : Unit1.dfm
File : Unit1.dcu
Form1
File :Unit1.pas Kode program
COMPILE + LINK Re-EDIT + Save
File : Unit1.~pas File : Unit1.~dfm
FileFile -file aplikasi Delphi MultiForm File :Projet1.res File :Projet1.cfg File :Projet1.dof
File : Unit1.dfm Form1
File :Projet1.dpr File :Projet1.exe
File : Unit2.dfm Form2
File : Unit3.dfm Form3
File : Unit1.pas
File : Unit2.pas
File : Unit3.pas
Kode program
Kode Program
Kode Program
COMPILE + LINK
Re-EDIT + SAVE
File : Unit1.dcu File : Unit2.dcu File : Unit3.dcu
File File File File File File
: : : : : :
Unit1.~pas Unit2.~pas Unit3.~pas Unit1.~dfm Unit2.~dfm Unit3.~dfm
Bagaimana kode program Delphi dijalankan Unit1.pas Unit unit1;
Unit1.dfm
… Interface … Project1.dpr Program project1 … Begin
Implementation {$R *.DFM}
… End.
… … End.
Unit2.pas Unit unit2; … Interface … Implementation {$R *.DFM}
… End.
Unit2.dfm
Class dan Object pada Delphi
Private • Mendefinisikan data yang hanya dapat dipanggil oleh class internal dan untuk class ini sendiri juga Protected • Mendefinisikan data yang hanya dapat dipanggil oleh class internal dan class anakan (subclass) Public • Mendefinisikan data yang dapat dipanggil class internal dan eksternal dan semua object yang menyertakan class ini Published • Mendefinisikan data yang dapat dipanggil class internal dan eksternal • Published properties are included in RTTI, public properties aren't.
Delphi RTTI • Run Time Type Information or the information that the Delphi Compiler needs at Design time to make the object inspector and other parts of the Delphi IDE work correctly at design time (Object Inspector)
Structure of a unit (.pas) unit unitName interface uses { List of units goes here } { Interface section goes here } implementation uses { List of units goes here } { Implementation section goes here }
initialization (optional) { Initialization section goes here } finalization (optional) { Finalization section goes here } end.
unit Unit1; interface uses Windows, Messages, SysUtils, Classes, Graphics, Controls, Forms, Dialogs; type TForm1 = class(TForm) procedure FormCreate(Sender: TObject); private { Private declarations } public { Public declarations } end; var Form1: TForm1;
implementation {$R *.DFM} procedure TForm1.FormCreate(Sender: Object); begin end; end. 21
File Delphi Form (.dfm) example
Project file (.dpr) example
OOP with Delphi
Pembuatan Program Berbasis OOP pada Delphi
Property pada Delphi
SomeObject.SomeProperty := 23
This property cannot be written to
Class Mobil
Methods
Penggunaan
Encapsulasi Class di Delphi • Program demo Abstraksi • Kelas Tkomputer – Lebar Layar – Ukuran VGA (Mb)
• Kelas TPC extends TKomputer • Kelas TNotebook extends TKomputer
TKomputer
TPC
TNotebook
Methods TPC
Methods TNotebook
Methods TNotebook (2)
Button Simpan
Button Tampil
Button Tampil
Hasil
Visual Component Library (VCL) • Visual component-based object-oriented framework for developing applications. • It was developed by Borland for use in, and tightly integrated with, its Delphi and C++ Builder. • It is written in Object Pascal. • A cross-platform equivalent of the VCL, called CLX (Component Library for Cross Platform), was later developed for use in Delphi, C++ Builder and Kylix. – CLX was based on Qt by Trolltech.
VCL Developers • VCL Developer: – JEDI, TMS, Developer Express, Mitov Software, Raize Software, TurboPower, IOComp, SDL
• VCL provides native support for PME (Properties, Methods and Events) model at .NET level – Delphi 8 or higher
Hirarki Komponen pada Delphi
Pembuatan komponen
Ex: TMemo
AdvancedEdit • Komponen TEdit biasa hanya menyediakan standar editbox • Kita akan membuatnya dapat: – Memiliki warna otomatis ketika mendapat focus – Memiliki aligment – Enter as Tab
• Turunan dari class TEdit
IDE – Menu|Component New Component - Use the New Component dialog to create the basic unit for a new component.
IDE – Menu|Component Install Component install a component into an existing or new package. After entering the information required, press OK. The Package editor dialog box is displayed. Into existing package In this case, you write the component code, identified by the unit, name to an existing package file. Into new package In this case, you declare a new package and write the component code, identified by unit name, to it.
IDE – Menu|Component
Unit file name - Enter the name of the unit you want to install. If the unit is in the Search Path, a full path name is not required. If the unit directory is not in the Search Path, it will be added to the end. Search path - The path used by Delphi to search for files. Package file name - Use the drop-down list to select the name of an installed package, or enter the name of another existing package. Package description - A brief description of the selected package.
IDE – Menu|Component
Unit file name - Enter the name of the unit you want to install. If the unit is in the Search Path, a full path name is not required. If the unit directory is not in the Search Path, it will be added to the end. Search path - The path used by Delphi to search for files. Package file name - Enter the name of the package to create. You can include a directory path with the name; otherwise, the package will reside in the current directory. To open a file/directory selection dialog box, click Browse. If you type a file name directly in the New Package dialog box, the .DPK extension will be added automatically. Package names must be unique within a project. If you name a package “STATS”, the Package editor generates a source file for it called “STATS.DPK”; the compiler generates an executable and a binary image called “STATS.BPL” and “STATS.DCP”, respectively. Use “STATS” to refer to the package in the requires clause of another package, or when using the package in an application. Package description - A brief description of the package.
IDE – Menu|Component Install Packages - Use this page to specify the designtime packages installed in the IDE and the runtime packages required by your project. Design packages - Lists the design time packages available to the IDE and to all projects. Runtime packages -Determines which run-time packages to use when the executable file is created.
IDE – Menu|Component Configure Palette Use the Palette page of the Environment Options dialog box to customize the way the component palette appears. You can rename, add, remove, or reorder pages and components.
Pembuatan komponen • unit AdvancedEdit; • Uses SysUtils, Classes, Controls, StdCtrls, Graphics, Windows, Messages, Forms; • TAdvancedEdit = class(TEdit) • Variabel private: – – – – – –
FOldBackColor : TColor; FColorOnEnter : TColor; FAlignment: TAlignment; FTabOnEnter: boolean; procedure SetAlignment(const Value: TAlignment); property OldBackColor : TColor read FOldBackColor write FOldBackColor;
Lanjutan • Variabel protected: – – – –
procedure DoEnter; override; procedure DoExit; override; procedure KeyPress(var Key: Char); override; procedure CreateParams(var Params: TCreateParams); override;Variabel public: – constructor Create(AOwner: TComponent); override;
• Variabel public: – constructor Create(AOwner:TComponent); override;
• Variabel published: – property Alignment : TAlignment read FAlignment write SetAlignment; – property ColorOnEnter :TColor read FColorOnEnter write FColorOnEnter; – property TabOnEnter : boolean read FTabOnEnter write FTabOnEnter;
Kode program
Diletakkan pada tab: Tutorial
Digunakan untuk aligment text pada editbox
Lanjutan
Digunakan inisialisasi komponen
Saat onFocus, simpan old color
Lanjutan
Ketika tidak focus, kembalikan warna
Set Aligment
Ketika enter dianggap tab
Hasil
URL Label Component • Menambahkan kemampuan komponen label agar dapat menerima link berupa URL yang dapat diklik secara langsung • Turunan dari class TCustomLabel • Memiliki warna default seperti sebuah link pada HTML • Ketika diklik akan membuka link tersebut pada sebuah browser default – Bisa juga membuka link berupa email
Pembuatan Komponen • unit DCURLLabel; • Uses SysUtils, Classes, Controls, StdCtrls, Messages, ShellAPI, Windows, Graphics; • TURLLabel = class(TCustomLabel) • Private: – – – –
fURL : String; procedure SetURL(value : string); procedure CMTextChanged(var Message: TMessage); Message CM_TextChanged;
• Public: – constructor Create (AOwner : TComponent); override; – procedure Click; override;
Kelas yang dibuat • Published: – – – – – – – – –
Property URL : String Read fURL write setURL; Property Align; Property Alignment; Property AutoSize; Property Color; Property Cursor; Property Caption; Property Font; Property ParentFont;
Kode program
Untuk membuka URL pada browser
Set URL yang diinputkan oleh user
Kode program
Untuk mengisi Caption
Konstruktor, inisialisasi
Ditempatkan pada tab Tutorial
Hasil Property: - Caption: UKDW - URL : http://www.ukdw.ac.id
TNumberEdit • TNumEdit is a component, just like TEdit, but it only accepts numerical input. • You can adjust whether to accept positive or negative numbers or integer or decimals. – Decimals in Delphi -> Extended data type
• You can also limit the input by using MinValue and/or MaxValue. – If value is bigger than MaxValue, value = MaxValue – If value is smaller than MinValue, value = MinValue
Pembuatan komponen • Create a new component: – unit NumEdit;
• Extends from TCustomEdit • Uses: – Windows, Messages, SysUtils, Classes, Graphics, Controls, Forms, Dialogs, StdCtrls;
Private variabel & procedure • • • • • • • • • • • • • •
FAllowDec: boolean; FAllowNeg: boolean; FMaxValue: extended; FMinValue: extended; procedure WhenKeyPress(Sender: TObject; var Key: Char); procedure SeteValue(const Value: extended); procedure SetiValue(const Value: integer); procedure SetAllowDec(const Value: boolean); procedure SetAllowNeg(const Value: boolean); procedure SetMaxValue(const Value: extended); procedure SetMinValue(const Value: extended); function GetiValue: integer; function GeteValue: extended; procedure WhenExit(Sender: TObject);
Published property • • • • • •
property eValue : extended read GeteValue write SeteValue; property iValue : integer read GetiValue write SetiValue; property AllowDec : boolean read FAllowDec write SetAllowDec; property AllowNeg : boolean read FAllowNeg write SetAllowNeg; property MinValue : extended read FMinValue write SetMinValue; property MaxValue : extended read FMaxValue write SetMaxValue;
Procedure Register & Constructor
Diletakkan pada tab Tutorial
Function Get & Set
Function Get & Set
WhenKeyPress
ImageTrack • Digunakan untuk “melipat” image dengan menggunakan slider • Sehingga akan terlihat perbedaan antara dua buah image yang sudah diinputkan sebelumnya • Contoh aplikasi: Japan earhquake before and after – http://www.abc.net.au/news/events/japanquake-2011/beforeafter.htm
Pembuatan komponen • unit ImageTrack2; • Uses Windows, Messages, SysUtils, Variants, Classes, Graphics, Controls, Forms, Dialogs, ComCtrls, ExtCtrls, jpeg; • TImageTrack2 = class(TPanel) • Private: – – – – – – – – –
img1 : TImage; img2 : TImage; track : TTrackBar; img1file : string; img2file : string; trakbarpos : Integer; procedure setFile1(f:string); procedure setFile2(f:string); procedure setTrackPos(t:Integer);
Lanjutan • Public: – constructor Create(AOwner:TComponent); override; – procedure TrackBarChange(Sender: TObject);
• Published: – property File1:string read img1file write setFile1; – property File2:string read img2file write setFile2; – property TrackPos:integer read trakbarpos write setTrackPos;
Kode
Kode program
Hasil
Next • Pascal is simple, clear, easy, powerfull, strong type language • Dellphi is great tool, it’s a RAD man!
• Next: Java Component