WPF layout dependent on data

Question

I don't see how to define a layout in WPF which depends on the data presented. This is what I got: http://imgur.com/Ozgka7d (screen shot of working example).

The sample data I used is:

<model:QuestionCollection xmlns:model="clr-namespace:Reuma_Toolbox.Model">
    ....
    <model:Question Title="En groente?">
        <model:Question.Answers>
            <model:AnswerCollection RadioButton="True">
                <model:Answer Id="spinach" IsChecked="True" />
                <model:Answer Id="patato" />
            </model:AnswerCollection>
        </model:Question.Answers>
    </model:Question>
    <model:Question Title="Hoe vaak eet je spinazie, toe zeg vertel het me!" >
        <model:Question.Answers>
            <model:AnswerCollection RadioButton="False">
                <model:Answer Id="0" Label="1" Title="Zonder enige moeilijkheid" />
                <model:Answer Id="1" Label="2" Title="Elke dag" />
                <model:Answer Id="2" Label="3" Title="Nooit" IsChecked="True"/>
                <model:Answer Id="3" Label="4" Title="Onmogelijk" />
            </model:AnswerCollection>
        </model:Question.Answers>
    </model:Question>
    ....
</model:QuestionCollection>

So basically a list of questions, each question has either a set of checkboxes or a set of radio buttons.

What I need is that in case RadioButton="False", the layout changes from a horizontal row of radio buttons to a vertical list of checkboxes and labels. I really have no clue how to achieve this. Triggers? Different style?

The WPF I currently have is this:

<report:BlockUserControl x:Class="Reuma_Toolbox.Reports.QuestionsControl"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
             xmlns:report="clr-namespace:Reuma_Toolbox.Reports"
             mc:Ignorable="d" 
             d:DesignHeight="210" d:DesignWidth="430">

    <report:BlockUserControl.Resources>
        <Style x:Key="answerRectangle" TargetType="Rectangle">
            <Setter Property="Width" Value="16"/>
            <Setter Property="Height" Value="16"/>
            <Setter Property="Fill" Value="{DynamicResource DarkGrayBrush}"/>
            <Setter Property="Margin" Value="3"/>
        </Style>
    </report:BlockUserControl.Resources>

    <ItemsControl d:DataContext="{d:DesignData /SampleData/QuestionsSampleData.xaml}" ItemsSource="{Binding}">
        <ItemsControl.ItemTemplate>
            <DataTemplate>
                <Grid MinHeight="50" Width="{Binding Path=ActualWidth, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType={x:Type ListBox}}}">
                    <Grid.RowDefinitions>
                        <RowDefinition Height="Auto"/>
                        <RowDefinition/>
                    </Grid.RowDefinitions>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition/>
                        <ColumnDefinition Width="Auto"/>
                    </Grid.ColumnDefinitions>
                    <Separator Grid.Row="0" Grid.ColumnSpan="2" Margin="0,2" Background="{StaticResource LightGrayBrush}" />
                    <TextBlock Grid.Row="1" Grid.Column="0" TextWrapping="Wrap" FontSize="12">
                        <TextBlock.Text>
                            <MultiBinding Converter="{StaticResource stringConcatConverter}">
                                <Binding Path="Title" />
                                <Binding Path="Subtitle" />
                            </MultiBinding>
                        </TextBlock.Text>
                    </TextBlock>
                    <ItemsControl Grid.Row="1" Grid.Column="1" ItemsSource="{Binding Answers}" Margin="10,0,2,0" VerticalAlignment="Top">
                        <ItemsControl.ItemsPanel>
                            <ItemsPanelTemplate>
                                <UniformGrid Rows="1"/>
                            </ItemsPanelTemplate>
                        </ItemsControl.ItemsPanel>
                        <ItemsControl.ItemTemplate>
                            <DataTemplate>
                                    <Rectangle x:Name="square" Style="{StaticResource answerRectangle}" />
                                <DataTemplate.Triggers>
                                    <DataTrigger Binding="{Binding Title}" Value="{x:Null}">
                                        <Setter TargetName="square" Property="Fill" Value="{StaticResource LightGrayBrush}"/>
                                    </DataTrigger>
                                    <DataTrigger Binding="{Binding IsChecked}" Value="True">
                                        <Setter TargetName="square" Property="Fill" Value="{StaticResource DarkBlueBrush}"/>
                                    </DataTrigger>
                                </DataTemplate.Triggers>
                            </DataTemplate>
                        </ItemsControl.ItemTemplate>
                    </ItemsControl>
                </Grid>
            </DataTemplate>
        </ItemsControl.ItemTemplate>
    </ItemsControl>
</report:BlockUserControl>

Answer 1

This is a really good reason to use the DataTemplateSelector. It lets you display a different data template based on the type of object or properties of the data object>

http://msdn.microsoft.com/en-us/library/system.windows.controls.datatemplateselector(v=vs.110).aspx