Question

I have a need for a listbox that scrolls horizontally and I have followed the advice from several other questions raised in regard to this as to how to implement.

What I have currently does scroll horizontally, but at the end of the swipe it does not stay with where I have scrolled to, it reverts back to the original display – a bit like its a piece of elastic that pings back to its original positions after its been stretched.
My listbox contains buttons and I want the user to be able to swipe the listbox, get to the button they want and then click that button.

        <DataTemplate x:Key="ClassesDisplay">
        <Button Height="60"  FontSize="12"  Content="{Binding ClassName}" />
    </DataTemplate>


                <ScrollViewer HorizontalScrollBarVisibility="Auto" Margin="0,6,-196,0" Height="Auto" Name="imageScroll">  

                <ListBox x:Name="ClassesListbox"
                     Margin="114,371,24,814" Height="60" ItemsSource="{Binding TimetableClasses}"
                     ItemTemplate="{StaticResource ClassesDisplay}" >

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


                </ListBox>
           </ScrollViewer>  

AI suspect I am doing something wrong here, or should I be doing this in a different way?

• thanks

Answer 1

It seems you are not adding width to your ScrollViewer

Try adding width like

<ScrollViewer HorizontalScrollBarVisibility="Auto" Margin="0,6,-196,0" Height="Auto" Name="imageScroll" Width="400">  
 //Your ListBox 
</ScrollViewer>  

Or Listbox has internal scroll bar, you can use that like this

 <ListBox ScrollViewer.HorizontalScrollBarVisibility="Auto"
     ScrollViewer.VerticalScrollBarVisibility="Disabled" 
     // your code
     >
 </ListBox>