Halo temen-temen coder, kali ini Rani pengen nunjukin gimana caranya nampilin form atau beberapa form dalam tampilan tab seperti pada chrome atau firefox.
Sebagai awalan sebuah project sudah dibuat dengan nama TabUIFormat seperti gambar di bawah. Secara otomatis Form 1 pun sudah dibuat.
Kita akan menambahkan 1 buah MDI Parent form dengan nama frmMain sebagai induk atau form utama yang akan menampung form-form lainnya. Caranya di Solution Explorer kita klik kanan di bagian node nama project kemudian pilih Add -> Windows Form...
Jadinya seperti di bawah ini sebuah menu untuk memanggil Form 1, Form 2, dan Form 3.
Karena kita memakai MDI Parent dari template maka code di belakangnya pun akan ditambahkan secara otomatis.
Mari kita hapus dulu bagian di antara Public Class frmMain dan End Class. Jadi seperti di bawah ini:
Lalu kita tambah kan 2 form lagi, Form2 dan Form3 dengan cara yang sama seperti waktu kita menambahkan MDI Parent form tapi kali ini kita pilih Window Form biasa seperti gambar di bawah.
Hasilnya kita punya 1 MDI Parent form dan 3 buah Form seperti berikut:
Lalu kita atur dulu project property dari menu Project -> [Nama Project] Properties ...
Supaya yang muncul pertama adalah frmMain maka pada bagian Application (panel kiri), atur Startup Form menjadi frmMain. Dan Shutdown mode "When last form closes" agar applikasi berhenti saat form terakhir ditutup.
Tambahkan sebuah TabControl pada frmMain dan posisikan di bagian bawah menu.
Atur property TabPages dan hapus (Remove) semua TabPage yang ada disana.
Hasilnya akan menyerupa bar seperti gambar di bawah. Atur lebar selebar form dan atur property anchor Top, Left, Right, agar posisinya tetap diatas dan lebar nya menyesuaikan dengan form saat form berubah ukuran.
Atur tampilan Form1, Form2, dan Form3 sebagai berikut agar mudah membedakannya nanti.
Dan berikut adalah code yang harus ditulis.
Code frmMain.vb
Public Class frmMain
'to hide/show tab
Sub SetTabDisplay()
If Me.ActiveMdiChild Is Nothing Then
TabControl1.Visible = False
Else
TabControl1.Visible = True
End If
End Sub
Private Sub frmMain_Activated(sender As Object, e As EventArgs) _
Handles Me.Activated
SetTabDisplay()
End Sub
Private Sub frmMain_MdiChildActivate(sender As Object, e As EventArgs) _
Handles Me.MdiChildActivate
SetTabDisplay()
End Sub
Private Sub TabControl1_SelectedIndexChanged(sender As Object, _
e As EventArgs) Handles TabControl1.SelectedIndexChanged
If TabControl1.TabPages.Count > 0 Then
TabControl1.Visible = True
Else
TabControl1.Visible = False
End If
If TabControl1.SelectedTab IsNot Nothing Then
For Each frm As Form In Me.MdiChildren
If frm.Name = TabControl1.SelectedTab.Name Then
frm.Show()
frm.Select()
End If
Next
End If
If TabControl1.SelectedTab IsNot Nothing Then
If TabControl1.SelectedTab.Controls.Count > 0 Then
TabControl1.Dock = DockStyle.Fill
Else
TabControl1.Dock = DockStyle.None
End If
End If
End Sub
Public Function isTabExist(ByVal TabCaption As String) As Boolean
Dim bln As Boolean = False
For Each itemTab As TabPage In TabControl1.TabPages
If itemTab.Text = TabCaption Then
bln = True
End If
Next
Return bln
End Function
Function isFormExist(ByVal Caption As String) As Boolean
Dim bln As Boolean = False
For Each frm As Form In Me.MdiChildren
If frm.Text = Caption Then
bln = True
End If
Next
Return bln
End Function
Sub LoadForm(ByVal frm As Form, Optional state As FormWindowState = _
FormWindowState.Maximized)
Try
If isTabExist(frm.Text) = False Then
Dim childTab As TabPage = New TabPage()
childTab.Name = frm.Name
childTab.Text = frm.Text
TabControl1.Dock = DockStyle.None
TabControl1.Height = 25
TabControl1.TabPages.Add(childTab)
TabControl1.SelectTab(childTab)
frm.WindowState = state
frm.MdiParent = Me
frm.Show()
Else
TabControl1_SelectedIndexChanged(Nothing, Nothing)
End If
Catch ex As Exception
MsgBox("LoadForm: " & vbCrLf & ex.Message)
End Try
End Sub
Private Sub Form1ToolStripMenuItem_Click(sender As Object, _
e As EventArgs) Handles Form1ToolStripMenuItem.Click
LoadForm(Form1)
End Sub
Private Sub Form2ToolStripMenuItem_Click(sender As Object, _
e As EventArgs) Handles Form2ToolStripMenuItem.Click
LoadForm(Form2)
End Sub
Private Sub Form3ToolStripMenuItem_Click(sender As Object, _
e As EventArgs) Handles Form3ToolStripMenuItem.Click
LoadForm(Form3)
End Sub
End Class
Code Form1.vb :
Public Class Form1
Private Sub Button1_Click(sender As Object, e As EventArgs) _
Handles Button1.Click
Me.Close()
End Sub
Private Sub Form1_Activated(sender As Object, e As EventArgs) _
Handles Me.Activated
If frmMain.TabControl1.TabPages.ContainsKey(Me.Name) Then
frmMain.TabControl1.SelectTab( _
frmMain.TabControl1.TabPages.IndexOfKey(Me.Name) _
)
End If
End Sub
Private Sub Form1_Disposed(sender As Object, e As EventArgs) _
Handles Me.Disposed
If frmMain.TabControl1.TabPages.ContainsKey(Me.Name) Then
frmMain.TabControl1.TabPages.RemoveByKey(Me.Name)
End If
End Sub
End Class
Code Form2.vb :
Public Class Form2
Private Sub Button1_Click(sender As Object, e As EventArgs) _
Handles Button1.Click
Me.Close()
End Sub
Private Sub Form2_Activated(sender As Object, e As EventArgs) _
Handles Me.Activated
If frmMain.TabControl1.TabPages.ContainsKey(Me.Name) Then
frmMain.TabControl1.SelectTab( _
frmMain.TabControl1.TabPages.IndexOfKey(Me.Name) _
)
End If
End Sub
Private Sub Form2_Disposed(sender As Object, e As EventArgs) _
Handles Me.Disposed
If frmMain.TabControl1.TabPages.ContainsKey(Me.Name) Then
frmMain.TabControl1.TabPages.RemoveByKey(Me.Name)
End If
End Sub
End Class
Code Form3.vb :
Public Class Form3
Private Sub Button1_Click(sender As Object, e As EventArgs) _
Handles Button1.Click
Me.Close()
End Sub
Private Sub Form3_Activated(sender As Object, e As EventArgs) _
Handles Me.Activated
If frmMain.TabControl1.TabPages.ContainsKey(Me.Name) Then
frmMain.TabControl1.SelectTab( _
frmMain.TabControl1.TabPages.IndexOfKey(Me.Name) _
)
End If
End Sub
Private Sub Form3_Disposed(sender As Object, e As EventArgs) _
Handles Me.Disposed
If frmMain.TabControl1.TabPages.ContainsKey(Me.Name) Then
frmMain.TabControl1.TabPages.RemoveByKey(Me.Name)
End If
End Sub
End Class
Kita coba run debug. Saat beberapa form dibuka sekaligus melalui menu maka form-form tersebut akan tampil dalam tab seperti berikut:
0 Comments