h1

Contoh Update Progress dan Penggunaan GDI Untuk Membuat Thumbnail Image – ASP.NET AJAX Tutorial

Oktober 2, 2008

Tentu kamu sudah tahu ya bahwa GDI (Graphics Drawing Interface) digunakan untuk membuat sebuah tampilan gambar thumbnail on the fly atau saat proses berlangsung di dalam web server. Penggunaan update progress pada server local tidak akan begitu kelihatan karena berlangsung sangat cepat. Oleh sebab itu pada contoh berikut ini akan disertakan proses delay agar tampilan dalam update progress dapat dilihat.

Buat WebSite baru pilih ASP.NET AJAX Enabled Web Site. Kemudian pada ScriptManager masukkan UpdatePanel yang diisi dengan Listbox, Checkbox, Label dan Image. Kemudian tambahkan UpdateProgress yang diisi dengan gambar animasi gif dan Label keterangan.

Desain tampilannya adalah sebagai berikut:

Pada event Page_Load masukkan listing berikut :

If Not IsPostBack Then

Dim di As New IO.DirectoryInfo(Server.MapPath(“~\”))
Dim fi As IO.FileInfo() = di.GetFiles(“*.jpg”)
Dim xTemp As String

For i As Integer = 0 To UBound(fi)
xTemp &= fi(i).Name & IIf(i = UBound(fi), “”, “,”)
Next

Dim xTemp2() As String = Split(xTemp, “,”)
ListBox1.DataSource = xTemp2
ListBox1.DataBind()

End If

Pada kode diatas pertama-tama program akan mencari informasi file yang berada difolder server khususnya file yang berekstensi .jpg yang selanjutnya akan diisikan kedalam listbox.

Kemudian double klik pada listbox dan ketikkan listing berikut ini pada event Listbox_SelectedIndexChanged

If CheckBox1.Checked Then
Dim xbitmap As New Drawing.Bitmap(Server.MapPath(ListBox1.Text))
Dim xthumb As New Drawing.Bitmap(100, 100)
xthumb = xbitmap.GetThumbnailImage(100, 100, Nothing, IntPtr.Zero)
Dim thumbImage As String = Server.MapPath(“~\” & ListBox1.Text & “.gif”)
xthumb.Save(thumbImage, Drawing.Imaging.ImageFormat.Gif)
System.Threading.Thread.Sleep(1000)
Dim x, i As Integer
Dim c As String
Dim d As Integer = 0
x = Len(thumbImage.ToString)

For i = x To 1 Step -1
d += 1
c = Mid(thumbImage.ToString, i, 1)
If c = “\” Then
c = Right(thumbImage.ToString, d – 1)
Exit For
End If
Next
Image1.ImageUrl = c
Label1.Text = c
xbitmap.Dispose()
xthumb.Dispose()

Else
System.Threading.Thread.Sleep(1000)
Image1.ImageUrl = ListBox1.Text
Label1.Text = Image1.ImageUrl.ToString
End If
End Sub

Pada kode diatas terdapat method thread.sleep yang digunakan untuk melakukan delay dengan satuan milidetik (ingat hal ini untuk melihat proses delay pada server local). Pada kode diatas juga digunakan GDI+ untuk pembuatan thumbnail sebuah file gambar. GDI+ merupakan namespace System.Drawing dengan menggunakan class bitmap. File pada listbox yang dipilih kemudian dibuat objek bitmap baru dengan ukuran 100 X 100 untuk menampung file thumbnail yang baru dengan metode GetThumbnailImage. Kemudian thumbnail tersebut disimpan dalam format gif.

Sekarang coba kamu jalankan hasilnya kurang lebih adalah sebagai berikut :

Mungkin ada tambahan masukan atau pertanyaan? silahkan posting comment dibawah, thanks :)

Tinggalkan sebuah Komentar