M
M
Mikhail Usotsky2018-10-29 11:13:37
WPF
Mikhail Usotsky, 2018-10-29 11:13:37

How to bind Label properties from DataTemplate to Template Style?

There is this code that describes the ListBoxItem element with a Label and three radio buttons.
Description of the style of the ListBoxItem element:

<Style BasedOn="{x:Null}" TargetType="{x:Type ListBoxItem}">
        <Setter Property="OverridesDefaultStyle" Value="True" />
        <Setter Property="SnapsToDevicePixels" Value="True" />
        <Setter Property="HorizontalContentAlignment" Value="Stretch" />
        <Setter Property="VerticalContentAlignment" Value="Stretch" />
        <Setter Property="Foreground" Value="#FF101010" />
        <Setter Property="Background" Value="Transparent" />
        <Setter Property="FontStyle" Value="Normal" />
        <Setter Property="FontWeight" Value="Normal" />
        <Setter Property="FontFamily" Value="{DynamicResource Roboto}" />
        <Setter Property="BorderThickness" Value="0" />
        <Setter Property="FontSize" Value="13" />
        <Setter Property="Height" Value="40" />
        <Setter Property="Margin" Value="0,0,0,0" />
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="ListBoxItem">
                    <Border
                        x:Name="Border"
                        Padding="0"
                        SnapsToDevicePixels="true">
                        <Border.Background>
                            <SolidColorBrush Color="Transparent" />
                        </Border.Background>
                        <ContentPresenter
                            x:Name="Content"
                            Margin="0,0,0,0"
                            HorizontalAlignment="Stretch"
                            VerticalAlignment="Stretch"/>
                        <VisualStateManager.VisualStateGroups>
                            <VisualStateGroup x:Name="SelectionStates">
                                <VisualState x:Name="Selected">
                                    <Storyboard>
                                        <ColorAnimationUsingKeyFrames Storyboard.TargetName="Border" Storyboard.TargetProperty="(Panel.Background).(SolidColorBrush.Color)">
                                            <EasingColorKeyFrame KeyTime="0" Value="#FFFDDFAD" />
                                        </ColorAnimationUsingKeyFrames>
                                        <ColorAnimationUsingKeyFrames Storyboard.TargetName="Content" Storyboard.TargetProperty="(Block.Foreground).(SolidColorBrush.Color)">
                                            <EasingColorKeyFrame KeyTime="0" Value="#FFA47C38" />
                                        </ColorAnimationUsingKeyFrames>
                                    </Storyboard>
                                </VisualState>
                                <VisualState x:Name="SelectedUnfocused">
                                    <Storyboard>
                                        <ColorAnimationUsingKeyFrames Storyboard.TargetName="Border" Storyboard.TargetProperty="(Panel.Background).(SolidColorBrush.Color)">
                                            <EasingColorKeyFrame KeyTime="0" Value="#FFFDDFAD" />
                                        </ColorAnimationUsingKeyFrames>
                                        <ColorAnimationUsingKeyFrames Storyboard.TargetName="Content" Storyboard.TargetProperty="(Block.Foreground).(SolidColorBrush.Color)">
                                            <EasingColorKeyFrame KeyTime="0" Value="#FFA47C38" />
                                        </ColorAnimationUsingKeyFrames>
                                    </Storyboard>
                                </VisualState>
                                <VisualState x:Name="Normal">
                                    <Storyboard>
                                        <ColorAnimationUsingKeyFrames Storyboard.TargetName="Border" Storyboard.TargetProperty="(Panel.Background).(SolidColorBrush.Color)">
                                            <EasingColorKeyFrame KeyTime="0" Value="#00000000" />
                                        </ColorAnimationUsingKeyFrames>
                                        <ColorAnimationUsingKeyFrames Storyboard.TargetName="Content" Storyboard.TargetProperty="(Block.Foreground).(SolidColorBrush.Color)">
                                            <EasingColorKeyFrame KeyTime="0" Value="#FF101010" />
                                        </ColorAnimationUsingKeyFrames>
                                    </Storyboard>
                                </VisualState>
                                <VisualState x:Name="MouseOver">
                                    <Storyboard>
                                        <ColorAnimationUsingKeyFrames Storyboard.TargetName="Border" Storyboard.TargetProperty="(Panel.Background).(SolidColorBrush.Color)">
                                            <EasingColorKeyFrame KeyTime="0" Value="#FF1C3BBE" />
                                        </ColorAnimationUsingKeyFrames>
                                        <ColorAnimationUsingKeyFrames Storyboard.TargetName="Content" Storyboard.TargetProperty="(Block.Foreground).(SolidColorBrush.Color)">
                                            <EasingColorKeyFrame KeyTime="0" Value="#FFFFFFFF" />
                                        </ColorAnimationUsingKeyFrames>
                                    </Storyboard>
                                </VisualState>
                            </VisualStateGroup>
                        </VisualStateManager.VisualStateGroups>
                    </Border>
                    <ControlTemplate.Triggers>
                        <Trigger Property="IsMouseOver" Value="True">
                            <Setter Property="FontWeight" Value="Medium" />
                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

