访问ItemsControl的项目和动画逐个 [英] Access ItemsControl Items and Animate One by One

查看:191
本文介绍了访问ItemsControl的项目和动画逐个的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

今天是个好日子,因为我开始与WPF,这对于一个发射器我创建。
使用下面code,我设法得到的结果的截图中可以看出:

Today is a good day since I started with WPF, this for a launcher I'm creating. Using the following code, I managed to get the result to be seen in the screenshot:

<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>

截图:

现在,在绑定到该控制列表中每个项目,它会创建一个按钮。
我将如何编程方式访问该按钮,更好的是,我将如何访问故事板的一个自编程分配一个名称(X:他们根本不会做它似乎是招...

Now, for each item in the list bound to this control, it will create a button. How would I access this button programmatically, better yet, how would I access one of the Storyboards programatically since assigning a name (x:to them simply won't do the trick it seems...

另外,我怎么能动画按钮,一个接一个?目前,他们每个淡出在精确的同一时间(@ WindowLoadedStoryboard),但我想用一用一短的延迟,让一个每个按钮褪色,创造一个很好的效果。我将如何实现这一目标?

Also, how can I animate the buttons one by one? Currently they each fade in at exact the same time (@ WindowLoadedStoryboard), but I would like to let each button fade in one by one with a short delay, to create a nice effect. How would I achieve this?

希望有人能回答这些问题2我!

Hope someone can answer these 2 questions for me!

您好!

推荐答案

您有访问中定义的元素问题的DataTemplate ,因为你所定义的这些元素引起的DataTemplate ...这些元素可以在许多不同类型的UI容器控件的呈现。您可以在如何解决:查找DataTemplate中生成的从MSDN元素页面。

Your problem with accessing the elements defined in the DataTemplate is caused because you defined those elements in a DataTemplate... those elements could be rendered in many different types of UI container controls. You can find the solution in the How to: Find DataTemplate-Generated Elements page from MSDN.

您首先需要获得包含有过的的DataTemplate 适用于它的项目的相关容器控件举行。接下来,你需要获得内容presenter 从容器控件,然后就可以得到的DataTemplate 内容presenter 。最后,你可以从的DataTemplate 访问命名的元素。从所链接的页面:

You first need to get hold of the relevant container control that contains the item that has had that DataTemplate applied to it. Next, you need to get the ContentPresenter from that container control and then you can get the DataTemplate from ContentPresenter. Finally, you can access the named elements from the DataTemplate. From the linked page:

// 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的项目和动画逐个的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