Siegfried.V
Siegfried.V

Reputation: 1595

Bind a TabItem Template

I have a TabControl, with a list of TabItems inside, and I want to use different templates regarding the source. Let's say that 2 TabItems will bind to an object , and 2 TabItes may bind to an ObservableCollection.

For this, I made the following :

I created these ressources :

<DataTemplate x:Key="TemplateType1" >
    <StackPanel>
        <Grid Background="{StaticResource WindowBackgroundColor}">
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="auto"/>
                <ColumnDefinition Width="auto"/>
            </Grid.ColumnDefinitions>
            <Grid Margin="10,10,20,10">
                <Grid.RowDefinitions>
                    <RowDefinition Height="40"/>
                    <RowDefinition Height="auto"/>
                    <RowDefinition Height="auto"/>
                </Grid.RowDefinitions>
                <Grid>
                    <Grid.RowDefinitions>
                        <RowDefinition Height="*"/>
                        <RowDefinition Height="*"/>

                    </Grid.RowDefinitions>
                    <RadioButton Visibility="{Binding BottomChoice, Converter={StaticResource BoolToVisConverter}}"
                    Content="True option"
                    GroupName="radioGroup1"
                    IsChecked="{Binding Bottom,
                                        Converter={StaticResource InverseBoolRadioConverter}}" />
                    <RadioButton Grid.Row="1" Visibility="{Binding BottomChoice, Converter={StaticResource BoolToVisConverter}}"
                    Content="False option"
                    GroupName="radioGroup1"
                    IsChecked="{Binding Bottom}" />
                </Grid>
                <Button Grid.Row="1" Width="200">
                    <Image Source="..\img\image_about.png"/>
                </Button>
                <Grid Grid.Row="2">
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="60"/>
                        <ColumnDefinition Width="*"/>
                        <ColumnDefinition Width="60"/>
                    </Grid.ColumnDefinitions>
                    <Button Content="{x:Static p:Resources.Delete}" Click="DeleteMacro_Click" Margin="3" >
                        <Button.Style>
                            <Style TargetType="Button" BasedOn="{StaticResource {x:Type Button}}">
                                <Style.Triggers>
                                    <DataTrigger Binding="{Binding Name, Mode=OneWay}" Value="">
                                        <Setter Property="Button.IsEnabled" Value="False" />
                                    </DataTrigger>
                                </Style.Triggers>
                            </Style>
                        </Button.Style>
                    </Button>
                    <Button Content="{x:Static p:Resources.Change}" Grid.Column="2" Click="EditMacroLeft_Click" Margin="3">
                        <Button.Style>
                            <Style TargetType="Button" BasedOn="{StaticResource {x:Type Button}}">
                                <Style.Triggers>
                                    <DataTrigger Binding="{Binding Name, Mode=OneWay}" Value="">
                                        <Setter Property="Button.Content" Value="{x:Static p:Resources.Add}" />
                                    </DataTrigger>
                                </Style.Triggers>
                            </Style>
                        </Button.Style>
                    </Button>
                </Grid>

            </Grid>
            <Grid Margin="20,10,10,10" Grid.Column="1">
                <Grid.RowDefinitions>
                    <RowDefinition Height="*"/>
                </Grid.RowDefinitions>
            </Grid>
        </Grid>
    </StackPanel>
</DataTemplate>

Then my TabItem like that :

<TabItem Header="{x:Static p:Resources.Type1_Right}" Style="{StaticResource VerticalTabItem}">
    <TabItem.ContentTemplate>
        <DataTemplate>
            <Grid>
                <ContentPresenter ContentSource="{Binding MacroRight}" ContentTemplate="{StaticResource TemplateType1}"/>
            </Grid>
        </DataTemplate>
    </TabItem.ContentTemplate>
</TabItem>

I am trying to make my template bind on MacroRight, but no binding is working.

Also seen on that link that there is a DataTemplateSelector possibility, but I see no concrete examples on how to use it?

Upvotes: 0

Views: 54

Answers (1)

ASh
ASh

Reputation: 35680

Documentation for ContentSource says:

This property should only be used when the ContentPresenter is in a template. When a template contains a ContentPresenter with ContentSource set to "Abc", the Content, ContentTemplate, and ContentTemplateSelector properties of the ContentPresenter are automatically aliased to Abc, AbcTemplate, and AbcTemplateSelector, respectively

You should set it as constant (not bind) and let it create Content binding:

<ContentPresenter ContentSource="MacroRight" ...

or bind Content property yourself, which seems simpler for understanding without downsides:

<ContentPresenter Content="{Binding MacroRight}" ...

Upvotes: 1

Related Questions