Interaction.Behaviors is not working for button content

Question

I have created animation on button content in XAML Page, in windows silverlight phone 8. But when I moved my project to windows phone 8.1 RT.. animation of button content is not working as it was working in silverlight phone project.

I have added below code which I have implemented in silverlight phone 8..

Interaction.Behaviors code part is not working.. I have added behaviour sdk for windows phone 8.1 in reference...

I have also added below three using for interactivity..

      xmlns:i="using:Microsoft.Xaml.Interactivity"
      xmlns:ic="using:Microsoft.Xaml.Interactions.Core"
      xmlns:im="using:Microsoft.Xaml.Interactions.Media"

XAML

<Button x:Name="MenuButton"
                Style="{StaticResource PageNumberButtonStyle}"
                Height="180"
                Margin="10"
                Width="240"
                Click="MenuButtonClick"
                Content="{Binding CurrentPage.Number}"
                FontFamily="ms-appx:///Fonts/sesamewkshpregular.ttf#SesameWkshp Rg"
                HorizontalAlignment="Left"
                RenderTransformOrigin="0.5,0.5"
                VerticalAlignment="Bottom">
            <Button.RenderTransform>
                <CompositeTransform x:Name="MenuButtonScale"
                                    ScaleX="0"
                                    ScaleY="0" />
            </Button.RenderTransform>
        </Button>



<Page.Resources>
    <ResourceDictionary>
        <!-- PageNumberButtonStyle -->
        <Style x:Key="PageNumberButtonStyle"
               TargetType="Button">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="Button">
                        <Grid>
                            <VisualStateManager.VisualStateGroups>
                                <VisualStateGroup x:Name="FocusStates">
                                    <VisualState x:Name="Unfocused" />
                                    <VisualState x:Name="Focused" />
                                </VisualStateGroup>
                                <VisualStateGroup x:Name="PageNumberStates">
                                    <VisualState x:Name="BindingChanged">
                                        <Storyboard>
                                            <DoubleAnimation From="1"
                                                             To="0"
                                                             Storyboard.TargetProperty="(UIElement.Opacity)"
                                                             Storyboard.TargetName="contentPresenter" />
                                        </Storyboard>
                                    </VisualState>
                                </VisualStateGroup>
                            </VisualStateManager.VisualStateGroups>
                            <Grid.Background>
                                <ImageBrush Stretch="None" ImageSource="/Resources/Assets/Book-Solid.png" />
                            </Grid.Background>

                            <ContentPresenter x:Name="contentPresenter"
                                              HorizontalAlignment="Center"
                                              VerticalAlignment="Center"
                                              Margin="0,20,0,0"
                                              RenderTransformOrigin="0.5,0.5">
                                <ContentPresenter.RenderTransform>
                                    <CompositeTransform x:Name="contentTransform"
                                                        ScaleX="0.5"
                                                        ScaleY="0.5" />
                                </ContentPresenter.RenderTransform>
                            </ContentPresenter>

                            <i:Interaction.Behaviors>
                                <ic:DataTriggerBehavior Binding="{Binding CurrentPage.Number}">
                                    <im:ControlStoryboardAction ControlStoryboardOption="Play">
                                        <im:ControlStoryboardAction.Storyboard>
                                            <Storyboard>
                                                <DoubleAnimation From="0"
                                                                 To="1"
                                                                 Duration="0:0:1"
                                                                 Storyboard.TargetProperty="ScaleX"
                                                                 Storyboard.TargetName="contentTransform">
                                                    <DoubleAnimation.EasingFunction>
                                                        <ElasticEase EasingMode="EaseOut"
                                                                     Oscillations="2"
                                                                     Springiness="5" />
                                                    </DoubleAnimation.EasingFunction>
                                                </DoubleAnimation>
                                                <DoubleAnimation From="0"
                                                                 To="1"
                                                                 Duration="0:0:1"
                                                                 Storyboard.TargetProperty="ScaleY"
                                                                 Storyboard.TargetName="contentTransform">
                                                    <DoubleAnimation.EasingFunction>
                                                        <ElasticEase EasingMode="EaseOut"
                                                                     Oscillations="2"
                                                                     Springiness="5" />
                                                    </DoubleAnimation.EasingFunction>
                                                </DoubleAnimation>
                                            </Storyboard>
                                        </im:ControlStoryboardAction.Storyboard>
                                    </im:ControlStoryboardAction>
                                </ic:DataTriggerBehavior>
                            </i:Interaction.Behaviors>
                        </Grid>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
            <Setter Property="FontSize" Value="150" />

        </Style>

Please, guide me here for this problem..

are you missing `Value` from `DataTriggerBehavior`? is same working in silverlight or WPF? perhaps you could do it without using behavior if that is the issue. — pushpraj, Jul 01 '14 at 03:05

score 0 · Answer 1 · edited Jul 13 '14 at 17:30

0

Try adding a ComparisonConditionType and Value attributes to the DataTriggerBehaviour as it needs a condition for comparison on a particular Value.

edited Jul 13 '14 at 17:30

Harsh Baid

7,199
5
48
92

answered Jul 01 '14 at 04:41

Kajal Sinha

1,565
11
20

Please, check at your end with your given answer. and let me know.. is it working on not?? Cause It is not working.... – sikender Jul 01 '14 at 04:58

Interaction.Behaviors is not working for button content

XAML

1 Answers1