4

作成したユーザー コントロールにフリップ アニメーションを追加しようとしています。ユーザー コントロールは単純で、87x87 の画像の前後といくつかのプロパティがあります。私が楽しみのために取り組んでいるゲームのタイルを表すと思われます。ユーザーがデッキからタイルを選択する際の反転効果をアニメーション化しようとしています。2 つの理由から、xaml ではなくコードを使用してこれを行う必要があると感じています。

私が得ている問題は、メソッドが終了した後に最後のアニメーションが実行されることだけです。ストーリーボードが必要だと思いますが、私が見たすべての例は、次の 2 つの点で私を混乱させました。

ストーリー ボードの途中で画像を変更するにはどうすればよいですか。また、targetProperty を何に設定すればよいでしょうか。私はこれら 2 つのブログに取り組んできました。

http://www.codeguru.com/csharp/csharp/cs_misc/userinterface/article.php/c12221 http://blogs.msdn.com/tess/archive/2009/03/16/silverlight-wpf-flipimage-animation .aspx

    public void FlipFront()
    {
            DoubleAnimation flipfront = new DoubleAnimation(0, 90, new Duration(new     TimeSpan(0, 0, 1)));
        SkewTransform skew = new SkewTransform();
        this.RenderTransform = skew;
        skew.BeginAnimation(SkewTransform.AngleYProperty, flipfront);         


    }

    public void FlipBack()
    {

        ImageSourceConverter source = new ImageSourceConverter();
        this.ImageFace.Source = new BitmapImage(new Uri("Back.jpg", UriKind.Relative));

        DoubleAnimation flipfront = new DoubleAnimation(90, 0, new Duration(new TimeSpan(0, 0, 1)));
        SkewTransform skew = new SkewTransform();
        this.RenderTransform = skew;
        skew.BeginAnimation(SkewTransform.AngleYProperty, flipfront); 
    }

    public void Flip()
    {
        FlipFront();
        FlipBack();
    }

私が経験している問題を解決するのに役立つと思ったので、フリップを 2 つの別々の方法に分割しました。

4

1 に答える 1

1

うわー、これは長い間更新されていません...誰かがこれを追跡している場合に備えて:

問題は、「フリップ バック」をすぐに開始する前に「フリップ フロント」アニメーションが完了するのを待っていないことです。正しく発火しない。

これを回避する方法はたくさんあります。最初に思い浮かぶのは、オブジェクトを返すDoubleAnimationと呼ばれるメソッドがあることです。そのオブジェクトにはイベントがあり、アニメーションがいつ「終了」したかがわかります。ハンドラをアタッチし (メモリ リークしないようにデタッチすることを忘れないでください)、そこで「フリップを開始」メソッドを呼び出します。私は非常に非効率的なものを一緒に投げましたが、それは原則を示しています:CreateClockAnimationClockCompleted

public AnimationClock StartFlipFrontAnimation()
{
    this.ImageFace.Source = _frontFace;
    DoubleAnimation flipfront = new DoubleAnimation(0, 90, new Duration(new TimeSpan(0, 0, 3)));
    SkewTransform skew = new SkewTransform();
    this.RenderTransform = skew;
    skew.BeginAnimation(SkewTransform.AngleYProperty, flipfront);
    return flipfront.CreateClock();
}

public AnimationClock StartFlipBackAnimation()
{   
    this.ImageFace.Source = _backFace;
    DoubleAnimation flipfront = new DoubleAnimation(90, 0, new Duration(new TimeSpan(0, 0, 3)));
    SkewTransform skew = new SkewTransform();
    this.RenderTransform = skew;
    skew.BeginAnimation(SkewTransform.AngleYProperty, flipfront); 
    return flipfront.CreateClock();
}

public void BeginFlip()
{       
    var frontClk = StartFlipFrontAnimation();       
    frontClk.Completed += FrontFlipDone;        
}

private void FrontFlipDone(object sender, EventArgs args)
{
    var clk = sender as AnimationClock;
    if(clk != null)
    {
        clk.Completed -= FrontFlipDone;
    }
    var backClk = StartFlipBackAnimation();
}
于 2012-11-27T23:49:43.130 に答える