Datagrid MVVM Scroll into view

Question

Greetings,

I've managed to scroll to the selected item using http://www.codeproject.com/Tips/125583/ScrollIntoView-for-a-DataGrid-when-using-MVVM.aspx but this only scrolls untill it gets to the selected item.

I want the selected item to show at the TOP of the datagrid, currently it shows at the bottom of the datagrid.

Is there any way to accomplish this ?

Answer 1

It seems like there's two scenarios here. One is when you manually select an item in the DataGrid and the other one is when the source property for SelectedItem changes in your viewmodel. The behavior in the link you provided will be triggered for both.

The way ScrollIntoView works is that it will scroll upwards if the newly selected item is above the previously selected item (leaving it on top) and scroll downwards if the newly selected item is below (leaving it on the bottom) and no scroll at all if the selected item is already visible to the user. So you won't always get the selected item on the bottom of the DataGrid

If you want the SelectedItem to always be displayed on the top of the grid (if possible) you can do that by scrolling to the bottom, before doing grid.ScrollIntoView(grid.SelectedItem, null);. This has the side-effect that the SelectedItem will always be displayed on the top, even if it was selected by Mouse, Keyboard etc.

To be able to scroll the DataGrid programmatically, you need to create a ScrollableDataGrid that derives from DataGrid

public class ScrollableDataGrid : DataGrid
{
    private IScrollProvider m_scrollProvider;
    public ScrollableDataGrid()
    {
        m_scrollProvider = OnCreateAutomationPeer() as IScrollProvider;
    }
    public void ScrollToBottom()
    {
        while (m_scrollProvider.VerticalScrollPercent < 100)
        {
            m_scrollProvider.Scroll(ScrollAmount.NoAmount, ScrollAmount.LargeIncrement);
        }
    }
}

Then you can modify the behavior slightly to get the "scrolled to top" effect

void AssociatedObject_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
    if (sender is ScrollableDataGrid)
    {
        ScrollableDataGrid grid = (sender as ScrollableDataGrid);

        if (grid.SelectedItem != null)
        {
            grid.Dispatcher.BeginInvoke(delegate
            {
                grid.ScrollToBottom();
                grid.UpdateLayout();
                grid.ScrollIntoView(grid.SelectedItem, null);
            });
        }
    }
}