2

Canvas無期限に 360 度回転させてアニメーション化するアニメーションがあります(基本的には回転します)。私が欲しいのは、このアニメーションがコントロールが表示されたときに開始し、コントロールが非表示になったときに停止することです。これを何らかの形で に結び付けることができると考えましたVisualStateManager。ここでコントロールのフェードインとフェードアウトの例を見たことがありますが、VSM を使用してストーリーボードを開始および停止する方法がわかりません。

<Canvas.Resources>
    <Storyboard x:Name="spinnerBoard">
        <DoubleAnimation
            Storyboard.TargetName="SpinnerRotate"
            Storyboard.TargetProperty="Angle"
            From="0" To="360" Duration="0:0:01.3"
            RepeatBehavior="Forever" />
    </Storyboard>
</Canvas.Resources>

<Canvas.RenderTransform>
    <RotateTransform x:Name="SpinnerRotate" Angle="0" />
</Canvas.RenderTransform>

VSM の例

<VisualState x:Name="Show">
    <Storyboard>
        <!-- Start the story board here -->
    </Storyboard>
</VisualState>
<VisualState x:Name="Hide">
    <Storyboard>
        <!-- Stop the story board here -->
    </Storyboard>
</VisualState>
4

1 に答える 1

3

さまざまな質問に対するグローバルな回答:
ExtendedVisualStateManager.GoToElementState は、カスタム DP の UserControl への Silverlight
デフォルト バインドで false を返します。

次のようなことができます：

  1. コンテンツを操作するために拡張するテンプレート コントロールを使用しContentControlます IsEnabled(待機中のアクションを防止します)。
  2. IsWaitingコントロールの表示状態を切り替えるDP を作成します。
  3. XAML で 2 つの状態を作成しますDoubleAnimation。 RepeatBehavior="Forever"

ビジー インジケーター コントロールのようなオーバーレイと待機中メッセージの依存関係プロパティを追加できたら...

私は待機中のビジュアル部分に絵を使用していますが、キャンバス、グリッドなどを使用できます...

C#

[TemplateVisualState(GroupName = "WaitGroup", Name = WaitSpinner.IsWaitingStateName)]
[TemplateVisualState(GroupName = "WaitGroup", Name = WaitSpinner.NotWaitingStateName)]
public class WaitSpinner : ContentControl
{
    #region States names
    internal const String IsWaitingStateName = "IsWaitingState";
    internal const String NotWaitingStateName = "NotWaitingState";
    #endregion States names

    public bool IsWaiting
    {
        get { return (bool)GetValue(IsWaitingProperty); }
        set { SetValue(IsWaitingProperty, value); }
    }

    public static readonly DependencyProperty IsWaitingProperty =
        DependencyProperty.Register("IsWaiting", typeof(bool), typeof(WaitSpinner), new PropertyMetadata(false, OnIsWaitingPropertyChanged));

    private static void OnIsWaitingPropertyChanged(DependencyObject sender, DependencyPropertyChangedEventArgs e)
    {
        WaitSpinner waitSpinner = (WaitSpinner)sender;
        waitSpinner.ChangeVisualState(true);
    }

    public WaitSpinner()
    {
        DefaultStyleKey = typeof(WaitSpinner);
    }

    public override void OnApplyTemplate()
    {
        base.OnApplyTemplate();
        ChangeVisualState(false);
    }

    protected virtual void ChangeVisualState(bool useTransitions)
    {
        VisualStateManager.GoToState(this, IsWaiting ? IsWaitingStateName : NotWaitingStateName, useTransitions);
    }
}

XAML :

<VisualStateGroup x:Name="WaitGroup">
    <VisualState x:Name="NotWaitingState" >
        <Storyboard>
            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(Control.IsEnabled)" Storyboard.TargetName="content">
                <DiscreteObjectKeyFrame KeyTime="0">
                    <DiscreteObjectKeyFrame.Value>
                        <System:Boolean>True</System:Boolean>
                    </DiscreteObjectKeyFrame.Value>
                </DiscreteObjectKeyFrame>
            </ObjectAnimationUsingKeyFrames>
        </Storyboard>
    </VisualState>
    <VisualState x:Name="IsWaitingState">
        <Storyboard>
            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="WaitPart">
                <DiscreteObjectKeyFrame KeyTime="0:0:0.200" Value="Visible"/>
            </ObjectAnimationUsingKeyFrames>
            <DoubleAnimation Storyboard.TargetProperty="(UIElement.RenderTransform).(RotateTransform.Angle)" Storyboard.TargetName="WaitPart" To="360" RepeatBehavior="Forever" Duration="0:0:1" />
            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(Control.IsEnabled)" Storyboard.TargetName="content">
                <DiscreteObjectKeyFrame KeyTime="0">
                    <DiscreteObjectKeyFrame.Value>
                        <System:Boolean>False</System:Boolean>
                    </DiscreteObjectKeyFrame.Value>
                </DiscreteObjectKeyFrame>
            </ObjectAnimationUsingKeyFrames>
        </Storyboard>
    </VisualState>
</VisualStateGroup>
<!-- ............. -->
<ContentControl
    IsTabStop="False"
    x:Name="content"
    Content="{TemplateBinding Content}"
    ContentTemplate="{TemplateBinding ContentTemplate}"
    HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
    VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
    Foreground="{TemplateBinding Foreground}"
    ScrollViewer.HorizontalScrollBarVisibility="{TemplateBinding ScrollViewer.HorizontalScrollBarVisibility}"
    ScrollViewer.VerticalScrollBarVisibility="{TemplateBinding ScrollViewer.VerticalScrollBarVisibility}"/>
<Image Source="CirclePicture.png"
    x:Name="WaitPart"
    RenderTransformOrigin="0.5,0.5"
    Width="16"
    Height="16"
    Visibility="Collapsed"
    IsHitTestVisible="False">
    <Image.RenderTransform>
        <RotateTransform  />
    </Image.RenderTransform>
</Image>
于 2013-07-19T12:34:34.760 に答える