0

我正在尝试使用 Microsoft Kinect SDK SlideShow 示例作为新项目的基础，在该项目中，我可以在网格中显示 8 个图像，这些图像可以使用 Storyboard 进行动画处理。但是，当我运行应用程序时，没有图像显示。我意识到考虑到每个图像的绑定，所有图像现在都将是相同的，但我无法显示任何图像。我得到的只是一个显示网格线的空白屏幕（用于调试）。我可以使用手势在面板中从一组 8 张图像轻弹到另一张，但没有图像显示。

你能帮我看看我做错了什么吗？

<Window x:Name="window" x:Class="Microsoft.Samples.Kinect.Slideshow.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="Slide Show" Height="735" Width="800" >
<Window.Resources>
    <SolidColorBrush x:Key="MediumGreyBrush" Color="#ff6e6e6e"/>
    <BooleanToVisibilityConverter x:Key="BooleanToVisibilityConverter"/>
    <Storyboard x:Key="LeftAnimate">
        <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="previous">
            <EasingDoubleKeyFrame KeyTime="0" Value="1"/>
            <EasingDoubleKeyFrame KeyTime="0:0:0.4" Value="1"/>
            <EasingDoubleKeyFrame KeyTime="0:0:0.5" Value="0"/>
        </DoubleAnimationUsingKeyFrames>
        <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="next">
            <EasingDoubleKeyFrame KeyTime="0" Value="0"/>
        </DoubleAnimationUsingKeyFrames>
        <ThicknessAnimationUsingKeyFrames Storyboard.TargetProperty="(FrameworkElement.Margin)" Storyboard.TargetName="current">
            <EasingThicknessKeyFrame KeyTime="0" Value="2000,0,-2000,0"/>
            <EasingThicknessKeyFrame KeyTime="0:0:0.5" Value="0"/>
        </ThicknessAnimationUsingKeyFrames>
    </Storyboard>
    <Storyboard x:Key="RightAnimate">
        <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="previous">
            <EasingDoubleKeyFrame KeyTime="0" Value="0"/>
        </DoubleAnimationUsingKeyFrames>
        <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="next">
            <EasingDoubleKeyFrame KeyTime="0" Value="1"/>
            <EasingDoubleKeyFrame KeyTime="0:0:0.4" Value="1"/>
            <EasingDoubleKeyFrame KeyTime="0:0:0.5" Value="0"/>
        </DoubleAnimationUsingKeyFrames>
        <ThicknessAnimationUsingKeyFrames Storyboard.TargetProperty="(FrameworkElement.Margin)" Storyboard.TargetName="current">
            <EasingThicknessKeyFrame KeyTime="0" Value="-2000,0,2000,0"/>
            <EasingThicknessKeyFrame KeyTime="0:0:0.5" Value="0"/>
        </ThicknessAnimationUsingKeyFrames>
    </Storyboard>
