Tuesday, December 15, 2009

Mengatur Komponen ketika Form di Resize (PicView)

Ketika membangun tampilan form dengan C#, kita sudah meletakkan masing-masing komponen yang diperlukan dalam form yang akan kita tampilkan. Pengguna kadang mengubah ukurannya dengan cara minimize, maximize atau sekedar mengubah ukurannya supaya window aplikasi yang lain bisa kelihatan. Ini merupakan hal yang biasa saat kita menggunakan Windows, dengan menjalankan banyak aplikasi. Terus bagaimana supaya tampilan form kita tetap sesuai dengan yang kita harapkan? (PictureView)

Sebagai contoh aplikasi penampil gambar biasanya bisa merespons jika form window nya diubah-ubah ukurannya dengan bisa tetap menampilkan komponen penampil gambar secara menyeluruh. Untuk bisa merespon pengubahan ukuran form ini kita bisa menanganinya dengan memanfaatkan event yang ada di form. Salah satu event yang bisa kita gunakan adalah event resize. Nah kita akan mencoba dengan contoh, bagaimana memanfaatkan event ini(PictureView).

Kita akan membuat aplikasi dengan 1 buah form dan tiga buah komponen. Tiga buah komponen tersebut adalah 1 buah picture box dan 2 buah Button. Komponen picture box tersebut akan berubah ukurannya jika formnya diubah ukurannya. Sedangkan 2 buah tombol posisinya juga akan berubah menyesuaikan dengan perubahan ukuran picture box(PictureView).

Secara garis besar, untuk menangani perubahan ukuran form ini, di bagian constructor dari form saat inisialisasi kita perlu tambahkan rutin untuk menangani event resize ini. Berikut adalah kodenya :
this.Resize += new System.EventHandler(this.PicView_Resize);
Sedangkan untuk definisi dari fungsi PicView_Resize adalah sebagai berikut:
private void PicView_Resize(object sender, EventArgs e)
{
   picBox.Width = this.Width - 145;
   picBox.Height = this.Height - 50;
   btnAmbil.Left = picBox.Left + picBox.Width + 20;
   BtnTutup.Left = btnAmbil.Left;
}
dari potongan kode di atas bisa dilihat bahwa untuk picture box kita cukup menyesuaikan ukuran lebar dan tinggi dari komponen, sedangkan untuk komponen button cukup kita set lokasi koordinatnya saja. karena kita memang tidak melakukan perubahan terhadap ukuran dari komponen button tersebut(PictureView).

Lebih lengkap rutin ini bisa dilihat di bawah ini, silahkan para pembaca untuk mencobanya.
using System;
using System.Windows.Forms;

public class PicView : Form
{
  private System.Windows.Forms.PictureBox picBox;
  private System.Windows.Forms.Button btnAmbil;
  private System.Windows.Forms.Button BtnTutup;

  public PicView()
  {
    this.picBox = new System.Windows.Forms.PictureBox();
    this.btnAmbil = new System.Windows.Forms.Button();
    this.BtnTutup = new System.Windows.Forms.Button();
    // 
    // picBox
    // 
    this.picBox.BackColor = System.Drawing.SystemColors.ControlLightLight;
    this.picBox.Location = new System.Drawing.Point(5, 5);
    this.picBox.Size = new System.Drawing.Size(250, 250);
    this.picBox.TabIndex = 0;
    this.picBox.TabStop = false;
    // 
    // btnAmbil
    // 
    this.btnAmbil.Location = new System.Drawing.Point(275, 5);
    this.btnAmbil.Size = new System.Drawing.Size(108, 23);
    this.btnAmbil.TabIndex = 1;
    this.btnAmbil.Text = "Ambil Gambar";
    // 
    // BtnTutup
    // 
    this.BtnTutup.Location = new System.Drawing.Point(275, 34);
    this.BtnTutup.Size = new System.Drawing.Size(108, 23);
    this.BtnTutup.TabIndex = 2;
    this.BtnTutup.Text = "Tutup";
    // 
    // PicView Form
    // 
    Size = new System.Drawing.Size(400, 300);
    this.Controls.Add(this.BtnTutup);
    this.Controls.Add(this.btnAmbil);
    this.Controls.Add(this.picBox);
    this.Text = "Picture View (http://abcsharpind.blogspot.com)";
    this.Resize += new System.EventHandler(this.PicView_Resize);  
  }

  private void PicView_Resize(object sender, EventArgs e)
  {
    picBox.Width = this.Width - 145;
    picBox.Height = this.Height - 50;
    btnAmbil.Left = picBox.Left + picBox.Width + 20;
    BtnTutup.Left = btnAmbil.Left;
  }

  public static void Main()
  {
     Application.EnableVisualStyles();
     Application.SetCompatibleTextRenderingDefault(false);
     PicView p ;
     p = new PicView();
     Application.Run(p);        
  }
  
}

Ok, Selamat Mencoba!!! (PictureView)

0 comments:

Post a Comment