WP7 - Scrolling ListBox in External ScrollViewer

Question

My application has the following page layout:

<Grid x:Name="ContentPanel" Grid.Row="1"> <ScrollViewer x:Name="ScrollViewer1" MaxHeight="600" VerticalAlignment="Top" HorizontalAlignment="Stretch"> <StackPanel x:Name="StackPanel1" > <TextBlock x:Name="TextBlock1" /> <toolkit:ListPicker x:Name="ListPicker1" /> <TextBlock x:Name="TextBlock2" /> <TextBox x:Name="TextBlock3" /> <TextBlock x:Name="TextBlock4" /> <StackPanel x:Name="StackPanel2" > <TextBlock x:Name="TextBlock5" /> <Image x:Name="Image1"/> </StackPanel> <ListBox x:Name="ListBox1"> <!--Customize the ListBox template to remove the built-in ScrollViewer--> <ListBox.Template> <ControlTemplate> <ItemsPresenter /> </ControlTemplate> </ListBox.Template> <ListBox.ItemTemplate> <DataTemplate> <!-- .... --> </DataTemplate> </ListBox.ItemTemplate> <ListBox.ItemContainerStyle> <Style TargetType="ListBoxItem"> <Setter Property="HorizontalContentAlignment" Value="Stretch" /> </Style> </ListBox.ItemContainerStyle> </ListBox> </StackPanel> </ScrollViewer> </Grid> 

I added an external ScrollViewer instead of a ListBox , because without it, the material above the ListBox took up too much space and did not leave enough space to view the contents of the ListBox .

Now the problem is that if I add an item to the end of the ListBox , the ScrollIntoView method ScrollIntoView not work. Therefore, I need to use the ScrollViewer method ScrollToVerticalOffset .

I add a new item to the ObservableCollection that is bound to the ListBox when the user clicks a button on the application bar. How to calculate the value that needs to be passed to ScrollViewer.ScrollToVerticalOffset ?

Thank you for your help!

Answer 1

You can find the container generated by the ListBox to place your item. When you have this container, you can find its position relative to the scrollviewer:

  var newItem = // the item you just added to your listbox // find the ListBox container listBox.UpdateLayout() var element = listBox.ItemContainerGenerator.ContainerFromItem(newItem) as FrameworkElement; // find its position in the scroll viewer var transform = element.TransformToVisual(ScrollViewer); var elementLocation = transform.Transform(new Point(0, 0)); double newVerticalOffset = elementLocation.Y + ScrollViewer.VerticalOffset; // scroll into view ScrollViewer.ScrollToVerticalOffset(newVerticalOffset); 

Hope that helps