web-dev-qa-db-fra.com

WPF ListBox qui dispose ses éléments horizontalement

J'essaie d'écrire une application WPF pour afficher des images d'une sélection. Je souhaite afficher toutes les images disponibles dans une bannière en haut de la fenêtre et afficher l'image principale sélectionnée dans la fenêtre principale pour un traitement ultérieur.

Si je voulais la liste sur le La gauche de la fenêtre, en affichant les images verticalement, je peux le faire avec élégance en utilisant la liaison de données.

    <ListBox 
        Name="m_listBox"
        IsSynchronizedWithCurrentItem="True"
        ItemsSource="{Binding}"            
        >
        <ListBox.ItemTemplate>
            <DataTemplate>
                <Image Source="{Binding}" Width="60" Stretch="Uniform" />
            </DataTemplate>
        </ListBox.ItemTemplate>
    </ListBox>

Existe-t-il un moyen simple de rendre cela horizontal au lieu de vertical? Les principales exigences d'une solution sont:

  • Les éléments sont remplis à l'aide de la liaison de données
  • L'élément sélectionné est modifié simplement par l'utilisateur qui clique dessus.
wpfdata-bindinglistbox
51
Andrew Shepherd

WrapPanel

 <ListBox ScrollViewer.HorizontalScrollBarVisibility="Disabled">
    <ListBox.ItemsPanel>
        <ItemsPanelTemplate>
            <WrapPanel IsItemsHost="True" />
        </ItemsPanelTemplate>
    </ListBox.ItemsPanel>
    <ListBoxItem>listbox item 1</ListBoxItem>
    <ListBoxItem>listbox item 2</ListBoxItem>
    <ListBoxItem>listbox item 3</ListBoxItem>
    <ListBoxItem>listbox item 4</ListBoxItem>
    <ListBoxItem>listbox item 5</ListBoxItem>
</ListBox>

Tutoriel WPF

113
adatapost

La valeur par défaut ItemsPanel pour le contrôle ListBox est un VirtualizingStackPanel, donc si vous voulez une expérience par défaut normale pour le contrôle mais que vous la présentez simplement horizontalement, vous devez la spécifier (et changez l'orientation).

Exemple:

<ListBox>
    <ListBox.ItemsPanel>
        <ItemsPanelTemplate>
            <VirtualizingStackPanel IsItemsHost="True" Orientation="Horizontal"/>
        </ItemsPanelTemplate>
    </ListBox.ItemsPanel>
</ListBox>
17
Bob Sammers