brendan
brendan

Reputation: 141

Visual State Transition not applied when DataTemplate is applied via Content Control

Depending on how my buttons Control Template is set, the Visual States will or won't be applied. Unfortunately the mechanism by which I see them working isn't available to me as it isn't dynamic enough.

Hooking up the datatemplate via a content control and binding does render the Textblocks Content fine, it just doesn't handle the transition when the button is disabled

<Style x:Key="ItemsControlStyle" TargetType="ItemsControl">
    <Setter Property="ItemsPanel">
        <Setter.Value>
            <ItemsPanelTemplate>
                <WrapPanel />
            </ItemsPanelTemplate>
        </Setter.Value>
    </Setter>

    <Setter Property="ItemTemplate">
        <Setter.Value>
            <DataTemplate DataType="xxx:myType">
                <Button Command="{Binding ActionCommand}" CommandParameter="{Binding Item}" Height="125" Width="200" Margin="10" >
                    <Button.Template>
                        <ContentControl Content="{Binding}" ContentTemplate="{Binding ItemDataTemplateKey, Converter={StaticResource StringToDataTemplateConverter}}" />
                        </ControlTemplate>
                    </Button.Template>
                </Button>
            </DataTemplate>

        </Setter.Value>
    </Setter>

</Style>


<DataTemplate x:Key="ItemTemplate">
    <Border x:Name="Border" BorderThickness="1" >
        <TextBlock x:Name="Textblock" Text="{Binding Caption}" FontFamily="{DynamicResource DefaultFont}"/>

        <VisualStateManager.VisualStateGroups>
            <VisualStateGroup x:Name="CommonStates">
                <VisualState x:Name="Disabled">
                    <Storyboard>
                        <ColorAnimation Storyboard.TargetName="TextBlock" Storyboard.TargetProperty="(Foreground).(SolidColorBrush.Color)" To="Gray" Duration="0:0:0.01"/>
                    </Storyboard>
                </VisualState>
            </VisualStateGroup>
        </VisualStateManager.VisualStateGroups>
    </Border>
</DataTemplate>

When I hook up the template inline everything works as expected

<Style x:Key="ItemsControlStyle" TargetType="ItemsControl">
    <Setter Property="ItemsPanel">
        <Setter.Value>
            <ItemsPanelTemplate>
                <WrapPanel />
            </ItemsPanelTemplate>
        </Setter.Value>
    </Setter>

    <Setter Property="ItemTemplate">
        <Setter.Value>
            <DataTemplate DataType="xxx:myType">
                <Button Command="{Binding ActionCommand}" CommandParameter="{Binding Item}" Height="125" Width="200" Margin="10" >
                    <Button.Template>
                        <ControlTemplate TargetType="Button">
                            <Border x:Name="Border" BorderThickness="1" >
                                <TextBlock x:Name="TextBlock" Text="{Binding Caption}" FontFamily="{DynamicResource DefaultFont}"/>

                                <VisualStateManager.VisualStateGroups>
                                    <VisualStateGroup x:Name="CommonStates">
                                        <VisualState x:Name="Disabled">
                                            <Storyboard>
                                                <ColorAnimation Storyboard.TargetName="TextBlock" Storyboard.TargetProperty="(Foreground).(SolidColorBrush.Color)" To="Gray" Duration="0:0:0.01"/>
                                            </Storyboard>
                                        </VisualState>
                                    </VisualStateGroup>
                                </VisualStateManager.VisualStateGroups>
                            </Border>
                        </ControlTemplate>
                    </Button.Template>
                </Button>
            </DataTemplate>
        </Setter.Value>
    </Setter>
</Style>

Upvotes: 2

Views: 150

Answers (0)

Related Questions