How to scroll elements horizontally for a ListBox?

Question

I have a ListBox, populate with some images in vertical position

[img]
[img]
[img]

I need an horizontal positioning like this instead

[img][img][img]

Any idea how to do it?

     <Custom:SurfaceListBox
        Grid.Column="0"
        x:Name="FloorsSurfaceListBox"
        ScrollViewer.HorizontalScrollBarVisibility="Visible"
        ScrollViewer.VerticalScrollBarVisibility="Visible"
        SelectionChanged="Floors_SelectionChanged"
        ItemTemplate="{DynamicResource FloorsListboxDataTemplate}"
        ItemContainerStyle="{DynamicResource SurfaceListBoxItemStyle}">
            <Custom:SurfaceListBox.OpacityMask>
                <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                    <GradientStop Color="Transparent" Offset="0"/>
                    <GradientStop Color="Black" Offset="0.15"/>
                    <GradientStop Color="Black" Offset="0.85"/>
                    <GradientStop Color="Transparent" Offset="1"/>
                </LinearGradientBrush>
            </Custom:SurfaceListBox.OpacityMask>
        </Custom:SurfaceListBox>




    <DataTemplate x:Key="FloorsListboxDataTemplate">
        <Grid>
            <Image Source="{Binding ImageUrlString}"/>
            <TextBlock TextWrapping="Wrap"
                       Text="{Binding Description,
                       FallbackValue='Description'}"
                       d:LayoutOverrides="Width"
                       FontFamily="/ClientWPF;component/Fonts/#Letter Gothic L"
                       Margin="0,100,0,40"
                       FontWeight="Normal">
                <TextBlock.Foreground>
                    <SolidColorBrush Color="{DynamicResource {x:Static SystemColors.ActiveBorderColorKey}}"/>
                </TextBlock.Foreground>
            </TextBlock>
        </Grid>
    </DataTemplate>

Answer 1

Replace the item's panel of your ListBox (ItemsControl.ItemsPanel) by an horizontal StackPanel.

<ListBox ...>
  ...
  <ListBox.ItemsPanel>
    <ItemsPanelTemplate>
      <StackPanel Orientation="Horizontal"/>
    </ItemsPanelTemplate>
  </ListBox.ItemsPanel>
</ListBox>