如何对齐工具栏控件下方的 WPF 工具包拾色器位置

How to align WPF Toolkit Color Picker position just below Toolbar control

问题:如何对齐著名的WPF Toolkit Color Picker position just below to WPF's Toolbar控件?

或者,我们可以在工具栏本身中包含拾色器吗?我的想法是让拾色器在用户单击下面工具栏中显示的 "Color" 按钮时出现,但我可以使用 C# 代码完成。

到目前为止,我已经通过使用如下所示的 XAML 完成了此操作:

XAML:

<Window x:Class="WpfApp_ExceedToolkit_test.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:xctk="http://schemas.xceed.com/wpf/xaml/toolkit"
        xmlns:local="clr-namespace:WpfApp_ExceedToolkit_test"
        mc:Ignorable="d"
        Title="MainWindow" Height="450" Width="800">
    <DockPanel Margin="0,0,660,0">
        <ToolBarTray DockPanel.Dock="Top">
            <ToolBar Height="26">
                <Button Command="New" Content="New" />
                <Button Command="Open" Content="Open" />
                <Button Command="Save" Content="Color" />
            </ToolBar>
        </ToolBarTray>
        <xctk:ColorPicker Name="ColorPicker1" AdvancedButtonHeader="TestColor" Height="15" DisplayColorAndName="True" Margin="0,5,0,358" />
    </DockPanel>
</Window>

Or, could we include Color picker in the toolbar itself?

当然可以:

<ToolBarTray>
    <ToolBar>
        <Button Command="New" Content="New" />
        <Button Command="Open" Content="Open" />
        <xctk:ColorPicker Name="ColorPicker1" 
                          AdvancedButtonHeader="TestColor"
                          DisplayColorAndName="True"/>
    </ToolBar>
</ToolBarTray>

您也可以使用 ToggleButton 打开 Popup:

<ToolBarTray>
    <ToolBar>
        <Button Command="New" Content="New" />
        <Button Command="Open" Content="Open" />
        <ToggleButton x:Name="tb" Content="Save" />
        <Popup IsOpen="{Binding IsChecked, ElementName=tb}"
                       PlacementTarget="{Binding ElementName=tb}"
                       Placement="Bottom"
                       StaysOpen="False">
            <xctk:ColorPicker Name="ColorPicker1" 
                              AdvancedButtonHeader="TestColor"
                              DisplayColorAndName="True" />
        </Popup>
    </ToolBar>
</ToolBarTray>