Color of OverFlowButton in WPF toolbar

There was a problem. When I change the background color of WPF toolbar Overflow Button in the right corner does not开发者_如何转开发 change color. How to fix it?

Example: alt text http://biztimes.ru/toolbar.jpg

The overflow button unfortunately has a fixed background. More precisely, it is set to a static value in the default template. See this MSDN forum thread or MSDN if you want to get a copy of them. Or This tool from Chris Sells

In the template, you'll see a ToggleButton, that is used to show/hide the overflow panel. This is the one to change to have the effect that you are looking for.

So, the answer to your question is that you need to include the full style of the toolbar in your XAML and change the background of the button to be the same as the rest of the toolbar.

I had the same problem you described above. My solution is the following:

using System.Windows.Controls.Primitives;
using System.Windows.Media;

namespace WPF.Controls
{
    public class ToolBar : System.Windows.Controls.ToolBar
    {
        public override void OnApplyTemplate()
        {
            base.OnApplyTemplate();

            var overflowPanel = base.GetTemplateChild("PART_ToolBarOverflowPanel") as ToolBarOverflowPanel;
            if (overflowPanel != null)
            {
                overflowPanel.Background = OverflowPanelBackground ?? Background;
                overflowPanel.Margin = new Thickness(0);
            }
        }

        public Brush OverflowPanelBackground
        {
            get;
            set;
        }
    }
}

XAML sample:

<Window
    x:Class="WPF.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:src="clr-namespace:WPF.Controls">

<ToolBarTray Background="White">
    <wpf:ToolBar Background="Pink" OverflowPanelBackground="Peru" Band="1" BandIndex="1" Width="50">
        <Button Content="Cut" />
        <Button Content="Copy" />
        <Button Content="Paste" />
    </wpf:ToolBar>
    <wpf:ToolBar Background="Aqua" Band="2" BandIndex="1" Width="70">
        <Button Content="Undo" />
        <Button Content="Redo" />
    </wpf:ToolBar>
    <wpf:ToolBar OverflowPanelBackground="Yellow" Band="2" BandIndex="2" Width="100">
        <Button Content="Paint"/>
        <Button Content="Spell"/>
        <Separator/>
        <Button Content="Save"/>
        <Button Content="Open"/>
    </wpf:ToolBar>
</ToolBarTray>

</Window>

Alex's answer is good. Another way to modify the color of the OverflowButton and OverflowPanel is to modify them in the loaded event.

XAML

<ToolBar Loaded="ToolBar_Loaded">

Code behind:

private void ToolBar_Loaded(object sender, RoutedEventArgs e)
{
    ToolBar toolBar = sender as ToolBar;
    var overflowGrid = toolBar.Template.FindName("OverflowGrid", toolBar) as Grid;
    if (overflowGrid != null)
    {
        overflowGrid.Background = Brushes.Red;
    }

    var overflowButton = toolBar.Template.FindName("OverflowButton", toolBar) as ToggleButton;
    if (overflowButton != null)
    {
        overflowButton.Background = Brushes.Red;
    }

    var overflowPanel = toolBar.Template.FindName("PART_ToolBarOverflowPanel", toolBar) as ToolBarOverflowPanel;
    if (overflowPanel != null)
    {
        overflowPanel.Background = Brushes.Red;
    }
}

The names (OverflowGrid, OverflowButton, and PART_ToolBarOverflowPanel) can be found in the default control template, which could be downloaded from WPF's GitHub page.