2012-06-20 11 views
9

He creado un rectángulo dentro de un ScrollViewer como esto¿Cómo obtengo un ScrollViewer con un rectángulo adentro para detener el desplazamiento cuando llega al final del rectángulo?

<ScrollViewer ManipulationMode="Control" x:Name="songScrollViewer" HorizontalScrollBarVisibility="Visible" VerticalScrollBarVisibility="Disabled" Height="270" VerticalAlignment="Center" Width="728" Canvas.Top="20" d:LayoutOverrides="HorizontalMargin" > 
    <Rectangle x:Name="musicBG" Fill="#FF0692FD"/> 
</ScrollViewer> 

Durante el uso de la aplicación, el tamaño de los cambios MusicBg, a veces a algo alrededor de 3.000 píxeles de ancho.

musicBG.Width = _songLength*PixelsPerSecond 

Sin embargo, al desplazar el scrollViewer, me permite desplazar el rectángulo completamente fuera de la pantalla.

Por ejemplo, esta línea de código me proporciona los siguientes valores cuando muevo el rectángulo hasta donde quiero moverlo.

if (songScrollViewer.HorizontalOffset > songScrollViewer.ScrollableWidth) 

HorizontalOffset tiene un valor de ~ 1200 y ScrollableWidth tiene un valor de alrededor de ~ 2900.

¿Cómo puedo hacer esto correctamente para que el rectángulo no se desplace completamente fuera de la pantalla?

Esperaría un HorizontalOffset de aproximadamente 1200 para empujar el rectángulo a la mitad de su destino y no hacer que comience a salir de la pantalla.

RESPUESTA:

Después de mucha frustración, que era capaz de resolver este problema mediante el uso de lienzo en lugar de la frontera o el rectángulo. Voy a otorgar puntos si alguien puede explicar por qué ocurrió este problema, y ​​si hay un control menos intensivo del procesador que funcionaría mejor que el lienzo.

Editar: Las capturas de pantalla:

Código malo:

<ScrollViewer ManipulationMode="Control" x:Name="songScrollViewer" Width="720" HorizontalScrollBarVisibility="Visible" VerticalScrollBarVisibility="Disabled" Height="270" VerticalAlignment="Top" Canvas.Top="20" HorizontalAlignment="Left" > 
            <Border x:Name="musicBG" Background="#FF0692FD" VerticalAlignment="Top" HorizontalAlignment="Left" Height="270" /> 

      </ScrollViewer> 

Imagen de mal rollo con código malo: bad scroll

Buena código de trabajo:

<ScrollViewer ManipulationMode="Control" x:Name="songScrollViewer" Width="720" HorizontalScrollBarVisibility="Visible" VerticalScrollBarVisibility="Disabled" Height="270" VerticalAlignment="Top" Canvas.Top="20" HorizontalAlignment="Left" > 
       <Canvas x:Name="musicBG" Background ="#FF0692FD" Height="270" > 
        <Border Background="#FF0692FD" VerticalAlignment="Top" HorizontalAlignment="Left" Height="270" /> 
       </Canvas> 
      </ScrollViewer> 

Buena Desplazarse: Observe que dice 170 se Conds en la parte inferior derecha en lugar de la menor cantidad de 118 segundos en el desplazamiento incorrecto. good scroll

+0

Si quiere arrojar una captura de pantalla de lo que está describiendo para ayudar a visualizarlo, así puedo estar seguro de lo que está tratando de lograr, entonces sí, debería ser capaz de usar cualquiera de los objetos que era ya está intentado, pero es posible que deba vincular un tamaño al ViewPort del ScrollViewer y tal vez ni siquiera necesite un desplazamiento. Aunque actualmente es difícil de visualizar a partir de su descripción, estoy seguro de que podemos solucionarlo. –

+0

@ChrisW. Pregunta actualizada – Bob

+1

Eso es muy extraño, funciona perfectamente hasta que el rectángulo sea más grande que 2000 y luego comienza a empujarlo más y más lejos de la pantalla cuando se desplaza hacia el final. Ha captado mi curiosidad ... – methodMan

Respuesta

1

Creo que su derecho, wp7 no representará formas que son más grandes que 2048 píxeles. Por lo tanto, la razón por la que se desplaza por la página es porque se trata como si fuera más grande que 2048, pero solo se puede ver hasta un ancho de 2048 píxeles y simplemente se desplaza hacia la parte "fantasma" del rectángulo.

No estoy seguro si puede anular esto, pero la mejor solución que pude encontrar (sin anulación) es dividiendo su rectángulo en mandriles que son más pequeños que 2000 (solo para estar seguro) y luego mostrarlos sin problemas en un panel de pila horizontal dentro del visor de desplazamiento. El problema con esto es que, dependiendo de cómo lo haya codificado, esta solución puede ser difícil de implementar; pero es posible que solo pueda dividirlo en su ViewModel cuando lo muestre y su lógica solo lo verá como una gran parte.

Cuestiones relacionadas