In WinForms, i have listed toolstripmenu items as below:
We can see that the list of shortcut key is not properly indented.
I have searched for the solution and found to use spaces but I have tried that and it didn't work properly.
So, is it possible to position the shortcut keys as below figure at a certain position for all menu items?
I searched and read a bit about that topic but cound'nt find a working example. So I thought I try to create one. It's not perfect but a base to get started. I didnt try items which have additional subitems for example.
To render menuitems you do not have to override the Items' OnPaint Method. We better use the ToolStripProfessionalRenderer. The renderer will manage everything required to show the menuitems. Therefore we have to create our own class MyToolStripProfessionalRenderer and set the Toolstrip.Renderer Property.
Public Class Form1
Public Sub New()
InitializeComponent()
MenuStrip1.Renderer = New MyToolStripProfessionalRenderer()
End Sub
End Class
Within our class we have to override the OnRenderItemText Method. This method draws the strings for item name and shortcut. The base method is simple and draws the Name with left align and Shortcut with right align. Our custom method should draw the name with left align and the shortcut with left align. therefore we need to find out the proper place to draw the shortcut. I created a loop checking all items shortcut texts to find the item with the highest width. Create a rectangle from it and draw the string in this rectangle.
Note: When using this example, you have to set the ShortcutKeyDisplayString Property in the designer manually because somehow its always null otherwise.
/major edit:
We also have to change the autosize algorithm to set the with of each dropdownmenu.
New Autowidth: Imagewidth + some space + largest Itemtext + some space + largest ShortCutText + some space
Therefore I override the Initialize(toolStrip As System.Windows.Forms.ToolStrip) Method.
First I added a few constants to set the spaces. To calculate the width I fetch through all items and find the largest text of the subitems and then set the new width for the items.
Note: If your dropdownmenu has another dropdownmenu then you have to add recursion.
Imports System.Windows.Forms
Public Class MyToolStripProfessionalRenderer
Inherits ToolStripProfessionalRenderer
Protected iconwidth As Integer = 22 ' the width of image icons
Protected paddingIconToText As Integer = 3
Protected paddingTextToShortCut As Integer = 20
Protected paddingShortCutToBoarder As Integer = 20
Private Enum TextType
Text = 0
Shortcut = 1
End Enum
Protected Overrides Sub OnRenderItemText(e As System.Windows.Forms.ToolStripItemTextRenderEventArgs)
' render only ToolStripMenuItems
If e.Item.IsOnDropDown And TypeOf e.Item Is ToolStripMenuItem Then
Dim MenuItem As ToolStripMenuItem = e.Item
Dim Name As String = MenuItem.Text
Dim Shortcut As String = MenuItem.ShortcutKeyDisplayString
'avoid double draw. The method is called twice for each item, check what should be drawn, Text or Shortcut?
Dim Mode As TextType
If e.Text = Name Then
Mode = TextType.Text
Else
Mode = TextType.Shortcut
End If
If Mode = TextType.Text Then
' this is our column for the menuitem text
Dim FirstColumn As Rectangle = New Rectangle(MenuItem.ContentRectangle.Left + iconwidth + paddingIconToText,
MenuItem.ContentRectangle.Top + 1,
MenuItem.Width - iconwidth - paddingIconToText,
MenuItem.Height)
' drawing the menu item
e.Graphics.DrawString(Name, MenuItem.Font, New SolidBrush(MenuItem.ForeColor), FirstColumn)
' this is the Shortcut to display, be sure to have set it manually
Else
' to align the text on the wanted position, we need to know the width for the shortcuts, this depends also on the other menu items
Dim CurStrip As ToolStrip = MenuItem.GetCurrentParent()
Dim fShortCutWidth As Single = 0
' lets find the other menuitems for this group
For Each item As Object In CurStrip.Items
' lets look for the ToolStripMenuItem only
If TypeOf item Is ToolStripMenuItem Then
Dim ChildItem As ToolStripMenuItem = item
Dim sCurShortcut As String = ChildItem.ShortcutKeyDisplayString
' how many pixels are needed to draw the current shortcut?
Dim size As SizeF = e.Graphics.MeasureString(sCurShortcut, ChildItem.Font)
If size.Width > fShortCutWidth Then
fShortCutWidth = size.Width ' save it for later
End If
End If
Next
' avoid to lose 1 pixel by casting to integer
Dim ShortCutWidth As Integer = Convert.ToInt32(fShortCutWidth) + 1
If fShortCutWidth > 0 Then
' this is our second column for the shortcut text
Dim SecondColumn As Rectangle = New Rectangle(MenuItem.Width - ShortCutWidth - paddingShortCutToBoarder,
MenuItem.ContentRectangle.Top + 1,
ShortCutWidth,
MenuItem.Height)
' drawing the shortcut
e.Graphics.DrawString(Shortcut, MenuItem.Font, New SolidBrush(MenuItem.ForeColor), SecondColumn)
End If
End If
Else ' there might be other items, use the default method
MyBase.OnRenderItemText(e)
End If
End Sub
Protected Overrides Sub Initialize(toolStrip As System.Windows.Forms.ToolStrip)
MyBase.Initialize(toolStrip)
' custom autosize algorithm
' 1: Find all dropdownbuttons
' 2: Get all Menuitems within dropdown
' 3: find the largest string of the dropdownitems text
' 4: find the latgest string of the dropdownitems shortcuttext
' 5: set the width for all items = picture width + padding + longest_itemtext + padding + longest_shortcuttext + padding
For Each item As ToolStripItem In toolStrip.Items ' get all dropdownbuttons
If TypeOf item Is ToolStripDropDownButton Then
Dim btn As ToolStripDropDownButton = item
If btn.HasDropDownItems Then ' dropdownitems
Dim MaxSizeOfItemName As Single = 0
Dim MaxSizeOfShortCutName As Single = 0
Dim CurSizeOfItemName As Single = 0
Dim CurSizeOfShortCutName As Single = 0
For Each child As ToolStripItem In btn.DropDownItems ' menu items within dropdown menu
' find the largest strings of dropdownitems
If TypeOf child Is ToolStripMenuItem Then
Dim CurrentMenuItem As ToolStripMenuItem = child
CurSizeOfItemName = TextRenderer.MeasureText(CurrentMenuItem.Text, child.Font).Width
CurSizeOfShortCutName = TextRenderer.MeasureText(CurrentMenuItem.ShortcutKeyDisplayString, child.Font).Width
MaxSizeOfItemName = Math.Max(MaxSizeOfItemName, CurSizeOfItemName)
MaxSizeOfShortCutName = Math.Max(MaxSizeOfShortCutName, CurSizeOfShortCutName)
End If
Next
If MaxSizeOfItemName > 0 Then
Dim autowidth As Integer = iconwidth + paddingIconToText + Convert.ToInt32(MaxSizeOfItemName) + 1 + paddingTextToShortCut + Convert.ToInt32(MaxSizeOfShortCutName) + 1 + paddingShortCutToBoarder
' it's not enough to set only the dropdownitems' width, also have to change the ToolStripDropDownMenu width
Dim menu As ToolStripDropDownMenu = btn.DropDownItems.Item(0).GetCurrentParent() ' maybe there is a better way to get the menuobject?!
menu.AutoSize = False
menu.Width = autowidth
For Each child As ToolStripItem In btn.DropDownItems
child.AutoSize = False
child.Width = autowidth
Next
End If ' MaxSizeOfItemName
' CAUTION: this works only for the first level of menuitems, if your dropdownmenu has another dropdownmenu, move the code above into a method and add recursion for each dropdownbutton with subitems
End If ' btn.HasDropDownItems
End If ' TypeOf item Is ToolStripDropDownButton
Next 'For Each item As ToolStripItem
End Sub
End Class
Here's another solution in C#
private class MenuRenderer : ToolStripProfessionalRenderer {
Hashtable ht = new Hashtable();
int shortcutTextMargin = 5;
Font cachedFont = null;
protected override void OnRenderItemText(ToolStripItemTextRenderEventArgs e) {
ToolStrip ts = e.Item.Owner;
if (ts.Font != cachedFont) {
cachedFont = ts.Font; // assumes all menu items use the same font
ht.Clear();
}
var mi = e.Item as ToolStripMenuItem;
if (mi != null && mi.ShortcutKeys != (Keys) 0) {
if (e.Text != mi.Text) { // shortcut text
ToolStripMenuItem owner = (ToolStripMenuItem) e.Item.OwnerItem;
e.TextFormat = TextFormatFlags.VerticalCenter;
Size sz = TextRenderer.MeasureText(e.Graphics, e.Text, e.TextFont);
int w = owner.DropDown.Width;
int x = w - (sz.Width + shortcutTextMargin);
int? xShortcut = (int?) ht[owner];
if (!xShortcut.HasValue || x < xShortcut.Value) {
xShortcut = x;
ht[owner] = xShortcut;
owner.DropDown.Invalidate();
}
Rectangle r = e.TextRectangle;
r.X = xShortcut.Value;
e.TextRectangle = r;
}
}
base.OnRenderItemText(e);
}
}
