Header inside itemscontrol

Question

I have a table which contains food types. Each food type has 12 rows per person.

What I need to do is after selecting a person, an itemscontrol will show the 12 rows for each food type.

I have been successful up to this point, but what I would like is a heading above each 12 rows stating the food type, without repeating it on each row.

Does anyone know a way to accomplish this?

My only way so far is to put a headereditemscontrol inside an itemscontrol. This seems to be a very complicated way to such a simple issue.

Thanks in advance for your help.

Answer 1

Try:

xaml:

   <StackPanel Grid.Row="1">
            <TextBlock Text="{Binding Path=FoodTypes[0].Description}" />
            <ItemsControl ItemsSource="{Binding Path=FoodTypes}" >
                <ItemsControl.ItemsPanel>
                    <ItemsPanelTemplate>
                        <StackPanel />
                    </ItemsPanelTemplate>
                </ItemsControl.ItemsPanel>
                <ItemsControl.ItemTemplate>
                    <DataTemplate>
                        <TextBlock Margin="15,0,0,0" Text="{Binding Path=Text}" />
                    </DataTemplate>
                </ItemsControl.ItemTemplate>
            </ItemsControl>
        </StackPanel>

code:

public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();
            this.DataContext = new MyViewModel();
        }
    }


    public class FoodType
    {
        public string Description {get;set;}
        public string Text {get;set;}
    }

    class MyViewModel : INotifyPropertyChanged
    {
        private ObservableCollection<FoodType> foodTypes;

        public ObservableCollection<FoodType> FoodTypes
        {
            get { return this.foodTypes; }
            set
            {
                this.foodTypes = value;
                this.OnPropertyChanged("FoodTypes");
            }
        }

        public MyViewModel()
        {
            this.FoodTypes = new ObservableCollection<FoodType>();

            this.FoodTypes.Add(new FoodType() { Description = "Test1", Text = "Something" });
            this.FoodTypes.Add(new FoodType() { Description = "Test1", Text = "Something Else" });
        }

        public event PropertyChangedEventHandler PropertyChanged;

        private void OnPropertyChanged(string propertyName)
        {
            var handler = this.PropertyChanged;
            if(handler != null)
            {
                handler(this, new PropertyChangedEventArgs(propertyName));
            }
        }
    }