Question

J'ai un ListBox WPF lié à un objet de données. A l'intérieur du listbox sont une série d'images avec du texte. Il est aménagé de façon horizontale, et positionnant la souris sur les côtés gauche ou à droite de la boîte faire défiler les éléments gauche ou de droite.

disons il y a 20 articles dans la zone de liste. J'essaie de comprendre comment quand je frappe la position 19 point (0 sur la base) que je peux le cycle de la boîte et commencer la collection sur, de sorte qu'il va 1 -19 et ainsi de suite. Il faudrait aussi faire du vélo dans l'autre sens, de sorte que si vous étiez sur le point 0, et Scrolled gauche, vous obtenez 19.

Je l'ai essayé le KeyboardNavigation.DirectionalNavigation = « Cycle » mais cela ne » semblent rien faire pour moi, et je saisissais à pailles car cela n'a rien à voir avec le clavier, il est tout à base de la souris.

        <ListBox ItemsSource="{Binding Source={StaticResource WPFApparelCollection}}" Margin="24,-7,39,-19" ScrollViewer.VerticalScrollBarVisibility="Hidden" ScrollViewer.HorizontalScrollBarVisibility="Hidden" SelectionMode="Single" x:Name="list1" MouseLeave="List1_MouseLeave" MouseMove="List1_MouseMove" Style="{DynamicResource ListBoxStyle1}" Background="Transparent" BorderThickness="0">
            <ListBox.Resources>
                <!-- override the system brushes so that selected items are transparent whether the ListBox has focus or not -->
                <SolidColorBrush x:Key="{x:Static SystemColors.HighlightBrushKey}" Color="Transparent" />
                <SolidColorBrush x:Key="{x:Static SystemColors.ControlBrushKey}" Color="Transparent" />
                <SolidColorBrush x:Key="{x:Static SystemColors.HighlightTextBrushKey}" Color="Black" />
            </ListBox.Resources>
            <ListBox.ItemContainerStyle>
                <Style TargetType="{x:Type ListBoxItem}">
                    <Setter Property="Background" Value="Transparent" />
                    <Setter Property="HorizontalContentAlignment" Value="{Binding Path=HorizontalContentAlignment, RelativeSource={RelativeSource AncestorType={x:Type ItemsControl}}}" />
                    <Setter Property="VerticalContentAlignment" Value="{Binding Path=VerticalContentAlignment, RelativeSource={RelativeSource AncestorType={x:Type ItemsControl}}}" />
                    <Setter Property="Padding" Value="20,10,20,10" />
                    <Setter Property="Template">
                        <Setter.Value>
                            <ControlTemplate TargetType="{x:Type ListBoxItem}">
                                <Border x:Name="Bd" SnapsToDevicePixels="true" Background="Transparent" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Padding="{TemplateBinding Padding}">
                                    <ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" />
                                </Border>
                                <ControlTemplate.Triggers>
                                    <Trigger Property="IsSelected" Value="true">
                                        <Setter Property="Background" TargetName="Bd" Value="Transparent" />
                                        <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.HighlightTextBrushKey}}" />
                                    </Trigger>
                                    <MultiTrigger>
                                        <MultiTrigger.Conditions>
                                            <Condition Property="IsSelected" Value="true" />
                                            <Condition Property="Selector.IsSelectionActive" Value="false" />
                                        </MultiTrigger.Conditions>
                                        <Setter Property="Background" TargetName="Bd" Value="{DynamicResource {x:Static SystemColors.ControlBrushKey}}" />
                                        <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}" />
                                    </MultiTrigger>
                                    <Trigger Property="IsEnabled" Value="false">
                                        <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}" />
                                    </Trigger>
                                </ControlTemplate.Triggers>
                            </ControlTemplate>
                        </Setter.Value>
                    </Setter>
                </Style>
            </ListBox.ItemContainerStyle>
            <ListBox.ItemsPanel>
                <ItemsPanelTemplate>
                    <VirtualizingStackPanel Orientation="Horizontal" IsItemsHost="True" />
                </ItemsPanelTemplate>
            </ListBox.ItemsPanel>
            <ListBox.ItemTemplate>
                <DataTemplate>
                    <StackPanel Orientation="Vertical">
                        <Image Source="{Binding Image}" MouseLeave="Image_MouseLeave" MouseEnter="Image_MouseEnter" Cursor="Hand" Tag="{Binding Link}" MouseLeftButtonDown="Image_MouseLeftButtonDown" VerticalAlignment="Top" HorizontalAlignment="Left"></Image>
                        <Label Content="{Binding Name}" Cursor="Hand" Tag="{Binding Link}" MouseLeftButtonDown="Label_MouseLeftButtonDown" VerticalAlignment="Bottom" Foreground="White" Style="{StaticResource Gotham-Medium}" FontSize="8pt" HorizontalAlignment="Center" />
                    </StackPanel>
                </DataTemplate>
            </ListBox.ItemTemplate>
        </ListBox>
Était-ce utile?

La solution

La question n'est pas vraiment ici avec la zone de liste , mais avec ScrollViewer dans son modèle de contrôle; donc de faire le cycle des éléments que vous aurez besoin de changer le ScrollViewer d'une certaine façon. Je l'ai écrit un contrôle qui dérive de ScrollViewer que les cycles dans une direction verticale ... mais il devrait être facile de voir comment le faire fonctionner horizontalement aussi.

public class CyclicScrollViewer : ScrollViewer
{
    public CyclicScrollViewer()
    {
        this.CommandBindings.Add(new CommandBinding(ScrollBar.LineUpCommand, LineCommandExecuted));
        this.CommandBindings.Add(new CommandBinding(ScrollBar.LineDownCommand, LineCommandExecuted));
    }

    private void LineCommandExecuted(object sender, ExecutedRoutedEventArgs e)
    {
        if (e.Command == ScrollBar.LineUpCommand)
        {
            if (this.VerticalOffset == 0)
                this.ScrollToEnd();
            else
                this.LineUp();
        }

        if (e.Command == ScrollBar.LineDownCommand)
        {
            if (this.VerticalOffset == this.ScrollableHeight)
                this.ScrollToTop();
            else
                this.LineDown();
        }
    }
}

ScrollTo ... et ligne ... méthodes existent déjà sur le ScrollViewer rendant le codage assez simple. Tout ce que je fais ici vérifie le décalage de courant contre les limites du spectateur avant que le défilement.

L'étape suivante est d'insérer la nouvelle ScrollViewer dans le modèle de commande pour le contrôle de la cible, dans ce cas, le ListBox . Voici un extrait de XAML pour le démontrer.

        <ControlTemplate x:Key="{x:Type ListBox}" TargetType="ListBox">
            ...
                <l:CyclicScrollViewer 
                    Padding="{TemplateBinding Control.Padding}" 
                    Focusable="False">
                    <ItemsPresenter ... />
                </l:CyclicScrollViewer>
            ...
        </ControlTemplate>

J'ai posté un exemple d'application qui utilise ce code ici . Cet exemple ne prend pas en charge du clavier, mais cela peut être simplement ajouté en remplaçant le OnKeyDown méthode et exécuter les commandes appropriées ligne ... . J'espère que cela aide.

Autres conseils

Il y a un certain nombre d'implémentations de carrousel WPF libres et commerciaux qui font. Jetez un oeil à cette http://mdavey.wordpress.com/2007 / 04/03 / WPF-carrousel /

Licencié sous: CC-BY-SA avec attribution
Non affilié à StackOverflow
scroll top