</Window.Resources>
<Grid DataContext="{Binding ElementName=window}" Margin="10 0 10 0">
    <Grid.RowDefinitions>
        <RowDefinition />
    </Grid.RowDefinitions>
    <Grid.ColumnDefinitions>
        <ColumnDefinition />
    </Grid.ColumnDefinitions>
    <Grid>

        <Grid x:Name="next" ShowGridLines="True">
            <Grid.RowDefinitions>
                <RowDefinition />
                <RowDefinition />
            </Grid.RowDefinitions>
            <Grid.ColumnDefinitions>
                <ColumnDefinition />
                <ColumnDefinition />
                <ColumnDefinition />
                <ColumnDefinition />
            </Grid.ColumnDefinitions>
            <!-- Change the binding to the correct picture or video -->
            <Image Grid.Column="0" Grid.Row="0" Source="{Binding NextPicture}" Opacity="0"/>
            <Image Grid.Column="1" Grid.Row="0" Source="{Binding NextPicture}" Opacity="0"/>
            <Image Grid.Column="2" Grid.Row="0" Source="{Binding NextPicture}" Opacity="0"/>
            <Image Grid.Column="3" Grid.Row="0" Source="{Binding NextPicture}" Opacity="0"/>
            <Image Grid.Column="0" Grid.Row="1" Source="{Binding NextPicture}" Opacity="0"/>
            <Image Grid.Column="1" Grid.Row="1" Source="{Binding NextPicture}" Opacity="0"/>
            <Image Grid.Column="2" Grid.Row="1" Source="{Binding NextPicture}" Opacity="0"/>
            <Image Grid.Column="3" Grid.Row="1" Source="{Binding NextPicture}" Opacity="0"/>


        <Grid x:Name="previous" ShowGridLines="True">
            <Grid.RowDefinitions>
                <RowDefinition />
                <RowDefinition />
            </Grid.RowDefinitions>
            <Grid.ColumnDefinitions>
                <ColumnDefinition />
                <ColumnDefinition />
                <ColumnDefinition />
                <ColumnDefinition />
            </Grid.ColumnDefinitions>
            <!-- Change the binding to the correct picture or video -->
            <Image Grid.Column="0" Grid.Row="0" Source="{Binding PreviousPicture}" Opacity="0"/>
            <Image Grid.Column="1" Grid.Row="0" Source="{Binding PreviousPicture}" Opacity="0"/>
            <Image Grid.Column="2" Grid.Row="0" Source="{Binding PreviousPicture}" Opacity="0"/>
            <Image Grid.Column="3" Grid.Row="0" Source="{Binding PreviousPicture}" Opacity="0"/>
            <Image Grid.Column="0" Grid.Row="1" Source="{Binding PreviousPicture}" Opacity="0"/>
            <Image Grid.Column="1" Grid.Row="1" Source="{Binding PreviousPicture}" Opacity="0"/>
            <Image Grid.Column="2" Grid.Row="1" Source="{Binding PreviousPicture}" Opacity="0"/>
            <Image Grid.Column="3" Grid.Row="1" Source="{Binding PreviousPicture}" Opacity="0"/>


        <Grid x:Name="current" ShowGridLines="True">
            <Grid.RowDefinitions>
                <RowDefinition />
                <RowDefinition />
            </Grid.RowDefinitions>
            <Grid.ColumnDefinitions>
                <ColumnDefinition />
                <ColumnDefinition />
                <ColumnDefinition />
                <ColumnDefinition />
            </Grid.ColumnDefinitions>
            <!-- Change the binding to the correct picture or video -->
            <Image Grid.Column="0" Grid.Row="0" Source="{Binding Picture}" Opacity="0"/>
            <Image Grid.Column="1" Grid.Row="0" Source="{Binding Picture}" Opacity="0"/>
            <Image Grid.Column="2" Grid.Row="0" Source="{Binding Picture}" Opacity="0"/>
            <Image Grid.Column="3" Grid.Row="0" Source="{Binding Picture}" Opacity="0"/>
            <Image Grid.Column="0" Grid.Row="1" Source="{Binding Picture}" Opacity="0"/>
            <Image Grid.Column="1" Grid.Row="1" Source="{Binding Picture}" Opacity="0"/>
            <Image Grid.Column="2" Grid.Row="1" Source="{Binding Picture}" Opacity="0"/>
            <Image Grid.Column="3" Grid.Row="1" Source="{Binding Picture}" Opacity="0"/>


    </Grid>

</Grid>

4

1 回答 1

0

经过大量研究，我发现制作这组图像的最佳方法是使用 StackPanel 和常规 Storyboard。对 Stackpanel 的附加属性进行动画处理比为 Grid 设置动画要容易得多。

有关附加属性的更多信息

这个页面真的帮助我完成了我想要的。MSDN 上的 system.windows.uielement 页面帮助我了解可以更改哪些属性来操作 Stackpanel。

我的代码现在可以工作了。我希望这有帮助。

这是我的 XAML：

<Window.Resources>
    <Storyboard x:Key="SwipeRight">
        <DoubleAnimationUsingKeyFrames 
                    BeginTime="00:00:00" 
                    Storyboard.TargetName="StackPanel1"
                    Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.X)">
            <SplineDoubleKeyFrame KeyTime="00:00:02" Value="-800"/>
        </DoubleAnimationUsingKeyFrames>
    </Storyboard>

    <Storyboard x:Key="SwipeLeft">
        <DoubleAnimationUsingKeyFrames 
                    BeginTime="00:00:00" 
                    Storyboard.TargetName="StackPanel1"
                    Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.X)">
            <SplineDoubleKeyFrame KeyTime="00:00:02" Value="+400"/>
        </DoubleAnimationUsingKeyFrames>
    </Storyboard>

</Window.Resources>


<Grid x:Name="LayoutRoot">
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="1024" />
    </Grid.ColumnDefinitions>
    <StackPanel   Name="StackPanel1" Margin="0,0,0,0" RenderTransformOrigin="0.5,0.5">
        <StackPanel.RenderTransform>
            <TransformGroup>
                <ScaleTransform ScaleX="1" ScaleY="1"/>
                <SkewTransform AngleX="0" AngleY="0"/>
                <RotateTransform Angle="0"/>
                <TranslateTransform X="0" Y="0"/>
            </TransformGroup>
        </StackPanel.RenderTransform>
        <Image Margin="0,50,0,0" Source="{Binding NextPicture}"  x:Name="title" Height="150" VerticalAlignment="Top" Stretch="Uniform"></Image>
于 2012-06-29T15:33:22.523 回答