7

WPFで要素の幅を0から実際の幅にアニメーション化するにはどうすればよいですか?

私はこれを試しました：

<ControlTemplate.Triggers>
    <EventTrigger RoutedEvent="Loaded">
        <BeginStoryboard>
            <Storyboard>
                <DoubleAnimation Duration="0:0:0.3" To="{Binding ElementName=MyElement, Path=ActualWidth}" From="0" Storyboard.TargetProperty="Width" Storyboard.TargetName="MyElement" />
            </Storyboard>
        </BeginStoryboard>
    </EventTrigger>
</ControlTemplate.Triggers>

バインディングを のようなハードコードされた値に変更する100と、要素の実際の幅にバインドしたい場合を除いて、幅は適切にアニメーション化されます。

問題MyElementがある場合は境界線であり、タブ項目をアニメーション化しています。

記録のために、これはどちらも機能しません:

To="{Binding RelativeSource={RelativeSource AncestorType={x:Type Border}}, Path=ActualWidth}"
4

2 に答える 2

10

これは非常に多くの理由で間違っていると確信しています.私が違反したWPFの法律の数を教えてください..独自のBindableDoubleAnimationを作成することで同じ問題を解決しました.

public class BindableDoubleAnimation : DoubleAnimationBase
{
    DoubleAnimation internalAnimation;

    public DoubleAnimation InternalAnimation { get { return internalAnimation; } }

    public double To
    {
        get { return (double)GetValue(ToProperty); }
        set { SetValue(ToProperty, value); }
    }

    /// <summary>
    /// Dependency backing property for the <see cref="To"/> property.
    /// </summary>
    public static readonly DependencyProperty ToProperty =
        DependencyProperty.Register("To", typeof(double), typeof(BindableDoubleAnimation), new UIPropertyMetadata(0d, new PropertyChangedCallback((s, e) =>
            {
                BindableDoubleAnimation sender = (BindableDoubleAnimation)s;
                sender.internalAnimation.To = (double)e.NewValue;
            })));


    public double From
    {
        get { return (double)GetValue(FromProperty); }
        set { SetValue(FromProperty, value); }
    }

    /// <summary>
    /// Dependency backing property for the <see cref="From"/> property.
    /// </summary>
    public static readonly DependencyProperty FromProperty =
        DependencyProperty.Register("From", typeof(double), typeof(BindableDoubleAnimation), new UIPropertyMetadata(0d, new PropertyChangedCallback((s, e) =>
        {
            BindableDoubleAnimation sender = (BindableDoubleAnimation)s;
            sender.internalAnimation.From = (double)e.NewValue;
        })));


    public BindableDoubleAnimation()
    {
        internalAnimation = new DoubleAnimation();
    }

    protected override double GetCurrentValueCore(double defaultOriginValue, double defaultDestinationValue, AnimationClock animationClock)
    {
        return internalAnimation.GetCurrentValue(defaultOriginValue, defaultDestinationValue, animationClock);
    }

    protected override Freezable CreateInstanceCore()
    {
        return internalAnimation.Clone();;
    }
}

To From プロパティのバインドを自由に使用できるようになりました。

<local:BindableDoubleAnimation Storyboard.TargetProperty="Width" From="0" To="{Binding ActualWidth, RelativeSource={RelativeSource AncestorType=Window}}"/>
于 2012-06-12T11:03:50.067 に答える
2

バインディングをアニメーションで使用できないという問題は、よくある問題です。

SourceValue回避策の 1 つは、 & TargetValue( など、必要なものにバインドできるActualWidth) a CurrentValue(アニメートされた値を返す) とProgress0.0 から 100.0 までアニメートできる a を持つヘルパー オブジェクトを使用することです。進行状況が変更されたら、オブジェクトCurrentValueの をバインドできる を計算するだけです。Widthきれいではありませんが、うまくいくはずです。

于 2012-06-12T10:42:58.440 に答える