user1702369
user1702369

Reputation: 1161

Binding XAML to Dictionary

Consider the following code:

public class Person {
public int Id { get; set; }
public string Name { get; set; }
public string Surname { get; set; }
}

public class HealthInfo {
public int BMI { get; set; }
public int HeartRate { get; set; }
public string DietPlan { get; set; }
}


Dictionary<Person, HealthInfo> myPersonInfo = new Dictionary<Person, HealthInfo>();

myPersonInfo.Add( new Person { Id = 1, Name = "Name1", Surname = "Surname1" }, new HealthInfo { BMI = 1, DietPlan = "Banting", HeartRate = 20 } );
myPersonInfo.Add( new Person { Id = 1, Name = "Name2", Surname = "Surname2" }, new HealthInfo { BMI = 1, DietPlan = "Banting", HeartRate = 20 } );
myPersonInfo.Add( new Person { Id = 1, Name = "Name3", Surname = "Surname3" }, new HealthInfo { BMI = 1, DietPlan = "Banting", HeartRate = 20 } );
myPersonInfo.Add( new Person { Id = 1, Name = "Name4", Surname = "Surname4" }, new HealthInfo { BMI = 1, DietPlan = "Banting", HeartRate = 20 } );

I am trying to bind to this Dictionary(myPersonInfo ) from my xaml For each person a tab gets created, where the tab Header will be the name of the person and then the content of that tab will display the HealtInfo.

I having dificulties binding to this dictionary in my XAML

I have the following:

<TabControl ItemsSource="{Binding myPersonInfo.Keys}" SelectedIndex="0">
                <TabControl.ItemTemplate>
                    <DataTemplate>
                        <TextBlock Text="{Binding Path=Name}"/>
                    </DataTemplate>
                </TabControl.ItemTemplate>
                <TabControl.ContentTemplate>
                   <DataTemplate>
                       <TextBlock Text="{Binding Path=Key.Value.BMI}"/>
                   </DataTemplate>
                </TabControl.ContentTemplate>
</TabControl>

How do I use the properties of the Key(Person) for the ItemTemplate and How do I use the properties of the Value(HealtInfo) for the ContentTemplate of the current Key?

Upvotes: 1

Views: 3890

Answers (2)

Fabio
Fabio

Reputation: 32445

Create "aggregation" class and use it in ObservableCollection which nicely supported by data-binding

 public class PersonHealthInfo
 {
     public Person Person {get; set; }
     public HealthInfo HealthInfo {get; set; }
 }

ObservableCollection<PersonHealthInfo> persons = new ObservableCollection<PersonHealthInfo>();

var person1 = new PersonHealthInfo
{
    Person = new Person { Id = 1, Name = "Name1", Surname = "Surname1" },
    HealthInfo = new HealthInfo { BMI = 1, DietPlan = "Banting", HeartRate = 20 }
}

persons.Add(person1);

Upvotes: 2

Parag
Parag

Reputation: 543

You need to change bindings in xaml.

<TabControl ItemsSource="{Binding myPersonInfo}" SelectedIndex="0">
        <TabControl.ItemTemplate>
            <DataTemplate>
                <TextBlock Text="{Binding Path=Key.Name}"/>
            </DataTemplate>
        </TabControl.ItemTemplate>
        <TabControl.ContentTemplate>
            <DataTemplate>
                <TextBlock Text="{Binding Value.BMI}"/>
            </DataTemplate>
        </TabControl.ContentTemplate>
    </TabControl>

Also, myPersonInfo should be a property. So declare it like this:

public Dictionary<Person, HealthInfo> myPersonInfo { get; set; }

Although this code will work, consider refactoring your models in order to make it cleaner.

Upvotes: 2

Related Questions