.NET開発者のためのブログメディア

タブコントロールを使ってみよう!VB.NETでのタブの作成方法をご解説
- SE
- ページの切り替え方法について教えてください。
- PM
- タブコントロールという方法があります。詳しくみていきましょう。
目次
VB.NETのタブコントロールについて
今回は、VB.NETのタブコントロールについて説明します。タブコントロールを使えばページを切り替えるようなことができます。タブの作成・追加・削除・変更イベント・色変更などについて紹介します。
VB.NETのタブコントロールに興味のある方はぜひご覧ください。
タブの作成
VB.NETでタブを作成するには、タブコントロールを使用します。
実際のソースコードを見てみましょう。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 |
Public Class Form1 Dim tabControl As TabControl Sub New() tabControl = New TabControl() tabControl.Location = New Point(10, 10) Dim tabPage As TabPage = New TabPage() tabPage.Name = ""tab1"" tabPage.Text = ""tab1"" tabControl.TabPages.Add(tabPage) tabPage = New TabPage() tabPage.Name = ""tab2"" tabPage.Text = ""tab2"" tabControl.TabPages.Add(tabPage) ' 選択タブの設定 tabControl.SelectedIndex = 1 Me.Controls.Add(tabControl) End Sub End Class |
実行すると、タブの切り替えができることが分かります。
タブの追加
VB.NETでタブを追加するには、タブコントロールにTabPageを追加します。
実際のソースコードを見てみましょう。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 |
Public Class Form1 Dim tabControl As TabControl Dim button1 As Button Dim tabCount As Integer Sub New() tabControl = New TabControl() tabControl.Location = New Point(10, 10) Dim tabPage As TabPage = New TabPage() tabPage.Name = ""tab1"" tabPage.Text = ""tab1"" tabControl.TabPages.Add(tabPage) tabPage = New TabPage() tabPage.Name = ""tab2"" tabPage.Text = ""tab2"" tabControl.TabPages.Add(tabPage) button1 = New Button() button1.Location = New Point(10, 150) button1.Text = ""Add"" AddHandler Me.Load, AddressOf Form1_Load AddHandler Me.button1.Click, AddressOf Button1_Click Me.Controls.Add(button1) Me.Controls.Add(tabControl) End Sub Private Sub Form1_Load(ByVal sender As Object, ByVal e As EventArgs) tabCount = tabControl.TabCount End Sub Private Sub Button1_Click(ByVal sender As Object, ByVal e As EventArgs) ' タブの追加 tabCount = tabCount + 1 Dim tabPage As TabPage = New TabPage() tabPage.Name = ""tab"" + tabCount.ToString() TabPage.Text = ""tab"" + tabCount.ToString() tabControl.TabPages.Add(TabPage) tabControl.SelectedIndex = tabControl.TabCount - 1 End Sub End Class |
tabCountをインクリメントし、タブ名にしています。Addボタンをクリックするとタブが追加され、追加されたタブが選択されることが分かります。
このように、VB.NETでタブを追加するには、タブコントロールにTabPageを追加します。
タブの削除
VB.NETでタブを削除するには、タブコントロールからTabPageを削除します。
実際のソースコードを見てみましょう。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 |
Public Class Form1 Dim tabControl As TabControl Dim button1, button2 As Button Dim tabCount As Integer Sub New() tabControl = New TabControl() tabControl.Location = New Point(10, 10) Dim tabPage As TabPage = New TabPage() tabPage.Name = ""tab1"" tabPage.Text = ""tab1"" tabControl.TabPages.Add(tabPage) tabPage = New TabPage() tabPage.Name = ""tab2"" tabPage.Text = ""tab2"" tabControl.TabPages.Add(tabPage) button1 = New Button() button1.Location = New Point(10, 150) button1.Text = ""Add"" button2 = New Button() button2.Location = New Point(100, 150) button2.Text = ""Del"" AddHandler Me.Load, AddressOf Form1_Load AddHandler Me.button1.Click, AddressOf Button1_Click AddHandler Me.button2.Click, AddressOf Button2_Click Me.Controls.Add(button1) Me.Controls.Add(button2) Me.Controls.Add(tabControl) End Sub Private Sub Form1_Load(ByVal sender As Object, ByVal e As EventArgs) tabCount = tabControl.TabCount End Sub Private Sub Button1_Click(ByVal sender As Object, ByVal e As EventArgs) ' タブの追加 tabCount = tabCount + 1 Dim tabPage As TabPage = New TabPage() tabPage.Name = ""tab"" + tabCount.ToString() TabPage.Text = ""tab"" + tabCount.ToString() tabControl.TabPages.Add(TabPage) tabControl.SelectedIndex = tabControl.TabCount - 1 ' タブがあればDelボタン有効 If Not button2.Enabled Then button2.Enabled = True End If End Sub Private Sub Button2_Click(ByVal sender As Object, ByVal e As EventArgs) ' 選択中タブの削除 tabControl.TabPages.Remove(tabControl.SelectedTab) ' タブがなければDelボタン無効 If tabControl.TabCount = 0 Then button2.Enabled = False tabCount = 0 Else tabControl.SelectedIndex = tabControl.TabCount - 1 End If End Sub End Class |
Delボタンをクリックするとタブが削除されることが分かります。
このように、VB.NETでタブを削除するには、タブコントロールからTabPageを削除します。
タブの変更イベント
VB.NETでタブの変更を検知するには、タブコントロールのイベントハンドラを利用します。
実際のソースコードを見てみましょう。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 |
Public Class Form1 Dim tabControl As TabControl Dim button1, button2 As Button Dim tabCount As Integer Sub New() tabControl = New TabControl() tabControl.Location = New Point(10, 10) Dim tabPage As TabPage = New TabPage() tabPage.Name = ""tab1"" tabPage.Text = ""tab1"" tabControl.TabPages.Add(tabPage) tabPage = New TabPage() tabPage.Name = ""tab2"" tabPage.Text = ""tab2"" tabControl.TabPages.Add(tabPage) button1 = New Button() button1.Location = New Point(10, 150) button1.Text = ""Add"" button2 = New Button() button2.Location = New Point(100, 150) button2.Text = ""Del"" AddHandler Me.Load, AddressOf Form1_Load AddHandler Me.button1.Click, AddressOf Button1_Click AddHandler Me.button2.Click, AddressOf Button2_Click ' 選択イベント AddHandler Me.tabControl.Selected, AddressOf TabControl_Selected Me.Controls.Add(button1) Me.Controls.Add(button2) Me.Controls.Add(tabControl) End Sub Private Sub Form1_Load(ByVal sender As Object, ByVal e As EventArgs) tabCount = tabControl.TabCount End Sub Private Sub Button1_Click(ByVal sender As Object, ByVal e As EventArgs) ' タブの追加 tabCount = tabCount + 1 Dim tabPage As TabPage = New TabPage() tabPage.Name = ""tab"" + tabCount.ToString() TabPage.Text = ""tab"" + tabCount.ToString() tabControl.TabPages.Add(TabPage) tabControl.SelectedIndex = tabControl.TabCount - 1 ' タブがあればDelボタン有効 If Not button2.Enabled Then button2.Enabled = True End If End Sub Private Sub Button2_Click(ByVal sender As Object, ByVal e As EventArgs) ' 選択中タブの削除 tabControl.TabPages.Remove(tabControl.SelectedTab) ' タブがなければDelボタン無効 If tabControl.TabCount = 0 Then button2.Enabled = False tabCount = 0 End If End Sub Private Sub TabControl_Selected(ByVal sender As Object, ByVal e As TabControlEventArgs) ' 選択されたタブ情報の出力 Console.WriteLine(tabControl.SelectedTab) End Sub End Class |
TabControlのSelectedで、タブ変更が検出され、コンソール出力されることが分かります。また、現在のタブが変更されると、「Deselecting」、「Deselected」、「Selecting」、「Selected」イベントが順番に発生します。
このように、VB.NETでタブの変更を検知するには、タブコントロールのイベントハンドラを利用します。
タブの色変更
タブの色(文字色・背景色)を変更することもできます。
実際のソースコードを見てみましょう。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 |
Public Class Form1 Dim tabControl As TabControl Dim button1, button2 As Button Dim tabCount As Integer Sub New() tabControl = New TabControl() tabControl.Location = New Point(10, 10) Dim tabPage As TabPage = New TabPage() tabPage.Name = ""tab1"" tabPage.Text = ""tab1"" tabControl.TabPages.Add(tabPage) tabPage = New TabPage() tabPage.Name = ""tab2"" tabPage.Text = ""tab2"" tabControl.TabPages.Add(tabPage) button1 = New Button() button1.Location = New Point(10, 150) button1.Text = ""Add"" button2 = New Button() button2.Location = New Point(100, 150) button2.Text = ""Del"" AddHandler Me.Load, AddressOf Form1_Load AddHandler Me.button1.Click, AddressOf Button1_Click AddHandler Me.button2.Click, AddressOf Button2_Click AddHandler Me.tabControl.Selected, AddressOf TabControl_Selected AddHandler Me.tabControl.DrawItem, AddressOf TabControl_DrawItem Me.Controls.Add(button1) Me.Controls.Add(button2) Me.Controls.Add(tabControl) End Sub Private Sub Form1_Load(ByVal sender As Object, ByVal e As EventArgs) tabCount = tabControl.TabCount tabControl.DrawMode = TabDrawMode.OwnerDrawFixed End Sub Private Sub Button1_Click(ByVal sender As Object, ByVal e As EventArgs) ' タブの追加 tabCount = tabCount + 1 Dim tabPage As TabPage = New TabPage() tabPage.Name = ""tab"" + tabCount.ToString() TabPage.Text = ""tab"" + tabCount.ToString() tabControl.TabPages.Add(TabPage) tabControl.SelectedIndex = tabControl.TabCount - 1 ' タブがあればDelボタン有効 If Not button2.Enabled Then button2.Enabled = True End If End Sub Private Sub Button2_Click(ByVal sender As Object, ByVal e As EventArgs) ' 選択中タブの削除 tabControl.TabPages.Remove(tabControl.SelectedTab) ' タブがなければDelボタン無効 If tabControl.TabCount = 0 Then button2.Enabled = False tabCount = 0 End If End Sub Private Sub TabControl_Selected(ByVal sender As Object, ByVal e As TabControlEventArgs) ' 選択されたタブ情報の出力 Console.WriteLine(tabControl.SelectedTab) End Sub Private Sub TabControl_DrawItem(ByVal sender As Object, ByVal e As DrawItemEventArgs) ' 色ブラシ Dim backSolidBrush, foreSolidBrush As SolidBrush ' 選択中のタブ If tabControl.SelectedIndex = e.Index Then backSolidBrush = New SolidBrush(Color.LightBlue) Else backSolidBrush = New SolidBrush(SystemColors.Control) End If foreSolidBrush = New SolidBrush(Color.Black) ' 背景色の塗潰し e.Graphics.FillRectangle(backSolidBrush, e.Bounds) ' 表示文字列の描画 Dim stringFormat As StringFormat = New StringFormat() stringFormat.Alignment = StringAlignment.Center Dim rect As RectangleF = New RectangleF(e.Bounds.X, e.Bounds.Y + 6, e.Bounds.Width, e.Bounds.Height) e.Graphics.DrawString(tabControl.TabPages(e.Index).Text, tabControl.Font, foreSolidBrush, rect, stringFormat) End Sub End Class |
タブコントロールのDrawItemイベントで、選択されたタブの色情報のみが変わるようにしています。このように、タブの色(文字色・背景色)を変更することもできます。
- SE
- ページを切り替えたり色変更や追加・削除もできるのですね。
- PM
- 大変便利な昨日です。是非ご自身で書いてマスターしてみてください。
VB.NETでのタブの作成方法を知ろう
いかがでしたでしょうか。タブコントロールを使えばページを切り替えるようなことができます。VB.NETでのタブの作成・追加・削除・変更イベント・色変更などについて紹介しました。
ぜひご自身でソースコードを書いて、理解を深めてください。