- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我有一个数据对象——一个名为 Notification
的自定义类-- 暴露一个 IsCritical
属性(property)。这个想法是,如果通知将过期,它有一个有效期,并且应该引起用户的注意。
想象一下这个测试数据的场景:
_source = new[] {
new Notification { Text = "Just thought you should know" },
new Notification { Text = "Quick, run!", IsCritical = true },
};
ItemsControl
中具有脉动的背景。这是一个简单的数据模板摘录,显示了我考虑在灰色和黄色之间设置动画背景的方法。
<DataTemplate DataType="Notification">
<Border CornerRadius="5" Background="#DDD">
<Border.Triggers>
<EventTrigger RoutedEvent="Border.Loaded">
<BeginStoryboard>
<Storyboard>
<ColorAnimation
Storyboard.TargetProperty="Background.Color"
From="#DDD" To="#FF0" Duration="0:0:0.7"
AutoReverse="True" RepeatBehavior="Forever" />
</Storyboard>
</BeginStoryboard>
</EventTrigger>
</Border.Triggers>
<ContentPresenter Content="{TemplateBinding Content}" />
</Border>
</DataTemplate>
IsCritical
的值为条件。 .如果边界值为
false
,则默认背景颜色为
#DDD
应该保持。
最佳答案
这个谜题的最后一部分是... DataTriggers .您所要做的就是将一个 DataTrigger 添加到您的 DataTemplate,将其绑定(bind)到 IsCritical 属性,并且只要它为真,您就可以在 EnterAction/ExitAction 中启动和停止突出显示 Storyboard 。这是带有一些硬编码快捷方式的完全有效的解决方案(您绝对可以做得更好):
Xaml :
<Window x:Class="WpfTest.Window1"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="Notification Sample" Height="300" Width="300">
<Window.Resources>
<DataTemplate x:Key="NotificationTemplate">
<Border Name="brd" Background="Transparent">
<TextBlock Text="{Binding Text}"/>
</Border>
<DataTemplate.Triggers>
<DataTrigger Binding="{Binding IsCritical}" Value="True">
<DataTrigger.EnterActions>
<BeginStoryboard Name="highlight">
<Storyboard>
<ColorAnimation
Storyboard.TargetProperty="(Panel.Background).(SolidColorBrush.Color)"
Storyboard.TargetName="brd"
From="#DDD" To="#FF0" Duration="0:0:0.5"
AutoReverse="True" RepeatBehavior="Forever" />
</Storyboard>
</BeginStoryboard>
</DataTrigger.EnterActions>
<DataTrigger.ExitActions>
<StopStoryboard BeginStoryboardName="highlight"/>
</DataTrigger.ExitActions>
</DataTrigger>
</DataTemplate.Triggers>
</DataTemplate>
</Window.Resources>
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="*"/>
<RowDefinition Height="Auto"/>
</Grid.RowDefinitions>
<ItemsControl ItemsSource="{Binding Notifications}"
ItemTemplate="{StaticResource NotificationTemplate}"/>
<Button Grid.Row="1"
Click="ToggleImportance_Click"
Content="Toggle importance"/>
</Grid>
</Window>
using System.Collections.Generic;
using System.ComponentModel;
using System.Windows;
namespace WpfTest
{
public partial class Window1 : Window
{
public Window1()
{
InitializeComponent();
DataContext = new NotificationViewModel();
}
private void ToggleImportance_Click(object sender, RoutedEventArgs e)
{
((NotificationViewModel)DataContext).ToggleImportance();
}
}
public class NotificationViewModel
{
public IList<Notification> Notifications
{
get;
private set;
}
public NotificationViewModel()
{
Notifications = new List<Notification>
{
new Notification
{
Text = "Just thought you should know"
},
new Notification
{
Text = "Quick, run!",
IsCritical = true
},
};
}
public void ToggleImportance()
{
if (Notifications[0].IsCritical)
{
Notifications[0].IsCritical = false;
Notifications[1].IsCritical = true;
}
else
{
Notifications[0].IsCritical = true;
Notifications[1].IsCritical = false;
}
}
}
public class Notification : INotifyPropertyChanged
{
private bool _isCritical;
public string Text { get; set; }
public bool IsCritical
{
get { return _isCritical; }
set
{
_isCritical = value;
InvokePropertyChanged("IsCritical");
}
}
public event PropertyChangedEventHandler PropertyChanged;
private void InvokePropertyChanged(string name)
{
var handler = PropertyChanged;
if (handler != null)
{
handler(this, new PropertyChangedEventArgs(name));
}
}
}
}
关于WPF - 使动画的执行以绑定(bind)数据项的属性为条件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/1294353/
我正在尝试弄清楚如何将一些数据从手机同步到 Android Wear 设备,并且我已经阅读了 developer.android.com 上关于数据项的文章,但是我仍然不清楚究竟如何使用它们。具体来说
$("selector").data("name", null); console.log($("selector").data("name")); 这将打印未定义。 有没有办法在元素的 jQuery
我使用 LINQ 从 CheckBoxList 控件中检索选中的项目: 这里是 LINQ: IEnumerable allChecked = (from ListItem item in Ch
在尝试为 C 堆栈构建测试平台时,我遇到了如何正确显示它的问题。我已经检查了六本书,它们都有一种将堆栈插入堆栈或从堆栈弹出的方法,但没有一本示例说明您如何实际使用这些例程。谁能告诉我模式,这样我就可以
我尝试在 AppEngine 中使用 urlfetch 将 POST 数据发送到服务器。其中一些 POST 数据项具有相同的名称,但具有不同的值。 form_fields = { "data":
我有以下情况(使用 KendoUI): 我有一个绑定(bind)到数据源的网格。当我在网格中选择一行时,我会调用其“change”事件来让所选的 dataItem e 通过其他 HTML 元素显示其值
我基本上是在构建一个快速而肮脏的类(class)目录,其中包含多个层次类别以及属于不同级别的这些类别的类(class)。 在旧的实现中,每个主要类别都有自己的 HTML 页面,与该类别相关的所有类(c
我是 MVC 和 ASP.NET 的新手,希望学习一些东西,所以我正在尝试制作一些简单的应用程序来学习来龙去脉。 好吧,我正在尝试让一个下拉框显示一个图书列表,它会在其中显示图书的标题,但会发布 bo
此行为导致我的项目出现问题。这是正在发生的事情的简化版本。我想了解为什么会发生这种情况,以及如何避免这种情况。我已将 vue 加载到我的网站头部: 这是 Vue 对象: vueObject = ne
我是一名优秀的程序员,十分优秀!