#506 – Using a ComboBox as GroupBox Header

Because the GroupBox.Header property can be set to any object, you could host a control in the header of the GroupBox.  In the example below, we specify a ComboBox for the Header and then bind the various fields to the selected item.

    <GroupBox Margin="15">
        <GroupBox.Header>
            <ComboBox Name="cboDogs" ItemsSource="{Binding Dogs}" DisplayMemberPath="Name"
                      SelectedIndex="0"
                      SelectedValue="{Binding SelectedDog}"
                      SelectedValuePath=""/>
        </GroupBox.Header>
        <Grid Margin="10" DataContext="{Binding SelectedDog}">
            <Grid.RowDefinitions>
                <RowDefinition Height="Auto"/>
                <RowDefinition Height="Auto"/>
                <RowDefinition/>
            </Grid.RowDefinitions>
            <Grid.ColumnDefinitions>
                <ColumnDefinition/>
                <ColumnDefinition/>
            </Grid.ColumnDefinitions>

            <Label Grid.Row="0" Grid.Column="0" Content="Name:" FontWeight="Bold" HorizontalAlignment="Right"/>
            <Label Grid.Row="0" Grid.Column="1" Content="{Binding Name}"/>
            <Label Grid.Row="1" Grid.Column="0" Content="Age:" FontWeight="Bold" HorizontalAlignment="Right"/>
            <Label Grid.Row="1" Grid.Column="1" Content="{Binding Age}" />
            <Label Grid.Row="2" Grid.Column="0" Content="Hobby:" FontWeight="Bold" HorizontalAlignment="Right"/>
            <Label Grid.Row="2" Grid.Column="1" Content="{Binding Hobby}"/>
        </Grid>
    </GroupBox>
    public partial class Window1 : Window, INotifyPropertyChanged
    {
        public Window1()
        {
            InitializeComponent();
            this.DataContext = this;

            Dogs = new ObservableCollection<Dog>();
            Dogs.Add(new Dog("Lassie", 12, "Saving people"));
            Dogs.Add(new Dog("Rin Tin Tin", 52, "War dog"));
            Dogs.Add(new Dog("Benji", 18, "Befriends strays"));
            OnPropertyChanged("Dogs");
        }

        public ObservableCollection<Dog> Dogs { get; protected set; }

        private Dog selectedDog;
        public Dog SelectedDog {
            get
            {
                return selectedDog;
            }
            set
            {
                if (value != selectedDog)
                {
                    selectedDog = value;
                    OnPropertyChanged("SelectedDog");
                }
            }
        }

        public event PropertyChangedEventHandler PropertyChanged = delegate { };

        private void OnPropertyChanged(string prop)
        {
            PropertyChanged(this, new PropertyChangedEventArgs(prop));
        }
    }

About Sean
Software developer in the Twin Cities area, passionate about software development and sailing.

9 Responses to #506 – Using a ComboBox as GroupBox Header

  1. Pingback: Dew Drop – March 2, 2012 (#1,278) | Alvin Ashcraft's Morning Dew

  2. Tomi Halonen says:

    I wish you could put the whole code here. Now I’m stumbling with this one.

    • Sean says:

      Tomi,

      I created a new WPF application (in VS 2010), dropped the two code fragments from the post into it, and added your Dog class implementation. Everything worked fine. What are you having trouble with?

      Sean

  3. Tomi Halonen says:


    using System.Collections.ObjectModel;
    using System.ComponentModel;

    public class Dog
    {
    private string name;
    public string Name
    {
    get { return name; }
    set { name = value; }
    }

    private int age;
    public int Age
    {
    get { return age; }
    set { age = value; }
    }

    private string hobby;
    public string Hobby
    {
    get { return hobby; }
    set { hobby = value; }
    }

    public Dog(string name, int age, string hobby)
    {
    Name = name;
    Age = age;
    Hobby = hobby;
    }
    }

  4. Mitch says:

    I’m new to XAML, so this example really helped me a lot. I was able to mold it to my needs. It sort of caused me to rethink my approach and was actually much simpler than my initial attempts.

    Thank you.

Leave a comment