MONJE
MONJE

Reputation: 85

WPF: Animation not work In time of change IsEnabled to {False or True}

The default "Grid" is displayed.

In step one and "Hide_MouseUp", animation works.

And then in no way responds to IsEnabled.

Please Please help me to solve this problem.

I am waiting for your warm response :)

style:

<Style x:Key="ShowHideVisibilityStyle" TargetType="{x:Type Grid}">
    <Setter Property="Opacity" Value="1"></Setter>
    <Setter Property="Margin" Value="0,50,0,0"></Setter>
    <Setter Property="IsEnabled" Value="True" />
    <Style.Triggers>
        <Trigger Property="IsEnabled" Value="True">
            <Trigger.EnterActions>
                <BeginStoryboard>
                    <Storyboard>
                        <DoubleAnimation
                            Storyboard.TargetProperty="Opacity"
                            From="0" To="1" Duration="0:0:0.5" />
                        <ThicknessAnimation   
                            Storyboard.TargetProperty="Margin"
                            From="-600,50,0,0"
                            To="0,50,0,0" 
                            Duration="0:0:0.1"
                        />
                    </Storyboard>
                </BeginStoryboard>
            </Trigger.EnterActions>
        </Trigger>
        <Trigger Property="IsEnabled" Value="False">
            <Trigger.EnterActions>
                <BeginStoryboard>
                    <Storyboard>
                        <DoubleAnimation
                            Storyboard.TargetProperty="Opacity"
                            From="1" To="0" Duration="0:0:0.5" />
                        <ThicknessAnimation   
                            Storyboard.TargetProperty="Margin"
                            BeginTime="0:0:0.5"
                            To="-600,50,0,0" 
                            Duration="0:0:0" />
                    </Storyboard>
                </BeginStoryboard>
            </Trigger.EnterActions>
        </Trigger>
    </Style.Triggers>
</Style>

XAML:

<Grid x:Name="SettingPage" Width="290" Style="{DynamicResource ShowHideVisibilityStyle}">
    <!-- code -->
</Grid>

Code Test For Change status IsEnabled to {False or True}

private void Hide_MouseUp(object sender, MouseButtonEventArgs e){
    SettingPage.IsEnabled = false;
}
private void Show_MouseUp(object sender, MouseButtonEventArgs e){
    SettingPage.IsEnabled = true;
}

Upvotes: 0

Views: 687

Answers (2)

Manfred Radlwimmer
Manfred Radlwimmer

Reputation: 13394

It's a simple fix. Just move the "Enabling" Animation into an ExitTrigger:

<Style.Triggers>
    <Trigger Property="IsEnabled" Value="False">
        <Trigger.EnterActions>
            <BeginStoryboard>
                <Storyboard>
                    <DoubleAnimation
                        Storyboard.TargetProperty="Opacity"
                        From="1" To="0" Duration="0:0:0.5" />
                    <ThicknessAnimation   
                        Storyboard.TargetProperty="Margin"
                        BeginTime="0:0:0.5"
                        To="-600,50,0,0" 
                        Duration="0:0:0" />
                </Storyboard>
            </BeginStoryboard>
        </Trigger.EnterActions>
        <Trigger.ExitActions>
            <BeginStoryboard>
                <Storyboard>
                    <DoubleAnimation
                        Storyboard.TargetProperty="Opacity"
                        From="0" To="1" Duration="0:0:0.5" />
                    <ThicknessAnimation   
                        Storyboard.TargetProperty="Margin"
                        From="-600,50,0,0"
                        To="0,50,0,0" 
                        Duration="0:0:0.1"
                    />
                </Storyboard>
            </BeginStoryboard>
        </Trigger.ExitActions>
    </Trigger>
</Style.Triggers>

Upvotes: 1

MONJE
MONJE

Reputation: 85

Hi, I find the solution :)

for using two triggers on one property "Trigger.EnterActions" and "Trigger.ExitActions" should be used instead of using two separate Triggers

excuse me for my bad english :D

Code:

<Style.Triggers>
    <Trigger Property="IsEnabled" Value="True">
        <Trigger.EnterActions>
            <BeginStoryboard>
                <Storyboard>
                   <!-- Animation -->
                </Storyboard>
            </BeginStoryboard>
        </Trigger.EnterActions>

        <Trigger.ExitActions>
            <BeginStoryboard>
                <Storyboard>
                    <!-- Animation -->
                </Storyboard>
            </BeginStoryboard>
        </Trigger.ExitActions>
    </Trigger>
</Style.Triggers>

Upvotes: 1

Related Questions