16 May 2015


Agenda berbagi hari ini adalah mengenai bagaimana menggabungkan 2 file image (gambar) ke dalam 1 picturebox yang kemudian daat disimpan ke dalam 1 file ataupun ke database.

Pada UI control-control yang digunakan adalah 5 buah button, 2 textbox, 3 picturebox, dan jangan lupa untuk menambahkan 1 OpenFileDialog dan 1 SaveFileDialog.
Layout diatur sebagai berikut:


Kemudian untuk code kita mulai dengan melakukan import sebagai berikut:
Imports System.Drawing.Graphics
Imports System.Drawing
Imports System.Drawing.Bitmap
Imports System.Net
Imports System.IO


Diikuti dengan mendeklarasikan variable bitmap untuk menyimpan image selama proses di dalam Class Form1.
Public Class Form1

    Dim img1 As Bitmap
    Dim img2 As Bitmap
    Dim imgMerge As Bitmap

End Class

Property UI akan diatur pada event Form1_Load.
Private Sub Form1_Load(ByVal sender As System.Object, _
    ByVal e As System.EventArgs) Handles MyBase.Load

    Button1.Text = "Browse..."
    Button2.Text = "Browse..."
    Button3.Text = "Combine Images!"
    Button4.Text = "Save to File"
    Button5.Text = "Save to Database"
    PictureBox1.BorderStyle = BorderStyle.FixedSingle
    PictureBox2.BorderStyle = BorderStyle.FixedSingle
    PictureBox3.BorderStyle = BorderStyle.FixedSingle
    TextBox1.ReadOnly = True
    TextBox2.ReadOnly = True

End Sub

Button1 digunakan untuk memilih gambar sumber pertama:
Private Sub Button1_Click(ByVal sender As System.Object, _
    ByVal e As System.EventArgs) Handles Button1.Click

    OpenFileDialog1.Filter = "*.png|*.png|*.gif|*.gif|*.jpg|*.jpg"
    If OpenFileDialog1.ShowDialog() = Windows.Forms.DialogResult.OK Then
       TextBox1.Text = OpenFileDialog1.FileName
       img1 = New Bitmap(TextBox1.Text)
       PictureBox1.SizeMode = PictureBoxSizeMode.StretchImage
       PictureBox1.Load(TextBox1.Text)
       PictureBox1.Refresh()
    End If

End Sub

Sementara Button2 digunakan untuk memilih gambar sumber kedua.
Private Sub Button2_Click(ByVal sender As System.Object, _
    ByVal e As System.EventArgs) Handles Button2.Click

    OpenFileDialog1.Filter = "*.png|*.png|*.gif|*.gif|*.jpg|*.jpg"
    If OpenFileDialog1.ShowDialog() = Windows.Forms.DialogResult.OK Then
       TextBox2.Text = OpenFileDialog1.FileName
       img2 = New Bitmap(TextBox2.Text)
       PictureBox2.SizeMode = PictureBoxSizeMode.StretchImage
       PictureBox2.Load(TextBox2.Text)
       PictureBox2.Refresh()
    End If
 
End Sub

Nah ini bagian penting nya nih, kita akan membuat fungsi bernama CombineImage untuk menyatukan dua gambar sumber yang sudah dipilih sebelumnya.
Public Function CombineImage(ByVal Image1 As Bitmap, _
    ByVal Image2 As Bitmap) As Bitmap

    Dim imgResult As New Bitmap(Image1.Width + Image2.Width, _
        Math.Max(Image1.Height, Image2.Height))
    Dim grhResult As Graphics = Graphics.FromImage(imgResult)
    grhResult.DrawImage(Image1, New RectangleF(0, 0, _
                        Image1.Width, Image1.Height))
    grhResult.DrawImage(Image2, Image1.Width, 0, _
                        Image1.Width, Image1.Height)
    grhResult.Dispose()
    grhResult = Nothing
    Return imgResult

End Function

Proses penggabungan gambar akan dilakukan saat button3 diklik, dengan terlebih dahulu mengecek apakah gambar sumber sudah lengkap. Jika sudah lengkap kemudian kita akan memanggil fungsi CombineImage dan menampilkan gambar hasil di PictureBox3.
Private Sub Button3_Click(ByVal sender As System.Object, _
    ByVal e As System.EventArgs) Handles Button3.Click

    If TextBox1.Text = String.Empty Or TextBox2.Text = String.Empty Then
       MsgBox("Gambar sumber belum dipilih!")
       Exit Sub
    Else
       imgMerge = CombineImage(img1, img2)
       PictureBox3.Image = imgMerge
    End If

 End Sub

Lanjut di part 2 okay, next next....

Click here if you like this article.


0 comments: