[UWP] XAML边框动画 [英] [UWP]XAML Border animation

问题描述

您好，

我想设置边框宽度的动画。这就是我所拥有的：

< Border x：Name =" SelectedLine"高度= QUOT; 2英寸宽度= QUOT; 10" VerticalAlignment = QUOT;底座"背景= QUOT;透明"余量= QUOT; 30,0,0,0"> 
< Border.Triggers> 
< EventTrigger RoutedEvent =" Border.Loaded"> 
< BeginStoryboard> 
< Storyboard> 
< DoubleAnimation Storyboard.TargetName =" BottomLine" Storyboard.TargetProperty = QUOT;宽度"从= QUOT; 10"为了= QUOT; 100"持续时间=" 0：0：1" /> 
< / Storyboard> 
< / BeginStoryboard> 
< / EventTrigger> 
< /Border.Triggers> 
< / Border> 

这不起作用。好像我错过了什么。我想在1秒内将宽度从10到100动画。但不管那个边界的宽度总是10，不管我等多久。

---

开发技术员，微软认证专家

解决方案

最近发生了这个问题：

< Border x：Name =" SelectedLine"高度= QUOT; 2英寸宽度= QUOT; 10" VerticalAlignment = QUOT;中心"背景= QUOT;透明"余量= QUOT; 30,0,0,0" 
 BorderThickness =" 2" 
 BorderBrush =" Black" > 
< Border.Triggers> 
< EventTrigger RoutedEvent =" Border.Loaded"> 
< BeginStoryboard> 
< Storyboard> 
< DoubleAnimation Storyboard.TargetName =" SelectedLine" Storyboard.TargetProperty = QUOT;宽度"从= QUOT; 10"为了= QUOT; 100"持续时间=" 0：0：1" 
  EnableDependentAnimation =" True"  /> 
< / Storyboard> 
< / BeginStoryboard> 
< / EventTrigger> 
< /Border.Triggers> 
< / Border> 

将'EanbleDependentAnimation'的属性设置为true。

并在此处记录：  https ：//docs.microsoft.com/en-us/uwp/api/windows.ui.xaml.media.animation.doubleanimation

Hello,

I want to animate the Width of Border. This is what I have:

<Border x:Name="SelectedLine" Height="2" Width="10" VerticalAlignment="Bottom" Background="Transparent" Margin="30,0,0,0">
  <Border.Triggers>
    <EventTrigger RoutedEvent="Border.Loaded">
      <BeginStoryboard>
        <Storyboard>
          <DoubleAnimation Storyboard.TargetName="BottomLine" Storyboard.TargetProperty="Width" From="10" To="100" Duration="0:0:1"/>
        </Storyboard>
      </BeginStoryboard>
    </EventTrigger>
  </Border.Triggers>
</Border>

This is not working. It seems I am missing something. I would like to animate Width from 10 to 100 in 1 second. But instead of that width of border is always 10, no matter how long I wait.

---

Development Technician, Microsoft Certified Professional

解决方案

Happen to learn this recently:

        <Border x:Name="SelectedLine" Height="2" Width="10" VerticalAlignment="Center" Background="Transparent" Margin="30,0,0,0"
                BorderThickness="2"
                BorderBrush="Black" >
            <Border.Triggers>
                <EventTrigger RoutedEvent="Border.Loaded">
                    <BeginStoryboard>
                        <Storyboard>
                            <DoubleAnimation Storyboard.TargetName="SelectedLine" Storyboard.TargetProperty="Width" From="10" To="100" Duration="0:0:1"
                                             EnableDependentAnimation="True"/>
                        </Storyboard>
                    </BeginStoryboard>
                </EventTrigger>
            </Border.Triggers>
        </Border>

Set the property of 'EanbleDependentAnimation' to true.

And document here: https://docs.microsoft.com/en-us/uwp/api/windows.ui.xaml.media.animation.doubleanimation.

这篇关于[UWP] XAML边框动画的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！