我正在尝试在 WPF 中制作自定义控件。我希望它模拟可以闪烁的 LED 的行为。
控制有三种状态:开、关和闪烁。
我知道如何通过背后的代码设置开和关,但是这个 WPF 动画的东西让我发疯!!!!我无法制作任何动画。计划是拥有一个名为 state 的属性。当用户将值设置为闪烁时,我希望控件在绿色和灰色之间交替。我假设我在这里需要一个依赖属性,但不知道。
我之前有更多的 xaml,但只是将其全部删除。它似乎没有做任何事情。
我很乐意以最佳实践方式做到这一点,但在这一点上,我会采取任何措施。在这一点上,我正在编写一个手动更改颜色的线程。
<UserControl x:Class="WpfAnimation.LED"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Height="300" Width="300">
<Grid>
<Ellipse x:Name="MyLight" Height="Auto" Width="Auto"/>
</Grid>
</UserControl>
最佳答案
您可以使用自动反转和重复的动画来做到这一点(这是针对 Silverlight):
<UserControl
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
x:Class="Blinker.MainPage"
Width="640" Height="480" Loaded="UserControl_Loaded">
<UserControl.Resources>
<Storyboard x:Name="Blink" AutoReverse="True" RepeatBehavior="Forever">
<ColorAnimationUsingKeyFrames BeginTime="00:00:00"
Storyboard.TargetName="ellipse"
Storyboard.TargetProperty="(Shape.Fill).(SolidColorBrush.Color)">
<EasingColorKeyFrame KeyTime="00:00:01" Value="Gray"/>
</ColorAnimationUsingKeyFrames>
</Storyboard>
</UserControl.Resources>
<Grid x:Name="LayoutRoot" Background="White">
<Ellipse x:Name="ellipse" Fill="Green" Stroke="Black"/>
</Grid>
</UserControl>
然后在控件加载或设置属性时启动动画 - 除非您不需要依赖属性
private bool blinking;
public bool IsBlinking
{
get
{
return blinking;
}
set
{
if (value)
{
this.Blink.Begin();
}
else
{
this.Blink.Stop();
}
this.blinking = value;
}
}
或在启动时:
private void UserControl_Loaded(object sender, System.Windows.RoutedEventArgs e)
{
this.Blink.Begin();
}
这是在 WPF 中执行此操作的另一种方法 - 使用 VisualStateManager - 这也适用于 Silverlight:
<UserControl
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
x:Class="BlinkerApp.Blinker"
x:Name="UserControl"
d:DesignWidth="100" d:DesignHeight="100">
<Grid x:Name="LayoutRoot">
<VisualStateManager.VisualStateGroups>
<VisualStateGroup x:Name="BlinkStates">
<VisualState x:Name="Blinking">
<Storyboard AutoReverse="True" RepeatBehavior="Forever">
<ColorAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="ellipse" Storyboard.TargetProperty="(Shape.Fill).(SolidColorBrush.Color)">
<SplineColorKeyFrame KeyTime="00:00:01" Value="Gray"/>
</ColorAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
<VisualState x:Name="Stopped"/>
</VisualStateGroup>
</VisualStateManager.VisualStateGroups>
<Ellipse x:Name="ellipse" Fill="Green" Stroke="Black"/>
</Grid>
然后让 IsBlinking 属性切换视觉状态:
namespace BlinkerApp
{
using System.Windows;
using System.Windows.Controls;
/// <summary>
/// Interaction logic for Blinker.xaml
/// </summary>
public partial class Blinker : UserControl
{
private bool blinking;
public Blinker()
{
this.InitializeComponent();
}
public bool IsBlinking
{
get
{
return blinking;
}
set
{
if (value)
{
VisualStateManager.GoToState(this, "Blinking", true);
}
else
{
VisualStateManager.GoToState(this, "Stopped", true);
}
this.blinking = value;
}
}
}
}
关于.net - 如何让椭圆闪烁?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/1457892/