Description of the template with Label and three radio buttons:
<DataTemplate x:Key="SelectContext">
        <Border x:Name="Data">
            <Grid x:Name="ContentBase" Margin="1,0">
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="Auto" />
                    <ColumnDefinition />
                    <ColumnDefinition />
                    <ColumnDefinition />
                </Grid.ColumnDefinitions>
                <Label
                    Grid.Column="0"
                    Margin="0"
                    Padding="0"
                    HorizontalAlignment="Left"
                    Content="{Binding Content, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=ContentPresenter}}"
                    Foreground="{Binding Foreground, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=ContentPresenter}}" />
                <RadioButton
                    Name="_1"
                    Grid.Column="1"
                    Content="1"
                    Style="{StaticResource RadioButtonKeys}" />
                <RadioButton
                    Name="_2"
                    Grid.Column="2"
                    Content="2"
                    Style="{StaticResource RadioButtonKeys}" />
                <RadioButton
                    Name="_3"
                    Grid.Column="3"
                    Content="3"
                    Style="{StaticResource RadioButtonKeys}" />
            </Grid>
        </Border>
    </DataTemplate>

Content at assignment works.
<ListBoxItem Content="№ 1" ContentTemplate="{DynamicResource SelectContext}"/>

But for some reason Foreground is not bound to the ContentPresenter property, which is located in the Style/Template.

Answer the question

In order to leave comments, you need to log in

1 answer(s)
M
Mikhail Usotsky, 2018-10-29
@AquariusStar

Solution found:

<DataTemplate x:Key="SelectContext">
        <Border x:Name="Data">
            <Grid x:Name="ContentBase" Margin="1,0">
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="Auto" />
                    <ColumnDefinition />
                    <ColumnDefinition />
                    <ColumnDefinition />
                </Grid.ColumnDefinitions>
                <Label
                    Grid.Column="0"
                    Margin="0"
                    Padding="0"
                    HorizontalAlignment="Left"
                    Content="{Binding Content, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=ContentPresenter}}"
                    Foreground="{Binding Foreground, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=ContentPresenter}}" />
                <RadioButton
                    Name="_1"
                    Grid.Column="1"
                    Content="1"
                    Style="{StaticResource RadioButtonKeys}" />
                <RadioButton
                    Name="_2"
                    Grid.Column="2"
                    Content="2"
                    Style="{StaticResource RadioButtonKeys}" />
                <RadioButton
                    Name="_3"
                    Grid.Column="3"
                    Content="3"
                    Style="{StaticResource RadioButtonKeys}" />
            </Grid>
        </Border>
    </DataTemplate>

Should be replaced with
Foreground="{Binding Foreground, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=ContentPresenter}}"
on the
Foreground="{Binding Foreground, RelativeSource={RelativeSource Mode=Self}}"

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question