4

MVVMで成功メッセージを表示するために、テキストブロックをフェードインしてフェードアウトしようとしていますが、再びフェードアウトさせることができません。私はこれを見ました：WPF MVVMプロパティ変更アニメーションですが、実際には従いません。ここにスタイルがあります：

 <Style TargetType="TextBlock" x:Key="fadeinout">
        <Style.Triggers>
            <EventTrigger RoutedEvent="Binding.TargetUpdated">
                <BeginStoryboard>
                    <Storyboard>
                        <DoubleAnimation Storyboard.TargetProperty="(TextBlock.Opacity)" From="0.0" To="1.0" Duration="0:0:5"/>
                        <DoubleAnimation Storyboard.TargetProperty="(TextBlock.Opacity)" From="1.0" To="0.0" Duration="0:0:5"/>
                    </Storyboard>
                </BeginStoryboard>
            </EventTrigger>
        </Style.Triggers>
    </Style>

とビューで

<TextBlock Text="{Binding Path=SuccessMessage}" Style="{StaticResource fadeinout}"  Width="60"/>

ビューモデルでは、保存後に次のようにします。

SuccessMessage = "Success";

ここで、SuccessMessageは、PropertyChangedを呼び出すセッターを持つプロパティです。テキストを「保存に成功しました」のように修正したいと思いますが、いずれにせよ、ビューモデルでテキストブロックをフェードインしてから再びフェードアウトさせ、ユーザーが再度保存した場合に繰り返すことができるようにしたいと思います。私は何をする必要がありますか？

編集（8時間自己回答できません）：NotifyOnTargetUpdatedをバインディングに追加する必要がありましたが、フェードインおよびフェードアウトします：

 <TextBlock Text="{Binding SuccessMessage, NotifyOnTargetUpdated=True}" Style="{StaticResource fadeInOut}"

これで、Jakobの回答に従って1つのTextBoxができました（ただし、EventTriggerをBinding.TargetUpdatedに変更しました）、上記のような1つのTextBlockと、次のような1つのTextBlockインラインがあります。

<TextBlock Text="{Binding SuccessMessage, NotifyOnTargetUpdated=True}" Opacity="0" x:Name="tbMessage" Width="60" HorizontalAlignment="Left">
        <TextBlock.Triggers>
            <EventTrigger RoutedEvent="Binding.TargetUpdated">
                <BeginStoryboard>
                    <Storyboard>
                        <DoubleAnimation Storyboard.TargetName="tbMessage" Storyboard.TargetProperty="Opacity" To="1" BeginTime="0:0:0" Duration="0:0:1" />
                        <DoubleAnimation Storyboard.TargetName="tbMessage" Storyboard.TargetProperty="Opacity" To="0" BeginTime="0:0:3" Duration="0:0:1"/>
                    </Storyboard>
                </BeginStoryboard>
            </EventTrigger>
        </TextBlock.Triggers>
    </TextBlock>

保存するたびに、3つすべてがフェードインおよびフェードアウトします。奇妙なことに、同じタイミングを使用しているにもかかわらず、テンプレート化されたものは他の2つよりわずかに遅れています。

4

1 に答える 1

2

設定してみてくださいDoubleAnimation.BeginTime。こうすることで、フェードアウト アニメーションの開始時間を延期して、フェードインが終了する前に開始しないようにします。次の例では、フェードアウトする前にテキストが 2 秒間表示されます。

<DoubleAnimation Storyboard.TargetProperty="(TextBlock.Opacity)" From="0.0" To="1.0" Duration="0:0:5" BeginTime="0:0:0" />
<DoubleAnimation Storyboard.TargetProperty="(TextBlock.Opacity)" From="1.0" To="0.0" Duration="0:0:5" BeginTime="0:0:7" />

別の方法として使用できますAutoReverseが、フェードアウトする前にテキストを表示する時間を制御することはできません。

アップデート：

TextBlock にはトリガーで使用できる適切なイベントがないため、イベント トリガーでフェードを TextBlock と連携させるには問題があるようです。以下は、TextBlock の代わりに TextBox を使用した実際の例です。TextBlock はより軽量ですが、TextBox のスタイルをいつでも TextBlock のように見せることができます。

<TextBox Text="{Binding SuccessMessage}" Opacity="0" x:Name="textBoxMessage" >
    <TextBox.Triggers>
        <EventTrigger RoutedEvent="TextBoxBase.TextChanged">
            <BeginStoryboard>
                <Storyboard>
                    <DoubleAnimation 
                                Storyboard.TargetName="textBoxMessage" 
                                Storyboard.TargetProperty="Opacity"
                                To="1" 
                                BeginTime="0:0:0" Duration="0:0:1"
                                />
                    <DoubleAnimation 
                                Storyboard.TargetName="textBoxMessage" 
                                Storyboard.TargetProperty="Opacity"
                                To="0" 
                                BeginTime="0:0:3" Duration="0:0:1"
                                />
                </Storyboard>
            </BeginStoryboard>
        </EventTrigger>
    </TextBox.Triggers>
</TextBox>
于 2012-04-24T12:37:39.537 に答える