Master-detail pattern works in WPF but does not seem to work in Noesis
Posted: 25 Jul 2019, 19:21
I use this pattern to display settings in a WPF application. So, the UI is a split view, with settings "Categories" (the "master" in the pattern) on the left. The individual settings for a given Category (the "detail" in the pattern) are displayed on the right. As you select different categories on the left, different sets of settings are displayed on the right.
A basic implementation of this is:
SettingsView.xaml
The CategoryCollection is populated like this:
There is a CategoryContainer for each category on the right. Each of these holds a SettingsContainer, which is a user control containing a list bound to user settings
SettingsContainer.xaml is a UserControl with a ListBox bound to a list of settings:
A basic implementation of this is:
SettingsView.xaml
Code: Select all
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="350"></ColumnDefinition> // The left side displays categories of settings
<ColumnDefinition Width="Auto"></ColumnDefinition> // The right side displays the set of settings for a given category
</Grid.ColumnDefinitions>
<ListBox Grid.Column="0" ItemsSource="{Binding Path=CategoryCollection}" >
</ListBox>
<Grid Grid.Column="1">
<ContentPresenter Content="{Binding Path=CategoryCollection.CurrentItem.SettingsContainer, Mode=TwoWay}"></ContentPresenter>
</Grid>
Code: Select all
public ObservableCollection<CategoryContainer> CategoryCollection { get; }
CategoryCollection = new ObservableCollection<CategoryContainer>()
{
{
new CategoryContainer(
new SettingsContainer(
new ObservableCollection<Setting>()
{
new Setting() { Name = "Setting #1" },
new Setting() { Name = "Setting #2" },
new Setting() { Name = "Setting #3" },
}), "Category #1")
},
{
new CategoryContainer(
new SettingsContainer(
new ObservableCollection<Setting>()
{
new Setting() { Name = "Setting #4" },
new Setting() { Name = "Setting #5" },
new Setting() { Name = "Setting #6" },
}), "Category #2")
}
};
Code: Select all
public class CategoryContainer : NotifyObject
{
public CategoryContainer(UserControl settingsContainer, string name)
{
_settingsContainer = settingsContainer;
_name = name;
}
private object _settingsContainer;
public object SettingsContainer
{
get
{
return _settingsContainer;
}
set
{
_settingsContainer = value;
OnPropertyChanged("SettingsContainer");
}
}
SettingsContainer.xaml is a UserControl with a ListBox bound to a list of settings:
Code: Select all
<ListBox
ItemsSource="{Binding Path=SettingsCollection}">
</ListBox>