Master-detail data binding - wpf

Question

I have two models in my application:
class Line
{
string line_id { get; set; }
string color { get; set; }
}
class Point
{
string point_id { get; set; }
string line_id { get; set; }
int weight { get; set; }
}
And I have two ObservableCollection:
lines - ObservableCollection<Line>
points - ObservableCollection<Point>
I want to display two ListBox'es : first (outer) to display lines, and second (inner) to display the points which belongs to this line.
<ListView x:Name="lvPoint" ItemsSource="{Binding}">
<ListView.ItemTemplate>
<DataTemplate>
<StackPanel>
<TextBlock Text="{Binding color, Mode=TwoWay}" />
<ListBox ItemsSource="{Binding SOMETHING, Mode=TwoWay}">
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel>
<TextBlock Text="{Binding weight, Mode=OneWay}" />
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
</StackPanel>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
I set DataContext for outer ListBox in the code:
lvPoint.DataContext = lines;
How can I set DataContext for inner ListBox to display Points for each Line ?

Answer 1

Your Line model is not good for this scenario. It should have a property such as called Points which contains the interested points belonging to the Line. Then the Binding is just simple:
class Line {
public string line_id { get; set; }
public string color { get; set; }
ObservableCollection<Point> _points;
public ObservableCollection<Point> Points {
get {
if (_points == null) _points = new ObservableCollection<Point>();
return _points;
}
}
}
Then in XAML code you can just set the Path to Points like this:
<ListBox ItemsSource="{Binding Points, Mode=TwoWay}">
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel>
<TextBlock Text="{Binding weight, Mode=OneWay}" />
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
The model above is just an example showing the main idea. The full implementation should of course be different and more advanced depending on the current project.
Update: Without using the model above, you can try using Converter for the Binding. The Binding is set directly to the current item (Line). The Converter will convert Line to points (maybe based on line_id and your query method):
public class LineToPointsConverter : IValueConverter {
public object Convert(object value, Type targetType, object parameter,
System.Globalization.CultureInfo culture){
var line = value as Line;
//convert to points by querying the points based on line.line_id here
return ...
}
public object ConvertBack(object value, Type targetType,
object parameter,
System.Globalization.CultureInfo culture){
return Binding.DoNothing;
}
}
Define a static property of LineToPointsConverter or create an instance of that converter in Resources:
<Window.Resources>
<local:LineToPointsConverter x:Key="lineToPointsConverter"/>
</Window.Resources>
Then in XAML code set that converter:
<ListBox ItemsSource="{Binding Mode=TwoWay, Path=.,
Converter={StaticResource lineToPointsConverter}}">
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel>
<TextBlock Text="{Binding weight, Mode=OneWay}" />
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>