DataTemplates in WPF

Question

I have a general question about data templates in WPF. Let's say I have an abstract class called "Question," and various subclasses like "MathQuestion," "GeographyQuestion," etc. In some contexts, rendering the questions as a "Question" using the "Question" data template is good enough, but let's say that I have a list of random Question objects of varying subclasses that I want to display in-turn. I want to display them to the user using their specific data templates rather than their generic Question data template, but since I don't know that at design time, is there anyway to tell WPF, "hey, here's a list of Quesitons, but use reflection to figure out their specific types and use THAT data template?"

What I've thought of so far: I thought that in addition to having my question collection, I could create another collection of the specific types using reflection and somehow bind that to "blah," then I'd get the desired affect, but you can only bind to DependencyProperties in WPF, so I'm not sure what I'd bind to. I really don't like this idea, and my gut tells me there's a more elegant way to approach this problem.

I'm not looking for specific code here, just a general strategy to accomplish what I'm trying to do. Also, I'm using MVVM for the most part if that helps.

Thanks

Cookie

For anyone who looks at this question down the road, I've since discovered this article that breaks everything down really well: drwpf.com/blog/category/data-templates – Cookie

Answer 1

I'm thinking something like this should work right out of the box:

<UserControl.Resources>
    <DataTemplate DataType="{x:Type vm:GenericQuestionViewModel}">
        <v:GenericQuestion/>
    </DataTemplate>
    <DataTemplate DataType="{x:Type tvm:GeographyQuestionViewModel}">
        <tv:GeographyQuestion/>
    </DataTemplate>
    <DataTemplate DataType="{x:Type tvm:BiologyQuestionViewModel}">
        <tv:BiologyQuestion/>
    </DataTemplate>
</UserControl.Resources>

<ContentControl Content="{Binding QuestionViewModel}">

---

Edit:

Yes, this definitely should work. Here's a more complete example:

Main View Model

public class MainWindowViewModel : ViewModelBase
{
    public ObservableCollection<QuestionViewModel> QuestionViewModels { get; set; }

    public MainWindowViewModel()
    {
        QuestionViewModels = new ObservableCollection<QuestionViewModel>
        {
            new GenericQuestionViewModel(),
            new GeographyQuestionViewModel(),
            new BiologyQuestionViewModel()
        };
    }
}

Question View Models

public abstract class QuestionViewModel : ViewModelBase
{
}

public class GenericQuestionViewModel : QuestionViewModel
{
}

public class GeographyQuestionViewModel : QuestionViewModel
{
}

public class BiologyQuestionViewModel : QuestionViewModel
{
}

Question User Controls

<UserControl x:Class="WpfApplication1.GenericQuestion" ...>
    <Grid>
        <TextBlock Text="Generic Question" />
    </Grid>
</UserControl>

<UserControl x:Class="WpfApplication1.GeographyQuestion" ...>
    <Grid>
        <TextBlock Text="Geography Question" />
    </Grid>
</UserControl>

<UserControl x:Class="WpfApplication1.BiologyQuestion" ...>
    <Grid>
        <TextBlock Text="Biology Question" />
    </Grid>
</UserControl>

Main Window

<Window x:Class="WpfApplication1.MainWindow" ...
        Title="MainWindow"
        Height="900"
        Width="525">
    <Window.DataContext>
        <local:MainWindowViewModel />
    </Window.DataContext>
    <Window.Resources>
        <DataTemplate DataType="{x:Type local:GenericQuestionViewModel}">
            <local:GenericQuestion />
        </DataTemplate>
        <DataTemplate DataType="{x:Type local:GeographyQuestionViewModel}">
            <local:GeographyQuestion />
        </DataTemplate>
        <DataTemplate DataType="{x:Type local:BiologyQuestionViewModel}">
            <local:BiologyQuestion />
        </DataTemplate>
    </Window.Resources>
    <ItemsControl ItemsSource="{Binding QuestionViewModels}">
        <ItemsControl.ItemTemplate>
            <DataTemplate>
                <ContentControl Content="{Binding}" />
            </DataTemplate>
        </ItemsControl.ItemTemplate>
    </ItemsControl>
</Window>

Update

Kyle Tolle pointed out a nice simplification for setting ItemsControl.ItemTemplate. Here is the resulting code:

<ItemsControl ItemsSource="{Binding QuestionViewModels}"
              ItemTemplate="{Binding}" /> 

Voelker

Let's say the VM presents an ObservableCollection<Question>, would the runtime know to use the more specific data templates rather than the generic Question data template? – Cookie

@Quanta, yep, it should work fine. You just need to put the ContentControl into an ItemsControl. – Voelker

@Quanta, updated my answer to use an ObservableCollection<QuestionViewModel> and an ItemsControl. – Voelker

@Cookie - You wouldn't be able to declare an implicit DataTemplate for QuestionViewModel and then "override" that using more specific types, like BiologyQuestionViewModel. Implicit DataTemplates are applied by exact type matches, not if it's a base class. – Dyspepsia

Use the following ItemsControl element to achieve the same functionality as above with much less XAML. <ItemsControl ItemsSource="{Binding QuestionViewModels}" ItemTemplate="{Binding}" /> – Idonna

Answer 2

Generally, if you need to dynamically change the DataTemplate based on some non-static logic, you'd use a DataTemplateSelector. Another option it to use DataTriggers in your DataTemplate to modify the look appropriately.

Dyspepsia

I went with the other answer, but this is really useful to know as well. – Cookie