Vb.Net How to create form skin

Vb.Net How to create form skin

mp10purple

Bagaimana membuat form terlihat cantik seperti ini ? dengan cara membuat sendiri form skin untuk program yang kita buat yang akan mempercantik aplikasi yang kita buat dengan VB.NET.

Kita mulai yuk…

Step 1 : Download file form JPG diatas.

Step 2 : buka file form JPG tersebut dengan Photoshop

Clipboard01

Step 3 : Create New Project pada VB.Net dan pilih “Windows Forms Control Library”

Clipboard02Clipboard03

Step 4 : Panel 1

a. Tambahkan panel diatas form

Clipboard04

b. set properties panel sbb :

– Dock = Top

– Backcolor = Transparent

– BackgroundImage = pilih potongan gambar pada step 2 no.1 ( lihat diatas, potong dengan photoshop ).

maka panel akan tampak seperti ini.

Clipboard05

Step 5 : Panel 2

a. tambahkan panel lagi di sisi kanan form

Clipboard06

b. set properties panel sbb :

– Anchor = Top, Right

– Backcolor = Transparent

– BackgroundImage = pilih potongan gambar pada step 2 no.3 ( lihat diatas, potong dengan photoshop ).

maka panel akan tampak seperti ini.

Clipboard07

Step 6 : membuat garis tepi kanan, kiri dan bawah.

a. tambahkan panel

set properties :

– Dock = Left ( untuk garis tepi kiri, sesuaikan dengan sisi form )

– BackgroundImage = pilih potongan gambar pada step 2 no.5 untuk panel tepi kiri ( sesuaikan dengan garisnya )

b. buat untuk garis tepi kanan dan bawah dengan cara yang sama.

hasilnya :

Clipboard08

Step 7 : membuat sudut

a. tambahkan PictureBox dan pasang di masing -masing sudut dengan properties Image disesuaikan pada step 2.

Clipboard09

Step 8 : membuat Control Form

Tambahkan PictureBox untuk masing2 control dan set image sesuai dengan Step 2 untuk Tombol Minimized, Maximized dan Close

Clipboard10

Step 9 : Label untuk nama form

Clipboard11

Step 10 : Tambahkan Code sbb: 

 

Imports System.Windows.Forms
Imports System.Drawing

Public Class UserControl1
    Dim bit As Integer
    Dim p1, p2 As Point

    Private Sub DCSkin_Load(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles Me.Load
        Me.ParentForm.FormBorderStyle = FormBorderStyle.None
        Me.Dock = DockStyle.Fill
        Me.ParentForm.TransparencyKey = System.Drawing.Color.FromArgb(121, 121, 121)
        Me.Label1.Text = Me.ParentForm.Text
    End Sub
    Private Sub DCSkin_Paint(ByVal sender As Object, ByVal e As System.Windows.Forms.PaintEventArgs) Handles Me.Paint
        Me.SendToBack()
    End Sub

    Private Sub PictureBox6_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles PictureBox6.Click
        Me.ParentForm.WindowState = FormWindowState.Minimized
    End Sub

    Private Sub PictureBox7_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles PictureBox7.Click
        If Me.ParentForm.WindowState = FormWindowState.Maximized Then
            Me.ParentForm.WindowState = FormWindowState.Normal
        Else
            Me.ParentForm.WindowState = FormWindowState.Maximized
        End If
    End Sub

    Private Sub PictureBox8_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles PictureBox8.Click
        Me.ParentForm.Close()
    End Sub

    Private Sub Panel1_MouseDown(ByVal sender As Object, ByVal e As System.Windows.Forms.MouseEventArgs) Handles Panel1.MouseDown
        Me.ParentForm.Activate()
        Me.ParentForm.BringToFront()
        bit = 1
        p1 = Me.ParentForm.Location
        p2 = e.Location
    End Sub
    Private Sub Panel1_MouseMove(ByVal sender As Object, ByVal e As System.Windows.Forms.MouseEventArgs) Handles Panel1.MouseMove
        If bit = 1 Then
            Me.ParentForm.Location += (e.Location - p2)
        End If
    End Sub
    Private Sub Panel1_MouseUp(ByVal sender As Object, ByVal e As System.Windows.Forms.MouseEventArgs) Handles Panel1.MouseUp
        bit = 0
    End Sub

    Private Sub Panel2_MouseDown(ByVal sender As Object, ByVal e As System.Windows.Forms.MouseEventArgs) Handles Panel2.MouseDown
        Panel1_MouseDown(sender, e)
    End Sub
    Private Sub Panel2_MouseMove(ByVal sender As Object, ByVal e As System.Windows.Forms.MouseEventArgs) Handles Panel2.MouseMove
        Panel1_MouseMove(sender, e)
    End Sub
    Private Sub Panel2_MouseUp(ByVal sender As Object, ByVal e As System.Windows.Forms.MouseEventArgs) Handles Panel2.MouseUp
        Panel1_MouseUp(sender, e)
    End Sub

    Private Sub PictureBox6_MouseDown(ByVal sender As System.Object, ByVal e As System.Windows.Forms.MouseEventArgs) Handles PictureBox6.MouseDown
        PictureBox6.Image = My.Resources.DotYellow
    End Sub
    Private Sub PictureBox6_MouseUp(ByVal sender As System.Object, ByVal e As System.Windows.Forms.MouseEventArgs) Handles PictureBox6.MouseUp
        PictureBox6.Image = My.Resources.md10purple_Minimized
    End Sub

    Private Sub PictureBox7_MouseDown(ByVal sender As System.Object, ByVal e As System.Windows.Forms.MouseEventArgs) Handles PictureBox7.MouseDown
        PictureBox7.Image = My.Resources.DotGreen
    End Sub
    Private Sub PictureBox7_MouseUp(ByVal sender As System.Object, ByVal e As System.Windows.Forms.MouseEventArgs) Handles PictureBox7.MouseUp
        PictureBox7.Image = My.Resources.md10purple_Maximized
    End Sub

    Private Sub PictureBox8_MouseDown(ByVal sender As System.Object, ByVal e As System.Windows.Forms.MouseEventArgs) Handles PictureBox8.MouseDown
        PictureBox8.Image = My.Resources.DotRed
    End Sub
    Private Sub PictureBox8_MouseUp(ByVal sender As System.Object, ByVal e As System.Windows.Forms.MouseEventArgs) Handles PictureBox8.MouseUp
        PictureBox8.Image = My.Resources.md10purple_Close
    End Sub

End Class

Leave a comment