Cómo hacer un ScrollViewer de bucle/circular en Windows 8 Metro (C++/XAML)

Question

En una aplicación Metro de Windows 8, es posible crear un ScrollViewer que al llegar al último elemento de la vista, vuelve al primero elemento en la vista? Si es así, ¿cómo puedo lograr este efecto?

Answer 1

No creo que haya un control como ese en WinRT/XAML, por lo que tendría que implementar un control personalizado. Hay muchos enfoques que podría tomar, pero probablemente evitaría usar el ScrollViewer y manejar los eventos de manipulación directamente, ya que podría no ser fácil doblar el comportamiento de ScrollViewer a sus requisitos. Controlaría la compensación de desplazamiento en función de los eventos de manipulación y, en función del desplazamiento de desplazamiento, situaría los elementos en la vista, p. Ej. usando un control Canvas. Debería volver a colocar los elementos en el panel de elementos en función de un desplazamiento de desplazamiento, de modo que, por ejemplo, los elementos que van más allá del puerto de visualización en un extremo se muevan al otro extremo. Implicaría propiedades de dependencia personalizadas, contenedores de elementos, etc. Probablemente al menos unas pocas horas de trabajo si conoce todas estas API.

Answer 2

Definitivamente es posible. Estoy resolviendo el problema en este momento y publicaré el trabajo cuando haya terminado. Hasta ahora, va algo así como a continuación.

La idea es que se enganche en el evento viewchanged para el visor de desplazamiento, que se dispara cada vez que se mueve la barra. Una vez allí, calcule dónde se encuentra en el desplazamiento y el tamaño de sus elementos, y luego puede usar eso para comparar con el tamaño real de su contenedor de listbox o qué tiene usted.

Una vez que sepa dónde se encuentra en el desplazamiento y sepa la altura real de su listbox y la altura de sus artículos, sabrá qué elementos están visibles actualmente y cuáles no. Asegúrese de que su lista vinculada al objeto sea una colección observable que implemente la interfaz INotifyChanged con enlace bidireccional. Luego puede definir un conjunto de objetos para girar hacia adelante y hacia atrás según el desplazamiento en el que se encuentre.

Otra opción es intentar un punto de partida diferente, tal vez un solo control con una marquesina y una barra de desplazamiento debajo de él?

XAML

</UserControl.Resources> 
<Grid Background="{StaticResource ApplicationPageBackgroundThemeBrush}"> 
    <Grid.RowDefinitions> 
     <RowDefinition Height="*"/> 
     <RowDefinition Height="*"/> 
    </Grid.RowDefinitions> 
    <Grid.ColumnDefinitions> 
     <ColumnDefinition Width="*" /> 
     <ColumnDefinition Width="*"/> 
    </Grid.ColumnDefinitions> 
<ScrollViewer x:Name="ScrollViewer1"> 
    <ListBox x:Name="SampleListBox" Background="White" ItemsSource="{Binding Path=sampleItems}" ItemTemplate="{StaticResource sampleTemplate}" VerticalAlignment="Stretch" HorizontalAlignment="Stretch" Grid.Row="0" Grid.RowSpan="2"> 

    </ListBox> 
</ScrollViewer> 
</Grid> 

Código Detrás

public sealed partial class MainPage : Page 
{ 
    List<SampleItem> sampleItems; 
    const int numItems = 15; 
    public MainPage() 
    { 
     sampleItems = new List<SampleItem>(); 
     for (int i = 0; i < numItems; i++) 
     { 
      sampleItems.Add(new SampleItem(i)); 
     } 
     this.InitializeComponent(); 
     SampleListBox.ItemsSource = sampleItems; 
     ScrollViewer1.ViewChanged += ScrollViewer1_ViewChanged; 
    } 
    void ScrollViewer1_ViewChanged(object sender, ScrollViewerViewChangedEventArgs e) 
    { 
     ScrollViewer viewer = sender as ScrollViewer; 
     ListBox box = viewer.Content as ListBox; 
     ListBoxItem lbi = box.ItemContainerGenerator.ContainerFromIndex(0) as ListBoxItem; 
     double elementSize; 
     if (lbi == null) 
      return; 
     elementSize = lbi.ActualHeight; 

    }  /// <summary> 
    /// Invoked when this page is about to be displayed in a Frame. 
    /// </summary> 
    /// <param name="e">Event data that describes how this page was reached. The Parameter 
    /// property is typically used to configure the page.</param> 
    protected override void OnNavigatedTo(NavigationEventArgs e) 
    { 
    } 
} 

public class SampleItem 
{ 
    public String ItemCount { get; set; } 
    public SampleItem(int itemCount) 
    { 
     ItemCount = itemCount.ToString(); 
    } 
}