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.

Maybe i'm a bit visual but, could you add your code structure and/or an image of what you're trying to accomplish exactly? — Maxime Tremblay-Savard, Jun 19 '15 at 19:45
Sorry, on my mobile at the moment, I'll post Code when I'm back tomorrow. — Richard Harrison, Jun 19 '15 at 20:24
@RichardHarrison Just finished typing something up before I saw your comment about posting code. I took a shot in the dark and thought I would post an answer anyway. — MisterXero, Jun 19 '15 at 20:38
I don't have a clear idea what you are looking for, but some things to consider are [`HeaderedItemsControl`](https://msdn.microsoft.com/en-us/library/system.windows.controls.headereditemscontrol.aspx), nesting `ItemsControl`s (if you have multidimensional data), or using a more advanced `ItemsControl` such as `DataGrid`. You might even want something like a `ListView` with groups. Just some ideas for you to think about since we don't have a clear understanding of the goal. Knowing what your data looks like and a more detailed description or mockup of the desired visual would help. — Xavier, Jun 19 '15 at 22:50

MisterXero · Answer 1 · 2015-06-19T21:14:02.297

0

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));
            }
        }
    }

edited Jun 19 '15 at 21:14

answered Jun 19 '15 at 20:37

MisterXero

1,098
2
9
17

That would be fine, but there can be more than 1 foodtype per person, so the textblock wouldn't bind to the correct food type. – Richard Harrison Jun 19 '15 at 20:55
@RichardHarrison I guess that is kinda where I found some confusion in your question. So you want a header for each item? Could you clarify what you meant by this: "...but what I would like is a heading above each 12 rows stating the food type, without repeating it on each row..." Thanks. – MisterXero Jun 19 '15 at 20:59
I have a plan to add the 12 fields to the table, instead of 12 rows per entry. This will be suitable for this instance, but I would still like to know how I'd do this for future reference. – Richard Harrison Jun 19 '15 at 20:59
@RichardHarrison So the idea would be then to have 1 row and 12 fields/columns with text above each field as the header/Foodtype of that field? – MisterXero Jun 19 '15 at 21:02
essentially inside the itemtemplate would be a textblock text={binding foodtypes(0).Description} then show the 12 rows of data... – Richard Harrison Jun 19 '15 at 21:02
@RichardHarrison Ok I think I kinda understand now. See my edits. – MisterXero Jun 19 '15 at 21:14
That's pretty much where I got to, but how do I then, if there is another food type, get the next description with it's 12 rows beneath? This is getting complex, I'll add some Code tomorrow which might help straighten things out. – Richard Harrison Jun 19 '15 at 21:17
@RichardHarrison Haha ok. – MisterXero Jun 19 '15 at 21:18

Header inside itemscontrol

1 Answers1