WPF Créditos problema de efecto: StoryBoard para animar un StackPanel que se extiende la altura de la ventana

Question

Este es mi primer proyecto de WPF. Estoy intentando conseguir un efecto de créditos rodantes con un montón de bandera en forma de PNG apilados uno encima del otro en vertical.

Mi enfoque actual es tener un montón de imágenes en un StackPanel. Cada imagen es de aproximadamente 1024x150, y hay alrededor de 30 imágenes. Ellos se apilan verticalmente.

inicio el StackPanel en 0200, por lo que la mayor parte está fuera de la pantalla. entonces tengo un guión gráfico (creada en Blend) que se traduce hasta el eje Y, todo el camino fuera de la pantalla. La animación se inicia, pero el problema es la parte de la StackPanel que fue originalmente fuera de la pantalla nunca se pinta y se queda corta. Sólo el área inicialmente visible del StackPanel anima.

Se siente como el StackPanel necesita ser repintado. Este enfoque es cada vez va a trabajar o necesito hacer algo totalmente diferente?

XAML, omitiendo la ventana y Window.Triggers:

<Window.Resources>
    <Storyboard x:Key="sb_HR">
        <DoubleAnimationUsingKeyFrames 
                    BeginTime="00:00:00" 
                    Storyboard.TargetName="StackPanel1"
                    Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.Y)">
            <SplineDoubleKeyFrame KeyTime="00:00:30" Value="-1950"/>
        </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="title.png"  x:Name="title" Height="150" VerticalAlignment="Top" Stretch="Uniform"></Image>
        <Image Margin="0,50,0,0" Source="1.png" x:Name="V1_L1" Height="150" VerticalAlignment="Top" Stretch="Uniform" ></Image>
        <Image Margin="0,50,0,0" Source="2.png" x:Name="V1_L2" Height="150" VerticalAlignment="Top" Stretch="Uniform" ></Image>
        <Image Margin="0,50,0,0" Source="3.png" x:Name="V1_L3" Height="150" VerticalAlignment="Top" Stretch="Uniform" ></Image>
        <Image Margin="0,50,0,0" Source="4.png" x:Name="V1_L4" Height="150" VerticalAlignment="Top" Stretch="Uniform" ></Image>
        <Image Margin="0,50,0,0" Source="5.png" x:Name="V1_L5" Height="150" VerticalAlignment="Top" Stretch="Uniform" ></Image>
        <Image Margin="0,50,0,0" Source="6.png" x:Name="V1_L6" Height="150" VerticalAlignment="Top" Stretch="Uniform" ></Image>
        <Image Margin="0,50,0,0" Source="7.png" x:Name="V1_L7" Height="150" VerticalAlignment="Top" Stretch="Uniform" ></Image>
        <Image Margin="0,50,0,0" Source="8.png" x:Name="V1_L8" Height="150" VerticalAlignment="Top" Stretch="Uniform" ></Image>
    </StackPanel>
</Grid>

Editar: que he encontrado y ClipToBounds intentado fijar en false, pero ya es falsa. Alguien en MSDN tiene el mismo problema que yo, en http://social.msdn.microsoft.com/Forums/en-US/wpf/thread/5764645e-cb4f-4137-a525-4e8698ee43b6 - creo que no hay una solución todavía .

Answer 1

Veo dos cosas que usted puede probar:

1. Utilice un ScrollViewer con barras de desplazamiento con discapacidad en todo el StackPanel. Lamentablemente, no se puede animar la compensación directa de desplazamiento, por lo que se necesita para crear algo así como un temporizador en el código detrás y llame ScrollToVerticalOffset () periódicamente.

2. Trate de poner StackPanel en una lona y animar Canvas.Top (juego en el StackPanel) en lugar de los RenderTransforms.

Yo le proporcionará un ejemplo de código si lo necesita.

Andrej

Answer 2

Estoy de acuerdo con Andrej, acaba de hacer un nuevo tipo de cuadro de lista que tiene las barras de desplazamiento desactivados.

Puede animar el desplazamiento offset, Tengo que esto ocurra en un control personalizado que estoy escribiendo en este momento. Esto está en función de la clase para el cuadro de lista:

---

Duration animationDuration = new Duration(new TimeSpan(0, 0, 0, 0, _scrollSpeed));
DoubleAnimation animateHscroll = new DoubleAnimation(thisScrollViewer.HorizontalOffset, TargetHorizontalOffset, animationDuration);

thisScrollViewer.BeginAnimation(HorizontalScrollOffsetProperty, animateHscroll);

---