Question

I want to extend the WPF Combobox in a way that two buttons are displayed next to the combobox. I cannot use a UserControl, because I need to specify the items of the combobox in pure xaml like this:

<CustomComboBox>
   <CustomComboBoxItem />
   <CustomComboBoxItem />
</CustomComboBox>

I’m quite scared to take the template of the combobox and extend it, because for comboboxes it is very large and complex. I’m looking for an easy and simple solution to create that kind of ComboBox-like ItemsControl with just two buttons attached to it. Suggestions welcome!

Answer 1

Edit: Conrete example using a UserControl:

Xaml:

<UserControl x:Class="Test.CustomComboBox"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
             mc:Ignorable="d" 
             d:DesignHeight="300" d:DesignWidth="300">
    <StackPanel Orientation="Horizontal">
        <ComboBox Name="_comboBox" Margin="5"/>
        <Button Content="_Apply" Padding="3"  Margin="5" Click="Button_Apply_Click"/>
        <Button Content="_Reset" Padding="3"  Margin="5" Click="Button_Reset_Click"/>
    </StackPanel>
</UserControl>

Code:

[ContentProperty("Items")]
public partial class CustomComboBox : UserControl
{
    public event RoutedEventHandler ApplyClick;
    public event RoutedEventHandler ResetClick;

    public ItemCollection Items
    {
        get { return _comboBox.Items; }
        set
        {
            _comboBox.Items.Clear();
            foreach (var item in value)
            {
                _comboBox.Items.Add(item);
            }
        }
    }

    public CustomComboBox()
    {
        InitializeComponent();
    }

    private void Button_Apply_Click(object sender, RoutedEventArgs e)
    {
        if (ApplyClick != null)
        {
            ApplyClick(sender, e);
        }
    }

    private void Button_Reset_Click(object sender, RoutedEventArgs e)
    {
        if (ResetClick != null)
        {
            ResetClick(sender, e);
        }
    }
}

Usage:

 <local:CustomComboBox ApplyClick="Button2_Click">
     <ComboBoxItem Content="Item1"/>
     <ComboBoxItem Content="Item2"/>
     <ComboBoxItem Content="Item3"/>
 </local:CustomComboBox>

Appearance:

---

A UserControl should do fine, you can still specify the items in Xaml markup, e.g. if i have a time user control i can do this:

[ContentProperty("Hours")]
public partial class TimeBox : UserControl
{
    public string Hours
    {
        get { return this.TBHours.Text; }
        set { this.TBHours.Text = value; }
    }

    ...
}

That way you can set the hours in XAML:

        <local:TimeBox>
            <sys:String>24</sys:String>
        </local:TimeBox>

You should be able to adapt this to set the items of your ComboBox.