问题
Figured out how to hide the grippy dots on the left side, now how do I hide that add/remove buttons drop-down arrow on the right side?
回答1:
Google is full with the answer to this:
private void ToolBar_Loaded(object sender, RoutedEventArgs e)
{
ToolBar toolBar = sender as ToolBar;
var overflowGrid = toolBar.Template.FindName("OverflowGrid", toolBar) as FrameworkElement;
if (overflowGrid != null)
{
overflowGrid.Visibility = Visibility.Collapsed;
}
var mainPanelBorder = toolBar.Template.FindName("MainPanelBorder", toolBar) as FrameworkElement;
if (mainPanelBorder != null)
{
mainPanelBorder.Margin = new Thickness(0);
}
}
And assign this method to your toolbar Loaded event.
回答2:
Edit: Closed the gap too.
Edit2: Fixed missing resources.
Alternatively you can use a copy of the style with the earlier mentioned visibility changed and the margin on the right removed, all those resources belong to the style/template:
<LinearGradientBrush x:Key="ToolBarHorizontalBackground" EndPoint="0,1" StartPoint="0,0">
<GradientStop Color="#FFFFFF" Offset="0"/>
<GradientStop Color="#FFFBFF" Offset="0.5"/>
<GradientStop Color="#F7F7F7" Offset="1"/>
</LinearGradientBrush>
<LinearGradientBrush x:Key="ToolBarToggleButtonVerticalBackground" EndPoint="1,0" StartPoint="0,0">
<GradientStop Color="#ECECEC" Offset="0"/>
<GradientStop Color="#DDDDDD" Offset="0.5"/>
<GradientStop Color="#A0A0A0" Offset="1"/>
</LinearGradientBrush>
<SolidColorBrush x:Key="ToolBarButtonHover" Color="#C2E0FF"/>
<SolidColorBrush x:Key="ToolBarGripper" Color="#C6C3C6"/>
<Style x:Key="ToolBarVerticalOverflowButtonStyle" TargetType="{x:Type ToggleButton}">
<Setter Property="Background" Value="{StaticResource ToolBarToggleButtonVerticalBackground}"/>
<Setter Property="MinHeight" Value="0"/>
<Setter Property="MinWidth" Value="0"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type ToggleButton}">
<Border x:Name="Bd" Background="{TemplateBinding Background}" CornerRadius="0,0,3,3" SnapsToDevicePixels="true">
<Canvas HorizontalAlignment="Right" Height="6" Margin="2,7,2,2" SnapsToDevicePixels="true" VerticalAlignment="Bottom" Width="7">
<Path Data="M 1.5 1 L 1.5 6" Stroke="White"/>
<Path Data="M 0.5 0 L 0.5 5" Stroke="{TemplateBinding Foreground}"/>
<Path Data="M 3.5 0.5 L 7 3.5 L 4 6.5 Z" Fill="White"/>
<Path Data="M 3 -0.5 L 6 2.5 L 3 5.5 Z" Fill="{TemplateBinding Foreground}"/>
</Canvas>
</Border>
<ControlTemplate.Triggers>
<Trigger Property="IsMouseOver" Value="true">
<Setter Property="Background" TargetName="Bd" Value="{StaticResource ToolBarButtonHover}"/>
</Trigger>
<Trigger Property="IsKeyboardFocused" Value="true">
<Setter Property="Background" TargetName="Bd" Value="{StaticResource ToolBarButtonHover}"/>
</Trigger>
<Trigger Property="IsEnabled" Value="false">
<Setter Property="Foreground" Value="{StaticResource ToolBarGripper}"/>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
<Style.Triggers>
<DataTrigger Binding="{Binding Source={x:Static SystemParameters.HighContrast}}" Value="true">
<Setter Property="Background" Value="{DynamicResource {x:Static SystemColors.ControlBrushKey}}"/>
</DataTrigger>
</Style.Triggers>
</Style>
<LinearGradientBrush x:Key="ToolBarVerticalBackground" EndPoint="1,0" StartPoint="0,0">
<GradientStop Color="#FFFFFF" Offset="0"/>
<GradientStop Color="#FFFBFF" Offset="0.5"/>
<GradientStop Color="#F7F7F7" Offset="1"/>
</LinearGradientBrush>
<LinearGradientBrush x:Key="ToolBarToggleButtonHorizontalBackground" EndPoint="0,1" StartPoint="0,0">
<GradientStop Color="#ECECEC" Offset="0"/>
<GradientStop Color="#DDDDDD" Offset="0.5"/>
<GradientStop Color="#A0A0A0" Offset="1"/>
</LinearGradientBrush>
<Style x:Key="ToolBarHorizontalOverflowButtonStyle" TargetType="{x:Type ToggleButton}">
<Setter Property="Background" Value="{StaticResource ToolBarToggleButtonHorizontalBackground}"/>
<Setter Property="MinHeight" Value="0"/>
<Setter Property="MinWidth" Value="0"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type ToggleButton}">
<Border x:Name="Bd" Background="{TemplateBinding Background}" CornerRadius="0,3,3,0" SnapsToDevicePixels="true">
<Canvas HorizontalAlignment="Right" Height="7" Margin="7,2,2,2" SnapsToDevicePixels="true" VerticalAlignment="Bottom" Width="6">
<Path Data="M 1 1.5 L 6 1.5" Stroke="White"/>
<Path Data="M 0 0.5 L 5 0.5" Stroke="{TemplateBinding Foreground}"/>
<Path Data="M 0.5 4 L 6.5 4 L 3.5 7 Z" Fill="White"/>
<Path Data="M -0.5 3 L 5.5 3 L 2.5 6 Z" Fill="{TemplateBinding Foreground}"/>
</Canvas>
</Border>
<ControlTemplate.Triggers>
<Trigger Property="IsMouseOver" Value="true">
<Setter Property="Background" TargetName="Bd" Value="{StaticResource ToolBarButtonHover}"/>
</Trigger>
<Trigger Property="IsKeyboardFocused" Value="true">
<Setter Property="Background" TargetName="Bd" Value="{StaticResource ToolBarButtonHover}"/>
</Trigger>
<Trigger Property="IsEnabled" Value="false">
<Setter Property="Foreground" Value="{StaticResource ToolBarGripper}"/>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
<Style.Triggers>
<DataTrigger Binding="{Binding Source={x:Static SystemParameters.HighContrast}}" Value="true">
<Setter Property="Background" Value="{DynamicResource {x:Static SystemColors.ControlBrushKey}}"/>
</DataTrigger>
</Style.Triggers>
</Style>
<SolidColorBrush x:Key="ToolBarMenuBorder" Color="#808080"/>
<SolidColorBrush x:Key="ToolBarSubMenuBackground" Color="#FDFDFD"/>
<Style x:Key="ToolBarThumbStyle" TargetType="{x:Type Thumb}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type Thumb}">
<Border Background="Transparent" Padding="{TemplateBinding Padding}" SnapsToDevicePixels="True">
<Rectangle>
<Rectangle.Fill>
<DrawingBrush TileMode="Tile" Viewbox="0,0,4,4" Viewport="0,0,4,4" ViewportUnits="Absolute" ViewboxUnits="Absolute">
<DrawingBrush.Drawing>
<DrawingGroup>
<GeometryDrawing Brush="White" Geometry="M 1 1 L 1 3 L 3 3 L 3 1 z"/>
<GeometryDrawing Brush="{StaticResource ToolBarGripper}" Geometry="M 0 0 L 0 2 L 2 2 L 2 0 z"/>
</DrawingGroup>
</DrawingBrush.Drawing>
</DrawingBrush>
</Rectangle.Fill>
</Rectangle>
</Border>
<ControlTemplate.Triggers>
<Trigger Property="IsMouseOver" Value="true">
<Setter Property="Cursor" Value="SizeAll"/>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<Style x:Key="ToolBarMainPanelBorderStyle" TargetType="{x:Type Border}">
<Setter Property="Margin" Value="0,0,11,0"/>
<Setter Property="CornerRadius" Value="3,3,3,3"/>
<Style.Triggers>
<DataTrigger Binding="{Binding Source={x:Static SystemParameters.HighContrast}}" Value="true">
<Setter Property="CornerRadius" Value="0,0,0,0"/>
</DataTrigger>
</Style.Triggers>
</Style>
<Style x:Key="ToolBarWithoutOverflowBarStyle" TargetType="{x:Type ToolBar}">
<Setter Property="Background" Value="{StaticResource ToolBarHorizontalBackground}"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type ToolBar}">
<Grid x:Name="Grid" Margin="3,1,1,1" SnapsToDevicePixels="true">
<Grid x:Name="OverflowGrid" HorizontalAlignment="Right" Visibility="Hidden">
<ToggleButton x:Name="OverflowButton" ClickMode="Press" FocusVisualStyle="{x:Null}" IsChecked="{Binding IsOverflowOpen, Mode=TwoWay, RelativeSource={RelativeSource TemplatedParent}}" IsEnabled="{TemplateBinding HasOverflowItems}" Style="{StaticResource ToolBarHorizontalOverflowButtonStyle}"/>
<Popup x:Name="OverflowPopup" AllowsTransparency="true" Focusable="false" IsOpen="{Binding IsOverflowOpen, RelativeSource={RelativeSource TemplatedParent}}" PopupAnimation="{DynamicResource {x:Static SystemParameters.ComboBoxPopupAnimationKey}}" Placement="Bottom" StaysOpen="false">
<Microsoft_Windows_Themes:SystemDropShadowChrome x:Name="Shdw" Color="Transparent">
<Border x:Name="ToolBarSubMenuBorder" BorderBrush="{StaticResource ToolBarMenuBorder}" BorderThickness="1" Background="{StaticResource ToolBarSubMenuBackground}" RenderOptions.ClearTypeHint="Enabled">
<ToolBarOverflowPanel x:Name="PART_ToolBarOverflowPanel" KeyboardNavigation.DirectionalNavigation="Cycle" FocusVisualStyle="{x:Null}" Focusable="true" Margin="2" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" KeyboardNavigation.TabNavigation="Cycle" WrapWidth="200"/>
</Border>
</Microsoft_Windows_Themes:SystemDropShadowChrome>
</Popup>
</Grid>
<Border x:Name="MainPanelBorder" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" Padding="{TemplateBinding Padding}" Style="{StaticResource ToolBarMainPanelBorderStyle}" Margin="0">
<DockPanel KeyboardNavigation.TabIndex="1" KeyboardNavigation.TabNavigation="Local">
<Thumb x:Name="ToolBarThumb" Margin="-3,-1,0,0" Padding="6,5,1,6" Style="{StaticResource ToolBarThumbStyle}" Width="10"/>
<ContentPresenter x:Name="ToolBarHeader" ContentSource="Header" HorizontalAlignment="Center" Margin="4,0,4,0" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="Center"/>
<ToolBarPanel x:Name="PART_ToolBarPanel" IsItemsHost="true" Margin="0,1,2,2" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"/>
</DockPanel>
</Border>
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="IsOverflowOpen" Value="true">
<Setter Property="IsEnabled" TargetName="ToolBarThumb" Value="false"/>
</Trigger>
<Trigger Property="Header" Value="{x:Null}">
<Setter Property="Visibility" TargetName="ToolBarHeader" Value="Collapsed"/>
</Trigger>
<Trigger Property="ToolBarTray.IsLocked" Value="true">
<Setter Property="Visibility" TargetName="ToolBarThumb" Value="Collapsed"/>
</Trigger>
<Trigger Property="HasDropShadow" SourceName="OverflowPopup" Value="true">
<Setter Property="Margin" TargetName="Shdw" Value="0,0,5,5"/>
<Setter Property="SnapsToDevicePixels" TargetName="Shdw" Value="true"/>
<Setter Property="Color" TargetName="Shdw" Value="#71000000"/>
</Trigger>
<Trigger Property="Orientation" Value="Vertical">
<Setter Property="Margin" TargetName="Grid" Value="1,3,1,1"/>
<Setter Property="Style" TargetName="OverflowButton" Value="{StaticResource ToolBarVerticalOverflowButtonStyle}"/>
<Setter Property="Height" TargetName="ToolBarThumb" Value="10"/>
<Setter Property="Width" TargetName="ToolBarThumb" Value="Auto"/>
<Setter Property="Margin" TargetName="ToolBarThumb" Value="-1,-3,0,0"/>
<Setter Property="Padding" TargetName="ToolBarThumb" Value="5,6,6,1"/>
<Setter Property="Margin" TargetName="ToolBarHeader" Value="0,0,0,4"/>
<Setter Property="Margin" TargetName="PART_ToolBarPanel" Value="1,0,2,2"/>
<Setter Property="DockPanel.Dock" TargetName="ToolBarThumb" Value="Top"/>
<Setter Property="DockPanel.Dock" TargetName="ToolBarHeader" Value="Top"/>
<Setter Property="HorizontalAlignment" TargetName="OverflowGrid" Value="Stretch"/>
<Setter Property="VerticalAlignment" TargetName="OverflowGrid" Value="Bottom"/>
<Setter Property="Placement" TargetName="OverflowPopup" Value="Right"/>
<Setter Property="Margin" TargetName="MainPanelBorder" Value="0,0,0,11"/>
<Setter Property="Background" Value="{StaticResource ToolBarVerticalBackground}"/>
</Trigger>
<Trigger Property="IsEnabled" Value="false">
<Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}"/>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
<Style.Triggers>
<DataTrigger Binding="{Binding Source={x:Static SystemParameters.HighContrast}}" Value="true">
<Setter Property="Background" Value="{DynamicResource {x:Static SystemColors.ControlBrushKey}}"/>
</DataTrigger>
</Style.Triggers>
</Style>
After you embedded that somewhere you can set the style of the toolbar:
<ToolBar Style="{DynamicResource ToolBarWithoutOverflowBarStyle}"/>
回答3:
Assign following method to your toolbar SizeChanged event.
private void ToolBar_SizeChanged(object sender, SizeChangedEventArgs e)
{
ToolBar toolBar = sender as ToolBar;
var overflowGrid = toolBar.Template.FindName("OverflowGrid", toolBar) as FrameworkElement;
if (overflowGrid != null)
{
overflowGrid.Visibility = toolBar.HasOverflowItems ? Visibility.Visible : Visibility.Collapsed;
}
var mainPanelBorder = toolBar.Template.FindName("MainPanelBorder", toolBar) as FrameworkElement;
if (mainPanelBorder != null)
{
var defaultMargin = new Thickness(0, 0, 11, 0);
mainPanelBorder.Margin = toolBar.HasOverflowItems ?defaultMargin: new Thickness(0);
}
}
回答4:
I'm not very sure that you actually need a toolbar or kind of a component looks like a menubar. Here is just what I want:
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<Menu Grid.Row="0">
<MenuItem Header="Menu1" Padding="10 4">
<MenuItem Header="MenuItem1"/>
<MenuItem Header="MenuItem2"/>
</MenuItem>
<MenuItem Header="Menu2" Padding="10 4">
<MenuItem Header="MenuItem1"/>
<MenuItem Header="MenuItem2"/>
</MenuItem>
</Menu>
<...>
</Grid>
It may not fit to your case. Just I would like to share mine.
回答5:
I have searching four hours to do this correctly with MVVM (so no code behind).
The most important thing is the "visibility collapsed" after ToggleButton and after ToolBarOverflowPanel (I have set the background color to black for my nav example).
Here is the code that you can set on your toolbar by "<toolbar Style="{StaticResource ToolBar}" Background="Black">...</ToolBar>
Here is the code for the style:
<Style x:Key="Toolbar" TargetType="{x:Type ToolBar}">
<Setter Property="SnapsToDevicePixels" Value="true"/>
<Setter Property="OverridesDefaultStyle" Value="true"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type ToolBar}">
<Border x:Name="Border" CornerRadius="2" BorderThickness="1" Background="Black" BorderBrush="Black">
<DockPanel >
<ToggleButton Visibility="Collapsed" DockPanel.Dock="Right" IsEnabled="False" IsChecked="False" ClickMode="Press">
<Popup x:Name="OverflowPopup" AllowsTransparency="true" Placement="Bottom" IsOpen="{Binding Path=IsOverflowOpen,RelativeSource={RelativeSource TemplatedParent}}" StaysOpen="false" Focusable="false" PopupAnimation="Slide">
<Border x:Name="DropDownBorder" Background="pink" BorderThickness="1" BorderBrush="pink">
<ToolBarOverflowPanel x:Name="PART_ToolBarOverflowPanel" Margin="2" WrapWidth="200" Focusable="true" FocusVisualStyle="{x:Null}" KeyboardNavigation.TabNavigation="Cycle" KeyboardNavigation.DirectionalNavigation="Cycle" Visibility="Collapsed"/>
</Border>
</Popup>
</ToggleButton>
<ToolBarPanel x:Name="PART_ToolBarPanel" IsItemsHost="true" Margin="0,1,2,2"/>
</DockPanel>
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
来源：https://stackoverflow.com/questions/4662428/how-to-hide-arrow-on-right-side-of-a-toolbar