Question

今天是我开始使用WPF的好日子，这是我正在创建的一个启动器。使用以下代码，我设法将结果显示在屏幕截图中：

<Grid>
        <ItemsControl ItemsSource="{Binding Programs}">
            <ItemsControl.ItemsPanel>
                <ItemsPanelTemplate>
                    <WrapPanel Orientation="Horizontal" VerticalAlignment="Center" HorizontalAlignment="Center" />
                </ItemsPanelTemplate>
            </ItemsControl.ItemsPanel>
            <ItemsControl.ItemTemplate>
                <DataTemplate>
                    <Button Content="{Binding Text}" Background="Transparent" Foreground="White" Width="128" Height="150" >
                        <Button.RenderTransform>
                            <TransformGroup>
                                <ScaleTransform />
                            </TransformGroup>
                        </Button.RenderTransform>
                        <Button.Template>
                            <ControlTemplate TargetType="Button">
                                <Grid>
                                    <Grid.RowDefinitions>
                                        <RowDefinition Height="*" />
                                        <RowDefinition Height="Auto" />
                                    </Grid.RowDefinitions>

                                    <Image Grid.Row="0" Source="{Binding Image}" Height="128" />
                                    <ContentPresenter Grid.Row="1" HorizontalAlignment="Center" Margin="3,10" />
                                    <Rectangle Grid.Row="0" Fill="{TemplateBinding Background}" />
                                    <Rectangle Grid.Row="1" Fill="{TemplateBinding Background}" />
                                </Grid>
                            </ControlTemplate>
                        </Button.Template>
                        <Button.Resources>
                            <Storyboard SpeedRatio="4" x:Key="MouseEnterStoryboard" x:Name="MouseEnterStoryboard">
                                <ColorAnimation Storyboard.TargetProperty="(Button.Background).(SolidColorBrush.Color)" To="#22FFFFFF"></ColorAnimation>
                            </Storyboard>
                            <Storyboard SpeedRatio="4" x:Key="MouseLeaveStoryboard" x:Name="MouseLeaveStoryboard">
                                <ColorAnimation Storyboard.TargetProperty="(Button.Background).(SolidColorBrush.Color)" To="Transparent"></ColorAnimation>
                            </Storyboard>
                            <Storyboard Duration="00:00:00.05" x:Key="MouseClickStoryboard" AutoReverse="True">
                                <DoubleAnimation To="0.8" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[0].(ScaleTransform.ScaleX)"/>
                                <DoubleAnimation To="0.8" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[0].(ScaleTransform.ScaleY)"/>
                            </Storyboard>
                            <Storyboard x:Key="WindowLoadedStoryboard">
                                <DoubleAnimation Storyboard.TargetProperty="Opacity" From="0" To="1" Duration="00:00:01" />
                            </Storyboard>
                        </Button.Resources>
                        <Button.Triggers>
                            <EventTrigger RoutedEvent="Mouse.MouseEnter">
                                <BeginStoryboard Storyboard="{StaticResource MouseEnterStoryboard}" />
                            </EventTrigger>
                            <EventTrigger RoutedEvent="Mouse.MouseLeave">
                                <BeginStoryboard Storyboard="{StaticResource MouseLeaveStoryboard}" />
                            </EventTrigger>
                            <EventTrigger RoutedEvent="Button.Click">
                                <BeginStoryboard Storyboard="{StaticResource MouseClickStoryboard}" />
                            </EventTrigger>
                            <EventTrigger RoutedEvent="Window.Loaded">
                                <BeginStoryboard Storyboard="{StaticResource WindowLoadedStoryboard}"></BeginStoryboard>
                            </EventTrigger>
                        </Button.Triggers>
                    </Button>
                </DataTemplate>
            </ItemsControl.ItemTemplate>
        </ItemsControl>
    </Grid>

截图：

enter image description here

现在，对于绑定到此控件的列表中的每个项目，它将创建一个按钮。我将如何以编程方式访问此按钮，更好的是，我如何以编程方式访问其中一个故事板，因为分配了一个名称（x：对他们来说根本就不会这样做......

另外，我如何逐个动画按钮？目前它们每个都在同一时间淡出（@ WindowLoadedStoryboard），但我想让每个按钮一个接一个地淡入淡出延迟，以创造一个很好的效果。我怎么做到这一点？

希望有人能为我回答这两个问题！

问候！

Answer 1

您访问DataTemplate中定义的元素的问题是由于您在DataTemplate中定义了这些元素而引起的......这些元素可以在许多不同类型的UI容器控件中呈现。您可以在MSDN的How to: Find DataTemplate-Generated Elements页面中找到该解决方案。

首先需要获取包含已应用DataTemplate项的相关容器控件。接下来，您需要从该容器控件中获取ContentPresenter，然后您可以从DataTemplate获取ContentPresenter。最后，您可以从DataTemplate访问指定的元素。从链接页面：

// Getting the currently selected ListBoxItem 
// Note that the ListBox must have 
// IsSynchronizedWithCurrentItem set to True for this to work
ListBoxItem myListBoxItem = (ListBoxItem)(myListBox.ItemContainerGenerator.
    ContainerFromItem(myListBox.Items.CurrentItem));

// Getting the ContentPresenter of myListBoxItem
ContentPresenter myContentPresenter = FindVisualChild<ContentPresenter>(myListBoxItem);

// Finding textBlock from the DataTemplate that is set on that ContentPresenter
DataTemplate myDataTemplate = myContentPresenter.ContentTemplate;
TextBlock myTextBlock = 
    (TextBlock)myDataTemplate.FindName("textBlock", myContentPresenter);

// Do something to the DataTemplate-generated TextBlock
MessageBox.Show("The text of the TextBlock of the selected list item: " + 
    myTextBlock.Text);

访问ItemsControl项目并逐个动画

1 个答案: