WPF技术疑问：如何将Button作为ComboBoxItem使用？

需求场景 #

希望直接在XAML中（而非通过ViewModel填充）将多个Button放入ComboBox，点击按钮时直接执行对应的Command：

<ComboBox>
    <Button Command="{Binding PerformAction1}" Content="Action1" />
    <Button Command="{Binding PerformAction2}" Content="Action2" />
</ComboBox>

遇到的问题 #

1. 点击按钮时ComboBoxItem未被选中
   尝试通过修改ItemTemplate添加点击回调，但逻辑存在错误：

<ComboBox.ItemTemplate>
    <DataTemplate>
        <Button Click="Button_Click" Content="{Binding}" />
    </DataTemplate>
</ComboBox.ItemTemplate>

private void Button_Click(object sender, RoutedEventArgs e)
{
    var button = sender as Button;

    var content = button.Content as Button; // 此处逻辑错误，Content并非Button类型

    //content.Command.Execute(null); // content.Command为null，无法执行

    var cbi = UIHelpers.FindParent<ComboBoxItem>(button);

    cbi.IsSelected = true;
}

2. Command绑定无法执行，后台也无法获取到Command

解决方案 #

问题1：选中对应的ComboBoxItem #

直接往ComboBox里添加Button时，每个Button会被自动包装成ComboBoxItem。点击按钮时，只需找到该Button所在的ComboBoxItem并设置选中即可：

private void Button_Click(object sender, RoutedEventArgs e)
{
    var button = sender as Button;
    if (button == null) return;

    // 查找当前Button所在的ComboBoxItem
    var comboBoxItem = FindVisualParent<ComboBoxItem>(button);
    if (comboBoxItem != null)
    {
        comboBoxItem.IsSelected = true;
    }
}

// 通用可视化树父元素查找方法
private T FindVisualParent<T>(DependencyObject child) where T : DependencyObject
{
    var parent = VisualTreeHelper.GetParent(child);
    while (parent != null && !(parent is T))
    {
        parent = VisualTreeHelper.GetParent(parent);
    }
    return parent as T;
}

问题2：确保Command正常执行 #

最初的写法中，Command绑定本身有效，但点击按钮时ComboBox会先收起下拉框，干扰Command执行。可以通过以下两种方式解决：

方式1：阻止事件冒泡

在按钮点击事件中标记事件已处理，避免ComboBox触发下拉收起逻辑：

private void Button_Click(object sender, RoutedEventArgs e)
{
    var button = sender as Button;
    if (button == null) return;

    var comboBoxItem = FindVisualParent<ComboBoxItem>(button);
    if (comboBoxItem != null)
    {
        comboBoxItem.IsSelected = true;
    }

    // 执行按钮绑定的Command
    button.Command?.Execute(button.CommandParameter);

    // 阻止事件冒泡，避免ComboBox收起下拉框
    e.Handled = true;
}

方式2：重构ItemTemplate（更推荐）

不直接将Button作为ComboBox的Item，而是定义数据项模板，让结构更清晰，同时避免可视化树层级问题：

1. 定义数据类：

public class ActionItem
{
    public string DisplayName { get; set; }
    public ICommand Command { get; set; }
}

2. 修改XAML：

<ComboBox x:Name="ActionComboBox">
    <ComboBox.ItemTemplate>
        <DataTemplate>
            <Button Command="{Binding Command}" 
                    Content="{Binding DisplayName}"
                    Click="ActionButton_Click"/>
        </DataTemplate>
    </ComboBox.ItemTemplate>
    <!-- 在XAML中直接填充数据项 -->
    <local:ActionItem DisplayName="Action1" Command="{Binding PerformAction1}"/>
    <local:ActionItem DisplayName="Action2" Command="{Binding PerformAction2}"/>
</ComboBox>

3. 处理按钮点击事件：

private void ActionButton_Click(object sender, RoutedEventArgs e)
{
    var button = sender as Button;
    if (button == null) return;

    var actionItem = button.DataContext as ActionItem;
    if (actionItem != null)
    {
        ActionComboBox.SelectedItem = actionItem;
        actionItem.Command?.Execute(null);
    }

    e.Handled = true;
}

内容的提问来源于stack exchange，提问作者Ludovic Wagner