26 February 2016

Membuat Progressbar Dengan Image

Sekarang pada postingan kali ini saya akan mencoba berexperiment masih seputar delphi yaitu mencoba membuat progressbar menggunakan suatu image,maksud dari experiment ini yaitu untuk supaya bagaimana agar komponen dari pada progressbar tampilannya bisa sesuai dengan gambar yang dikehendaki kita agar tidak bosan.Dimana apabila kita membuat suatu aplikasi atau projek mungkin bisa menambahkan suatu variasi ini agar projek yang kita buat menjadi lebih baik.

progressbar dengan image
Progressbar Image


Langkah Pembuatan

Baiklah sekarang saya akan coba langsung ke inti dari postingan kali ini yaitu langkah-langkah untuk membuat progressbar dengan image.Yang pertama tentunya aplikasi delphinya sudah terinstall pada PC atau komputer.

Penambahan Komponen

Pada saat pertama kali kita buka aplikasi delphinya maka akan muncul suatu Form dan disini saya coba menambahkan beberapa komponen pada form tersebut yaitu:
1. 1 buah Image.
2. 1 buah Timer.
3. 2 buah Button.
Dan dari beberapa komponen tersebut pada object inspector saya coba ganti properti caption dari masing-masing komponen button yaitu menjadi START dan STOP,kemudian properti picture dari komponen image saya coba tambahkan suatu image bmp dan komponen timer saya ganti intervalnya menjadi 120,kemudian saya coba posisikan komponen-komponen tersebut seperti gambar dibawah ini

posisi komponen pada form
Penambahan dan Pengaturan Komponen

Koding


Membuat Sebuah Procedure

Setelah posisi komponen siap lanjut ke kode editor untuk pengkodingannya yang pertama disini saya coba membuat suatu procedure yaitu untuk progress image dimana image tersebut supaya bisa menjadi progress pada komponen progressbar pada saat di run dimana procedure nya adalah seperti dibawah ini
procedure TForm1.UpdateImageProgress(const img: TImage);
const
  step = 4;
var
  b  : TBitmap;
begin
  with img.Picture.Bitmap do
  begin
    b := TBitmap.Create;
    try
      b.Width  := Width;
      b.Height := Height;
      BitBlt(b.Canvas.Handle, step, 0, Width-step, Height, Canvas.Handle, 0, 0, SRCCOPY);
      BitBlt(b.Canvas.Handle, 0, 0, step, Height, Canvas.Handle, Width-step, 0, SRCCOPY);
      Assign(b);
    finally
      FreeAndNil(b);
    end;
  end;
end;

Kode Timer

Setelah itu lanjut untuk procedure atau kode komponen Timer dengan mengklik 2X komponen timer kemudian buat procedurenya seperti dibawah ini
procedure TForm1.Timer1Timer(Sender: TObject);
begin
  UpdateImageProgress(Image1);
end;

Kode Button Start

Lanjut lagi membuat procedure untuk button start dimana disini button1 saya jadikan button start dan procedure nya seperti dibawah ini
procedure TForm1.Button1Click(Sender: TObject);
begin
  Timer1.Enabled := True;
end;

Kode Button Stop

Terakhir untuk procedure button stop yaitu disini button2 sebagai button stop dan untuk procedure nya adalah seperti berikut
procedure TForm1.Button2Click(Sender: TObject);
begin
  Timer1.Enabled := False;
end;

Tes Projek

Setelah semua kode tersebut diatas siap coba klik tombol Run atau tekan F9 pada keyboard untuk mencoba projek tersebut jalan.

tes projek progressbar image
Tes Run Projek


Demikianlah untuk experiment saya kali ini tentang cara membuat progressbar dengan image semoga postingan ini bermanfaat bagi teman-teman dan bisa dikembangkan lagi.

Oke Salam Blogger and Happy Koding.

2 comments:

  1. mantaap nih...jd nambah ilmu deui,,hatur thank U buat akang mamen...

    ReplyDelete