Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Vertical Tab Control with horizontal text in Winforms

I would like to have the tabs on my TabControl displayed on the left, or sometimes right.
Unlike the System.Windows.Forms.TabControl, however, I would like the text to remain horizontal instead of being rotated by 90 or 270 degrees to the horizontal.

Here are a couple of pictures illustrating the concept Vertical tabs in Visual StudioVertical tabs in Firefox

Though I could write code to do this myself in about an hour or two, I just thought I'd ask first if there is any existing Winforms control that implements such feature.

NB: Any existing solution should preferably be non-commercial.

Thanks.

like image 211
Alex Essilfie Avatar asked Sep 21 '11 10:09

Alex Essilfie


People also ask

How do I align tabs side by side?

Press the Windows key and press either the right or left arrow key, moving the open window to the screen's left or right position. Choose the other window you want to view next to the window in step one.

What is horizontal tab and vertical tab?

The horizontal tab is usually inserted when the Tab key on a standard keyboard is pressed. A vertical tabulation (VT) also exists and has ASCII decimal character code 11 ( Ctrl + K or ^K), escape character \v . In EBCDIC the code for HT is 5. VT is 11 (coincidentally the same as in ASCII).

What is the use of vertical tab?

Instead of shrinking down tab names as you open more and more tabs, vertical tabs let you see the full tab name in a cleaner list. In addition to feeling more natural, as we mentioned earlier, this allows you to click and drag your tabs from top to bottom in an order you see fit.


1 Answers

I don't know how robust this is and I can't claim to have created it but... http://www.dreamincode.net/forums/topic/125792-how-to-make-vertical-tabs/

Here's a way of doing it.

So first we are going to change its alignment to Left, by setting the property:

Alignment = Left

If you have XP themes turned on then you may notice the weird layout of Tab Control. Don't worry we will make it fine.

As you may have noticed that Tabs are vertical, and our requirement is horizontal. So we can change the size of Tabs. But before we can do this we have to set the SizeMode property as,

SizeMode = Fixed

Now we can change the size by using the ItemSize property,

ItemSize = 30, 120 Width = 30 and Height = 120

After setting the Alignment = Left, Tab control rotates the Tabs which causes the Width and Height seem to be reversed. That is why when we increase Height, we see that width is increasing and when we increase width the height is effected.

Now Text will also be displaying, but vertically. Unfortunately there is no simple way to resolve this issue. For this purpose we have to write the Text by ourselves. To do this we will first set the DrawMode

DrawMode = OwnerDrawFixed

01

Private Sub TabControl1_DrawItem(ByVal sender As Object, ByVal e As System.Windows.Forms.DrawItemEventArgs) Handles TabControl1.DrawItem
    Dim g As Graphics
    Dim sText As String

    Dim iX As Integer
    Dim iY As Integer
    Dim sizeText As SizeF

    Dim ctlTab As TabControl

    ctlTab = CType(sender, TabControl)

    g = e.Graphics

    sText = ctlTab.TabPages(e.Index).Text
    sizeText = g.MeasureString(sText, ctlTab.Font)

    iX = e.Bounds.Left + 6
    iY = e.Bounds.Top + (e.Bounds.Height - sizeText.Height) / 2

    g.DrawString(sText, ctlTab.Font, Brushes.Black, iX, iY)
End Sub
like image 107
Rob P. Avatar answered Oct 05 '22 03:10

Rob P.