Come creare un ScrollViewer circolare/circolare su Windows 8 Metro (C++/XAML)

Question

In un'app di Windows 8 Metro, è possibile creare un ScrollViewer che, una volta raggiunto l'ultimo elemento nella vista, torna al primo oggetto nella vista? In tal caso, come posso ottenere questo effetto?

Answer 1

Non credo che ci sia un controllo simile in WinRT/XAML, quindi è necessario implementare un controllo personalizzato. Ci sono molti approcci che potreste adottare, ma probabilmente eviterei di usare ScrollViewer e gestire direttamente gli eventi di manipolazione poiché potrebbe non essere semplice piegare il comportamento di ScrollViewer alle vostre esigenze. Controllerò l'offset di scorrimento in base agli eventi di manipolazione e in base all'offset di scorrimento: posiziona gli elementi nella vista, ad es. usando un controllo Canvas. Dovresti riposizionare gli elementi nel pannello degli elementi in base a un offset di scorrimento, in modo che, ad esempio, gli elementi che vanno oltre la porta di visualizzazione su un'estremità vengano spostati sull'altra estremità. Ciò implicherebbe proprietà di dipendenza personalizzate, contenitori di articoli, ecc. Probabilmente almeno poche ore di lavoro se si conoscono tutte queste API.

Answer 2

È sicuramente possibile. Sto risolvendo il problema al momento e pubblicherò il lavoro una volta terminato. Fin qui va qualcosa come sotto.

L'idea è che si agganci all'evento viewchanged per il visualizzatore scroll, che si attiva ogni volta che si sposta la barra. Una volta lì, calcola il punto in cui ti trovi nell'offset e la dimensione dei tuoi articoli, quindi puoi utilizzarlo per misurare la dimensione effettiva del tuo contenitore della lista o di cosa hai.

Una volta che sai dove sei nell'offset e conosci l'altezza effettiva della tua casella di riepilogo e l'altezza dei tuoi oggetti, sai quali oggetti sono attualmente visibili e quali no. Assicurati che la tua lista sia vincolata all'oggetto è una collezione osservabile che implementa l'interfaccia INotifyChanged con binding a due vie. Quindi puoi definire un insieme di oggetti per ruotare avanti e indietro in base a dove ti trovi nello scorrimento.

Un'altra opzione è provare un punto di partenza diverso, forse un singolo controllo con una selezione e una barra di scorrimento al di sotto?

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> 

Codice Dietro

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(); 
    } 
}