方法: TabControl で Side-Aligned タブを表示する

TabControl の Alignment プロパティでは、タブを水平方向 (コントロールの上端または下部) ではなく、垂直方向 (コントロールの左端または右端に沿って) 表示できます。 既定では、TabPage オブジェクトの Text プロパティは表示スタイルが有効になっているとタブに表示されないため、この垂直表示ではユーザー エクスペリエンスが低下します。 また、タブ内のテキストの方向を直接制御する方法もありません。このエクスペリエンスを向上させるには、TabControl で所有者描画を使用できます。

次の手順では、「所有者描画」機能を使用して、タブ テキストを左から右に表示し、右揃えのタブをレンダリングする方法を示します。

右揃えのタブを表示するには

1. フォームに TabControl を追加します。

2. Alignment プロパティを Rightに設定します。

3. すべてのタブが同じ幅になるように、SizeMode プロパティを Fixedに設定します。

4. ItemSize プロパティをタブの推奨固定サイズに設定します。 ItemSize プロパティは、まるでタブが上部にあるかのように動作しますが、実際にはタブは右揃えです。 その結果、タブの幅を広げるには、Height プロパティを変更する必要があります。また、タブを高くするには、Width プロパティを変更する必要があります。

   次のコード例で最適な結果を得るために、タブの Width を 25 に、Height を 100 に設定します。

5. DrawMode プロパティを OwnerDrawFixedに設定します。

6. テキストを左から右にレンダリングする TabControl の DrawItem イベントのハンドラーを定義します。

   public Form1()
   {
       // Remove this call if you do not program using Visual Studio.
       InitializeComponent();
   
       tabControl1.DrawItem += new DrawItemEventHandler(tabControl1_DrawItem);
   }
   
   private void tabControl1_DrawItem(Object sender, System.Windows.Forms.DrawItemEventArgs e)
   {
       Graphics g = e.Graphics;
       Brush _textBrush;
   
       // Get the item from the collection.
       TabPage _tabPage = tabControl1.TabPages[e.Index];
   
       // Get the real bounds for the tab rectangle.
       Rectangle _tabBounds = tabControl1.GetTabRect(e.Index);
   
       if (e.State == DrawItemState.Selected)
       {
   
           // Draw a different background color, and don't paint a focus rectangle.
           _textBrush = new SolidBrush(Color.Red);
           g.FillRectangle(Brushes.Gray, e.Bounds);
       }
       else
       {
           _textBrush = new System.Drawing.SolidBrush(e.ForeColor);
           e.DrawBackground();
       }
   
       // Use our own font.
       Font _tabFont = new Font("Arial", 10.0f, FontStyle.Bold, GraphicsUnit.Pixel);
   
       // Draw string. Center the text.
       StringFormat _stringFlags = new StringFormat();
       _stringFlags.Alignment = StringAlignment.Center;
       _stringFlags.LineAlignment = StringAlignment.Center;
       g.DrawString(_tabPage.Text, _tabFont, _textBrush, _tabBounds, new StringFormat(_stringFlags));
   }
   

   Private Sub TabControl1_DrawItem(ByVal sender As Object, ByVal e As System.Windows.Forms.DrawItemEventArgs) Handles TabControl1.DrawItem
       Dim g As Graphics = e.Graphics
       Dim _TextBrush As Brush
   
       ' Get the item from the collection.
       Dim _TabPage As TabPage = TabControl1.TabPages(e.Index)
   
       ' Get the real bounds for the tab rectangle.
       Dim _TabBounds As Rectangle = TabControl1.GetTabRect(e.Index)
   
       If (e.State = DrawItemState.Selected) Then
           ' Draw a different background color, and don't paint a focus rectangle.
           _TextBrush = New SolidBrush(Color.Red)
           g.FillRectangle(Brushes.Gray, e.Bounds)
       Else
           _TextBrush = New System.Drawing.SolidBrush(e.ForeColor)
           e.DrawBackground()
       End If
   
       ' Use our own font.
       Dim _TabFont As New Font("Arial", 10.0, FontStyle.Bold, GraphicsUnit.Pixel)
   
       ' Draw string. Center the text.
       Dim _StringFlags As New StringFormat()
       _StringFlags.Alignment = StringAlignment.Center
       _StringFlags.LineAlignment = StringAlignment.Center
       g.DrawString(_TabPage.Text, _TabFont, _TextBrush, _TabBounds, New StringFormat(_StringFlags))
   End Sub
   

関連項目

• TabControl コントロール