Aplikasi berikut ini merupakan contoh pembuatan form
dengan berbagai bentuk dan contoh penerapan komponen
MediaPlayer untuk memainkan file music dengan ekstensi
*.mp3, *.wav dan *.mid. Aplikasi akan terdiri dari 2 buah
form yaitu form1 untuk interface mp3 player dan form2
untuk interface playlist.
Langkah-langkah :
1. Buat dua buah gambar berikut menggunakan Microsoft Paint atau aplikasi lain. Gambar pertama (Form1.bmp) untuk interface mp3 player dan gambar kedua (Form2.bmp) untuk interface playlist (daftar lagu).
Contoh gambar form dan button ada pada folder ‘Materi Latihan 13, 14 dan 15’.
2. Buat aplikasi baru, klik File – New – Applications … 3. Ubah property Form1 seperti pada table di bawah ini :
Komponen Tab Parent Property Value
Form1 AlphaBlend True
AlphaBlendValue 250
Autosize True
BorderStyle bsNone
TransparentColor True TransparentColorValue clWhite
4. Tambahkan Image1, ubah property Image1 seperti pada table di bawah ini :
Komponen Tab Parent Property Value
Image1 Additional Form1 Autosize True
Picture Form1.bmp
5. Tambahkan 5 buah Label, ubah property masing-masing komponen seperti table di bawah ini :
Komponen Tab Parent Property Value
Label1 Standard Form1 Caption Judul Lagu
AutoSize False Font.Style [fsBold]
Label2 Standard Form1 Caption Waktu
Label3 Standard Form1 Caption Repeat
Label4 Standard Form1 Caption Shuffle
Label5 Standard Form1 Caption StayOnTop
Label1, Label2, Label3, Label4, Label5
Transparent True
Label3, Label4, Label5 Enabled False
6. Tambahkan ProgressBar1 dari tab Win32.
7. Tambahkan MediaPlayer1 dari tab System. Ubah property berikut : Komponen Tab Parent Property Value
MediaPlayer1 System Form1 Visible False
8. Tambahkan Timer1 dari tab System. Ubah property berikut : Komponen Tab Parent Property Value
Timer1 System Form1 Enabled False
9. Tambahkan 10 buah Image, ubah property masing-masing komponen seperti table di bawah ini :
Komponen Tab Parent Property Value Image2, Image3, Image4,
Image5, Image6, Image7, Image8, Image9, Image10, Image11
Additional Form1 Autosize True Cursor crHandPoint Transparent True
Image2 Picture 8play24.bmp
Image3 Picture 8Pause24.bmp
Image4 Picture 8stop24.bmp
Image5 Picture 8backward24.bmp
Image6 Picture 8forward24.bmp
Image7 Picture 8chat24.bmp
Image8 Picture 8refresh24.bmp
Image9 Picture 8stats24.bmp
Image10 Picture 8app24.bmp
Image11 Picture 8close24.bmp
11. Buat form baru (Form2), klik menu File – New – Form. 12. Ubah property pada Form2 seperti pada table di bawah ini : Komponen Tab Parent Property Value
Form2 AlphaBlend True
AlphaBlendValue 250
Autosize True
BorderStyle bsNone
TransparentColor True TransparentColorValue clWhite
13. Tambahkan 6 buah komponen Image, ubah property masing-masing komponen seperti pada table di bawah ini :
Komponen Tab Parent Property Value
Image1 Additional Form2 Autosize True
Picture Form2.bmp Image2, Image3, Image4, Image5, Image6 Autosize True Cursor crHandPoint Transparent True
Image2 Picture 8addfile24.bmp
Image3 Picture 8trash24.bmp
Image4 Picture 8floppy24.bmp
Image5 Picture 8foldermove24.bmp
Image6 Picture 8close24.bmp
14. Tambahkan komponen ListBox1 dari tab Standard, ubah property ListBox1 seperti pada table di bawah ini :
Komponen Tab Parent Property Value
ListBox1 Standard Form2 Color $00C080FF
Ctl3D False
15. Tambahkan 2 buah komponen OpenDialog dan 1 buah SaveDialog dari tab Dialog, ubah property masing-masing komponen seperti pada table di bawah ini :
Komponen Tab Parent Property Value OpenDialog1 Dialog Form2 DefaultExt *.mp3
Filter Filter Name Filter
File Musik (*.mp3, *.wav, *.mid) *.mp3; *.wav; *.mid Options.
ofAllowMultiSelect True OpenDialog2 Dialog Form2 DefaultExt *.pls
Filter Filter Name Filter
File Playlist (*.pls) *.pls SaveDialog1 Dialog Form2 DefaultExt *.pls
Filter Filter Name Filter
File Playlist (*.pls) *.pls 16. Atur layout Form2 seperti pada gambar di bawah ini :
17. Buat event berikut pada masing-masing komponen seperti pada table di bawah ini :
Komponen Event Code
Form2 onCreate procedure TForm2.FormCreate(Sender: TObject); begin
Left := Form1.Left;
Top := Form1.Top + Form1.Height; end;
Image1 onMouseDown procedure TForm2.Image1MouseDown(Sender: TObject; Button: TMouseButton;
Shift: TShiftState; X, Y: Integer); begin
ReleaseCapture;
Perform(WM_SYSCOMMAND, $F012, 0); end;
Image2 onClick procedure TForm2.Image2Click(Sender: TObject); Var NoUrut : Integer; begin If OpenDialog1.Execute then Begin NoUrut := ListBox1.Items.Count - 1; ListBox1.Items.AddStrings(OpenDialog1.Files);
If ListBox1.Items.Count > 0 then ListBox1.ItemIndex := NoUrut + 1; End;
end;
Image3 onClick procedure TForm2.Image3Click(Sender: TObject); begin
If ListBox1.ItemIndex >= 0 then
ListBox1.Items.Delete(ListBox1.ItemIndex); end;
Komponen Event Code
Image4 onClick procedure TForm2.Image4Click(Sender: TObject); begin
If SaveDialog1.Execute then
ListBox1.Items.SaveToFile(SaveDialog1.FileName); end;
Image5 onClick procedure TForm2.Image5Click(Sender: TObject); begin
If OpenDialog2.Execute then Begin
ListBox1.Items.LoadFromFile(OpenDialog2.FileName); If ListBox1.Items.Count > 0 then ListBox1.ItemIndex := 0; End;
end;
Image6 onClick procedure TForm2.Image6Click(Sender: TObject); begin
Close; end;
18. Kembali ke Form1. Gunakan Project Manager (Ctrl+Alt+F11) atau pilih Unit1 pada Code Editor kemudian tekan F12.
19. Tambahkan variable State dengan type Integer pada blok Public, lihat gambar berikut :
20. Buat procedure Play, Pause, Resume, Stop, Next dan Prev pada blok Public (lihat gambar di point 19), tekan Ctrl+Shift+C untuk membuat blok procedure dan ketikkan perintah berikut ini :
Komponen Procedure Code
Form1 Play procedure TForm1.Play; begin With Form2 do Begin If ListBox1.ItemIndex <> -1 then Begin MediaPlayer1.FileName := ListBox1.Items[ListBox1.ItemIndex]; MediaPlayer1.Open; Form1.Label1.Caption := MediaPlayer1.FileName; Timer1.Enabled := True; ProgressBar1.Max := MediaPlayer1.Length; MediaPlayer1.Notify := True; State := 1; MediaPlayer1.Play; End; End; end;
Form1 Pause procedure TForm1.Pause; begin If State = 1 then Begin State := 2; Timer1.Enabled := False; MediaPlayer1.Pause; End; end;
Form1 Resume procedure TForm1.Resume; begin
If State = 2 then Begin
Komponen Procedure Code
Timer1.Enabled := True; MediaPlayer1.Resume; End;
end;
Form1 Stop procedure TForm1.Stop; begin If State = 1 then Begin State := 0; Timer1.Enabled := False; MediaPlayer1.Stop; End; end;
Form1 Next procedure TForm1.Next; begin
If State in [0, 1, 2] then Begin
With Form2.ListBox1 do Begin
If ItemIndex = (Items.Count - 1) then Begin
If Label3.Enabled then ItemIndex := 0 else ItemIndex := -1;
End else ItemIndex := ItemIndex + 1; If Label4.Enabled then ItemIndex := Random(Items.Count - 1); End; Play; End; end;
Form1 Prev procedure TForm1.Prev; begin
With Form2.ListBox1 do Begin
If ItemIndex = 0 then ItemIndex := Items.Count - 1 else ItemIndex := ItemIndex - 1;
If Label4.Enabled then
ItemIndex := Random(Items.Count - 1); End;
Play; end;
21. Buat function Int2TimeStr(I : Integer):String; pada blok Public (lihat gambar di point 19). Tekan Ctrl+Shift+C untuk membuat blok function, ketikkan perintah berikut ini :
Komponen Function Code
Form1 Int2TimeStr function TForm1.Int2TimeStr(I: Integer): String; begin
I := I Div 1000;
Result := FormatFloat('00', I Div 3600) + ':' + FormatFloat('00', I Div 60) + ':' + FormatFloat('00', I Mod 60);
22. Buat event berikut pada masing-masing komponen seperti pada table di bawah ini :
Komponen Event Code
Form1 OnCreate procedure TForm1.FormCreate(Sender: TObject); begin
MediaPlayer1.TimeFormat := tfMilliseconds; State := 0;
Randomize; end;
onShow procedure TForm1.FormShow(Sender: TObject); begin
Form2.Show; end;
Timer1 OnTimer procedure TForm1.Timer1Timer(Sender: TObject); begin
Label2.Caption := Int2TimeStr(MediaPlayer1.Position) + ' / ' + Int2TimeStr(MediaPlayer1.Length);
ProgressBar1.Position := MediaPlayer1.Position; If (State = 1) And
(MediaPlayer1.Position >= MediaPlayer1.Length) then Begin Stop; Next; End; end; Image1 onMouse Down
procedure TForm1.Image1MouseDown(Sender: TObject; Button: TMouseButton;
Shift: TShiftState; X, Y: Integer); begin
ReleaseCapture;
Perform(WM_SYSCOMMAND, $F012, 0); end;
Image2 onClick procedure TForm1.Image2Click(Sender: TObject); begin
If State in [0, 1] then Play else Resume;
end;
Image3 onClick procedure TForm1.Image3Click(Sender: TObject); begin
Pause; end;
Image4 onClick procedure TForm1.Image4Click(Sender: TObject); begin
Stop; end;
Image5 onClick procedure TForm1.Image5Click(Sender: TObject); begin
Prev; end;
Image6 onClick procedure TForm1.Image6Click(Sender: TObject); begin
Komponen Event Code end;
Image7 onClick procedure TForm1.Image7Click(Sender: TObject); begin
Form2.Show; end;
Image8 onClick procedure TForm1.Image8Click(Sender: TObject); begin
Label3.Enabled := not Label3.Enabled; end;
Image9 onClick procedure TForm1.Image9Click(Sender: TObject); begin
Label4.Enabled := not Label4.Enabled; end;
Image10 onClick procedure TForm1.Image10Click(Sender: TObject); begin
Label5.Enabled := Not Label5.Enabled;
If Label5.Enabled then FormStyle := fsStayOnTop else FormStyle := fsNormal;
end;
Image11 onClick procedure TForm1.Image11Click(Sender: TObject); begin
Close; end;
23. Kembali ke Form2.
24. Buat event onDblClick pada ListBox1 seperti pada table di bawah ini : Komponen Event Code
ListBox1 onDblClick procedure TForm2.ListBox1DblClick(Sender: TObject); begin
Form1.Play; end;
25. Simpan seluruh project, klik menu File – Save All, simpan dalam folder Latihan14.
26. Uji dan jalankan aplikasi, perhatikan saat pengujian pada beberapa action tampil CPU Windows, tekan F9 (Run) untuk melanjutkan. CPU Windows hanya muncul pada saat desain, kalau dijalankan langsung dari file execution hal ini tidak akan tampil.