用户在TextBox中按下Enter时如何启动动画

FoggyFinder

我要在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>

主视图模型

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

它有效,但是我想找到一种更好的方法而不将控制作为参数传递

里德·科普西(Reed Copsey)

它有效,但是我想找到一种更好的方法而不将控制作为参数传递

假设您要开始制作动画,这是与“纯视图”相关的代码。

实际上,我会将其移出ViewModel并移入View。

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

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

当用户按下“ Enter”或“ Return”时,如何在文本字段中插入<p>标记?

来自分类Dev

在奇异果中更新属性时如何启动动画?

来自分类Dev

如何在每次点击时启动动画

来自分类Dev

如何在 Tkinter 中为事件启动动画循环?

来自分类Dev

用户在C ++中按Enter时如何获取输出

来自分类Dev

如何防止用户按下ENTER键?

来自分类Dev

在CSS中悬停时如何停止自动滚动动画?

来自分类Dev

按下按钮时如何停止动画

来自分类Dev

用户按下Enter键时如何触发标签页

来自分类Dev

当用户按下ENTER键时,CSS会更改Firefox中的默认按钮

来自分类Dev

用户在输入=文本中按下Enter时的jQuery函数commit(),也以相同的形式提交输入=提交

来自分类Dev

如何在Flutter上的页面加载时自动启动动画?

来自分类Dev

Matplotlib:单击启动动画的按钮后如何保存动画?

来自分类Dev

如何在没有图形用户界面的情况下启动动脉示例

来自分类Dev

如何更改Android –启动徽标(不启动动画)

来自分类Dev

如何更改Android –启动徽标(不启动动画)

来自分类Dev

如何在Android的viewPager的每个页面中显示/启动动画?

来自分类Dev

当用户在玩我的猜谜游戏时按下 Enter 键时,如何打印字符串?

来自分类Dev

返回前景时重新启动动画

来自分类Dev

返回前景时重新启动动画

来自分类Dev

如何为Dart中的滚动动画?

来自分类Dev

当用户按下Python中的Tab键时,如何接收结束的用户输入?

来自分类Dev

按下Enter键时如何从gridview窗口窗体中获取行索引

来自分类Dev

jQuery Mobile Listview自动完成功能:如何在用户按下Enter键时触发功能?

来自分类Dev

如何在页面上连接按钮,以便在用户按下Enter键时单击该按钮?

来自分类Dev

如何停止并重新启动动画gif

来自分类Dev

如何删除创建的子代,然后重新启动动画

来自分类Dev

如何使用Java脚本停止和启动动画?

来自分类Dev

WPF从MVVM中的代码隐藏启动动画

Related 相关文章

  1. 1

    当用户按下“ Enter”或“ Return”时,如何在文本字段中插入<p>标记?

  2. 2

    在奇异果中更新属性时如何启动动画?

  3. 3

    如何在每次点击时启动动画

  4. 4

    如何在 Tkinter 中为事件启动动画循环?

  5. 5

    用户在C ++中按Enter时如何获取输出

  6. 6

    如何防止用户按下ENTER键?

  7. 7

    在CSS中悬停时如何停止自动滚动动画?

  8. 8

    按下按钮时如何停止动画

  9. 9

    用户按下Enter键时如何触发标签页

  10. 10

    当用户按下ENTER键时,CSS会更改Firefox中的默认按钮

  11. 11

    用户在输入=文本中按下Enter时的jQuery函数commit(),也以相同的形式提交输入=提交

  12. 12

    如何在Flutter上的页面加载时自动启动动画?

  13. 13

    Matplotlib:单击启动动画的按钮后如何保存动画?

  14. 14

    如何在没有图形用户界面的情况下启动动脉示例

  15. 15

    如何更改Android –启动徽标(不启动动画)

  16. 16

    如何更改Android –启动徽标(不启动动画)

  17. 17

    如何在Android的viewPager的每个页面中显示/启动动画?

  18. 18

    当用户在玩我的猜谜游戏时按下 Enter 键时,如何打印字符串?

  19. 19

    返回前景时重新启动动画

  20. 20

    返回前景时重新启动动画

  21. 21

    如何为Dart中的滚动动画?

  22. 22

    当用户按下Python中的Tab键时,如何接收结束的用户输入?

  23. 23

    按下Enter键时如何从gridview窗口窗体中获取行索引

  24. 24

    jQuery Mobile Listview自动完成功能:如何在用户按下Enter键时触发功能?

  25. 25

    如何在页面上连接按钮,以便在用户按下Enter键时单击该按钮?

  26. 26

    如何停止并重新启动动画gif

  27. 27

    如何删除创建的子代,然后重新启动动画

  28. 28

    如何使用Java脚本停止和启动动画?

  29. 29

    WPF从MVVM中的代码隐藏启动动画

热门标签

归档