WPF Menu设计Tips
WPF Menu设计Tips<div id="cnblogs_post_body">(1)Menu的ItemContainerStyle属性,设计的是Menu中最末层的MenuItem(即本身没有子级菜单)的样式;
对以下2种MenuItem无效:
(a)对最顶级的MenuItem无效,如图最顶端的后面2个MenuItem(这2个MenuItem下面没有子MenuItem);
(b)对自身含有子级菜单的MenuItem无效,如图菜单1的第一个MenuItem含有一个子级MenuItem;
ItemContainerStyle="{StaticResource Menu_MenuItemStyle}"
http://pic002.cnblogs.com/images/2012/422053/2012082315093550.jpg
为了让MenuItem模板能根据不同层级的MenuItem自动分配布局,可以用下面几个属性,放在Trigger里面:
<div class="cnblogs_code" >http://images.cnblogs.com/OutliningIndicators/ContractedBlock.gifhttp://images.cnblogs.com/OutliningIndicators/ExpandedBlockStart.gifView Code <div id="cnblogs_code_open_313d7390-85d3-467c-8b48-8fd5e1dd3796" class="cnblogs_code_hide"><ControlTemplate.Triggers> <!-- Role = TopLevelHeader : 菜单中的根级的menuitem,且这个menuitem有子级菜单--> <!-- Role = TopLevelHeader : this is the root menu item in a menu; the Popup expands up --> <Trigger Property="Role" Value="TopLevelHeader"> <Setter Property="Padding" Value="6,1,10,1"/> <Setter Property="Placement" Value="Top" TargetName="SubMenuPopup"/> <Setter Property="MinWidth" Value="0" TargetName="Col0"/> <Setter Property="Width" Value="Auto" TargetName="Col3"/> <Setter Property="CornerRadius" Value="0,20,0,0" TargetName="Border"/> <!--<Setter Property="Visibility" Value="Collapsed" TargetName="Icon"/>--> <Setter Property="Visibility" Value="Collapsed" TargetName="GlyphPanel"/> <Setter Property="Visibility" Value="Collapsed" TargetName="IGTHost"/> <Setter Property="Visibility" Value="Collapsed" TargetName="ArrowPanel"/> </Trigger> <!-- Role = TopLevelItem :菜单中的根级menuitem,且这个menuitem没有子级菜单--> <!-- Role = TopLevelItem :this is a child menu item from the top level without any child items--> <Trigger Property="Role" Value="TopLevelItem"> <!--<Setter Property="Padding" Value="6,1,6,1"/> <Setter Property="Visibility" Value="Collapsed" TargetName="ArrowPanel"/>--> <Setter Property="Padding" Value="6,1,10,1"/> <Setter Property="Placement" Value="Top" TargetName="SubMenuPopup"/> <Setter Property="MinWidth" Value="0" TargetName="Col0"/> <Setter Property="Width" Value="Auto" TargetName="Col3"/> <Setter Property="CornerRadius" Value="0,20,0,0" TargetName="Border"/> <!--<Setter Property="Visibility" Value="Collapsed" TargetName="Icon"/>--> <Setter Property="Visibility" Value="Collapsed" TargetName="GlyphPanel"/> <Setter Property="Visibility" Value="Collapsed" TargetName="IGTHost"/> <Setter Property="Visibility" Value="Collapsed" TargetName="ArrowPanel"/> </Trigger> <!-- Role = SubMenuHeader : 菜单中的子级menuitem,且这个menuitem有子级菜单 --> <!-- Role = SubMenuHeader : this is a child menu item which does not have children --> <Trigger Property="Role" Value="SubmenuHeader"> <Setter Property="DockPanel.Dock" Value="Top"/> <Setter Property="Padding" Value="0,2,0,2"/> </Trigger> <!-- Role = SubMenuItem : 菜单中的子级menuitem,且这个menuitem没有子级菜单--> <!-- Role = SubMenuItem : this is a child menu item which has children--> <Trigger Property="Role" Value="SubmenuItem"> <Setter Property="DockPanel.Dock" Value="Top"/> <Setter Property="Padding" Value="0,2,0,2"/> <Setter Property="Visibility" Value="Collapsed" TargetName="ArrowPanel"/> </Trigger> <!-- IsSuspendingPopupAnimation : 获取菜单是否挂起对其 Popup 控件的动画 --> <Trigger Property="IsSuspendingPopupAnimation" Value="true"> <Setter Property="PopupAnimation" Value="None" TargetName="SubMenuPopup"/> </Trigger> <!-- If no Icon is present the we collapse the Icon Content --> <Trigger Property="Icon" Value="{x:Null}"> <Setter Property="Visibility" Value="Collapsed" TargetName="Icon"/> </Trigger> <!-- Icon和checkmark在Grid的同一列中,一般做法是:如果checkmark的显示优先级高于Icon,所以此处将Icon隐藏 --> <!-- The GlyphPanel contains the CheckMark --> <Trigger Property="IsChecked" Value="true"> <Setter Property="Visibility" Value="Visible" TargetName="GlyphPanel"/> <Setter Property="Visibility" Value="Collapsed" TargetName="Icon"/> </Trigger> <!-- IsHighlighted : 鼠标移动或键盘导航到MenuItem上--> <!-- Using the system colors for the Menu Highlight and IsEnabled--> <Trigger Property="IsHighlighted" Value="true"> <Setter Property="Foreground" Value="Gold"/> <Setter Property="Background" TargetName="Border" Value="{DynamicResource MouseOnBrush}"/> </Trigger> <Trigger Property="IsEnabled" Value="false"> <Setter Property="Foreground" Value="Gray"/> </Trigger> </ControlTemplate.Triggers>
页:
[1]