Question

我开始通过重写现有的ASP.NET应用程序来启动Silverlight（虽然它目前感觉相反） - 这是一个很好的开始，就像我想的那样。

我已“掌握”从数据库，通过服务和数据网格中提取数据，并在行中填充图像元素。到目前为止一切都很好。

现在我陷入困境并且头疼！

我想在每行的最后一列添加一个简单的动画（绿色矩形在红色矩形上移动以显示％进度），但无法将其连线。

我的xaml看起来像这样：

<data:DataGrid.Columns>
.
.
.
.
<data:DataGridTemplateColumn>
    <data:DataGridTemplateColumn.CellTemplate>
        <DataTemplate>
            <StackPanel x:Name="AnimationPanel">
                <StackPanel.Resources>
                    <Storyboard x:Key="ShowProgress">
                        <DoubleAnimation Storyboard.TargetProperty="Width"
                                        Storyboard.TargetName="goalProgressBar_Complete"
                                         From="0" To="50"
                                        Duration="0:0:5">
                        </DoubleAnimation>
                    </Storyboard>
                </StackPanel.Resources>
                <Rectangle x:Name="goalProgressBar_Complete"
                           Width="1" Height="100"
                           Fill="#0aa60e"></Rectangle>
            </StackPanel>
        </DataTemplate>
    </data:DataGridTemplateColumn.CellTemplate>
</data:DataGridTemplateColumn>
</data:DataGrid.Columns>

这显然是错误的（因为它不起作用），我开始认为以这种方式向Datagrid添加动画是不可能的。我一直在努力寻找一段代码，虽然已经取得了一些成果，但它们并没有达到任何目的。

我是在尝试做一些Silverlight根本不支持的事情，还是我错过了一些非常简单的事情？

提前致谢。

更新虽然我还没有走出困境，但我已经设法用适当的列运行动画。 MasterMax提供的答案让我看看EventTriggers，修改后的xaml看起来像这样：

<data:DataGridTemplateColumn>
    <data:DataGridTemplateColumn.CellTemplate>
        <DataTemplate>
            <Rectangle x:Name="GoalProgress" Height="100" Width="1" Fill="Green">
                <Rectangle.Triggers>
                    <EventTrigger RoutedEvent="Rectangle.Loaded">
                        <EventTrigger.Actions>
                            <BeginStoryboard>
                                <Storyboard>
                                    <DoubleAnimation Storyboard.TargetProperty="Width"
                                             Storyboard.TargetName="GoalProgress"
                                             From="0" To="50" Duration="0:0:5">
                                    </DoubleAnimation>
                                </Storyboard>
                            </BeginStoryboard>
                        </EventTrigger.Actions>
                    </EventTrigger>
                </Rectangle.Triggers>
            </Rectangle>
        </DataTemplate>
    </data:DataGridTemplateColumn.CellTemplate>
</data:DataGridTemplateColumn>

现在我需要做的就是绑定'To'属性中的％值并添加我的基础红色矩形。毫无疑问，这不会像我现在所希望的那样容易，但是否则会不会很有趣; - ）

Answer 1

在我看来，你实际上并没有玩故事板。您需要为矩形添加鼠标输入和鼠标离开处理程序，然后相应地播放和停止故事板。确保停止然后在输入命令中播放故事板（否则会产生一些有趣的副作用）。

更新

好的，在Silverlight中度过了我的一天，我不太接近帮助。我在查看包含DataGrid的Silverlight程序集中的generic.xaml文件。你可以考虑看看那里。从我所看到的，他们通过控制模板实现了行细节转换的一些功能，尽管我还没有查看相应的代码以确定具体如何。

Answer 2

尝试将其附加到Datagrid的EventTrigger。类似的东西：

<Window.Triggers>
        <EventTrigger RoutedEvent="Window.Loaded">
            <BeginStoryboard>
                <Storyboard>
                    <DoubleAnimation Name="EntranceAnimation"
                        Storyboard.TargetName="MainWindow" 
                        Storyboard.TargetProperty="Opacity"
                        From="0.0"
                        To="1.0"
                        Duration="0:0:3">
                    </DoubleAnimation>
                </Storyboard>
                </BeginStoryboard>
        </EventTrigger>
    </Window.Triggers>

在您的情况下，您将寻找DataGrid.Loaded事件（或类似的东西）。这对我有用，而且我在页面加载时淡化了整个窗口。

Answer 3

对于那种类型的应用程序，动画可能不是最佳解决方案。您可能想尝试将移动矩形的width属性绑定到应用程序中的变量，或者随着进度的变化调整每个tick的宽度。

Silverlight应用程序的DataGrid中的动画 - 如何？

3 个答案:

更新