wpf - 当用户在 TextBox 中按下 Enter 时如何开始动画

Question

当在 TextBox 中按下“Enter”时，我想开始动画。我还没有找到正确的事件，所以我做了以下

XAML

    <Window.DataContext>
        <local:MainViewModel/>
    </Window.DataContext>
    <Window.Resources>
        <Storyboard x:Key="testAnimation">
            <BooleanAnimationUsingKeyFrames
                                    FillBehavior="HoldEnd"
                                    Storyboard.TargetName="txtB"
                                    Storyboard.TargetProperty="IsEnabled">
                <DiscreteBooleanKeyFrame KeyTime="00:00:00" 
                                                     Value="False" />
            </BooleanAnimationUsingKeyFrames>
            <DoubleAnimation 
                                    Storyboard.TargetName="rtbl"
                                    Storyboard.TargetProperty="Opacity" 
                                    From="0"
                                    To="1"  
                                    Duration="0:0:2"
                                    AutoReverse="True">
            </DoubleAnimation>
            <BooleanAnimationUsingKeyFrames
                                    FillBehavior="HoldEnd"
                                    Storyboard.TargetName="txtB"
                                    Storyboard.TargetProperty="IsEnabled"
                                    BeginTime="0:0:4"
                                    >
                <DiscreteBooleanKeyFrame KeyTime="00:00:00" 
                                                     Value="True" />
            </BooleanAnimationUsingKeyFrames>
        </Storyboard>
    </Window.Resources>
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto"></RowDefinition>
            <RowDefinition Height="Auto"></RowDefinition>
        </Grid.RowDefinitions>
        <TextBlock Grid.Row="0" Name="rtbl" Opacity="0" HorizontalAlignment="Center" Margin="10" FontSize="30" Text="{Binding Text}"></TextBlock>
        <TextBox Grid.Row="1" Name="txtB"  IsEnabled="True"  HorizontalAlignment="Center" 
                 Margin="10" FontSize="30" Text="{Binding Input, UpdateSourceTrigger=PropertyChanged}" MinWidth="150"
                 >
            <TextBox.InputBindings>
                <KeyBinding Command="{Binding NextCommand}" Key="Enter"
                    CommandParameter="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type Window}}}">
                </KeyBinding>
            </TextBox.InputBindings>
        </TextBox>
    </Grid>
</Window>

主 View 模型

type MainViewModel() as self = 
    inherit ViewModelBase()  

    let rand = Random()

    let text = self.Factory.Backing(<@ self.Text @>, rand.Next())
    let input = self.Factory.Backing(<@ self.Input @>, "")

    let goNext (param:obj) =
        text.Value <- rand.Next()
        input.Value <- ""
        let control = param :?> Window
        let animation = control.FindResource("testAnimation") :?> Storyboard
        animation.Begin()

    let nextcommand = self.Factory.CommandSyncParam(goNext)

    member self.NextCommand = nextcommand
    member self.Text with get() = text.Value
    member self.Input with get() = input.Value and set v = input.Value <- v

它有效，但我想找到一种更好的方法，而无需将控制权作为参数传递

Answer 1

It works, but I'd like to find a better way without passing control as a parameter

鉴于您正在启动动画，这是“纯 View ”相关代码。

我实际上会将它从您的 ViewModel 移到您的 View 中。

我不使用命令，而是订阅 PreviewTextInput TextBox 上的事件，并在 View 本身后面的代码中处理启动动画。