mvvm 如何使列表视图自动滚动到列表视图中的新项目 [英] mvvm how to make a list view auto scroll to a new Item in a list view

问题描述

我正在使用 MVVM 模式，我有一个创建新 ViewModel 的视图，在用户点击保存后，该视图关闭并打开一个单独的视图，显示视图模型的集合在 ListView 中.

I am using the MVVM pattern, I have a view which creates a new ViewModel, after the user clicks save, this view is closed and a seperate view is opened which displays a collection of view models in a ListView.

这个ListView是按字母顺序排序的，所以新的ViewModel可能会出现在ListBox的底部，不是立即可见的给用户.

This ListView is sorted in alphabetical order, so the new ViewModel may appear at the bottom of the ListBox, which is not immediately visible to the user.

我的问题是如何让视图自动滚动到新添加的项目?

My question is how do I get the view to auto scroll to the newly added item?

我猜它将使用附加行为，以及 ListView 上的 ScrollIntoView 事件，但是我需要从 GridView 捕获哪个事件 我不确定..

I guess that It will be using attached behaviours, and the ScrollIntoView event on the ListView, however its which event that I need to capture from the GridView that I am unsure of..

干杯

推荐答案

此解决方案适用于 ListBox，但可以针对 ListView 对其进行修改...当您将所选项目从视图模型.

This solution is for a ListBox, but it could be modified for a ListView... This will scroll the selected item into view when you change the selected item from the ViewModel.

类:

/// <summary>
/// ListBoxItem Behavior class
/// </summary>
public static class ListBoxItemBehavior
{
    #region IsBroughtIntoViewWhenSelected

    /// <summary>
    /// Gets the IsBroughtIntoViewWhenSelected value
    /// </summary>
    /// <param name="listBoxItem"></param>
    /// <returns></returns>
    public static bool GetIsBroughtIntoViewWhenSelected(ListBoxItem listBoxItem)
    {
        return (bool)listBoxItem.GetValue(IsBroughtIntoViewWhenSelectedProperty);
    }

    /// <summary>
    /// Sets the IsBroughtIntoViewWhenSelected value
    /// </summary>
    /// <param name="listBoxItem"></param>
    /// <param name="value"></param>
    public static void SetIsBroughtIntoViewWhenSelected(
      ListBoxItem listBoxItem, bool value)
    {
        listBoxItem.SetValue(IsBroughtIntoViewWhenSelectedProperty, value);
    }

    /// <summary>
    /// Determins if the ListBoxItem is bought into view when enabled
    /// </summary>
    public static readonly DependencyProperty IsBroughtIntoViewWhenSelectedProperty =
        DependencyProperty.RegisterAttached(
        "IsBroughtIntoViewWhenSelected",
        typeof(bool),
        typeof(ListBoxItemBehavior),
        new UIPropertyMetadata(false, OnIsBroughtIntoViewWhenSelectedChanged));

    /// <summary>
    /// Action to take when item is brought into view
    /// </summary>
    /// <param name="depObj"></param>
    /// <param name="e"></param>
    static void OnIsBroughtIntoViewWhenSelectedChanged(
      DependencyObject depObj, DependencyPropertyChangedEventArgs e)
    {
        ListBoxItem item = depObj as ListBoxItem;
        if (item == null)
            return;

        if (e.NewValue is bool == false)
            return;

        if ((bool)e.NewValue)
            item.Selected += OnListBoxItemSelected;
        else
            item.Selected -= OnListBoxItemSelected;
    }

    static void OnListBoxItemSelected(object sender, RoutedEventArgs e)
    {
        // Only react to the Selected event raised by the ListBoxItem 
        // whose IsSelected property was modified.  Ignore all ancestors 
        // who are merely reporting that a descendant's Selected fired. 
        if (!Object.ReferenceEquals(sender, e.OriginalSource))
            return;

        ListBoxItem item = e.OriginalSource as ListBoxItem;
        if (item != null)
            item.BringIntoView();
    }

    #endregion // IsBroughtIntoViewWhenSelected
}

将 xmlns 添加到您的视图中:

Add the xmlns to your view:

xmlns:util="clr-namespace:YourNamespaceHere.Classes"

在Window/UserControl的资源中添加样式:

Add the style to the resources of the Window/UserControl:

<Window.Resources>
    <Style x:Key="ListBoxItemContainerStyle" TargetType="{x:Type ListBoxItem}"
        BasedOn="{StaticResource {x:Type ListBoxItem}}">
        <Setter Property="util:ListBoxItemBehavior.IsBroughtIntoViewWhenSelected" Value="true"/>
    </Style>
</Window.Resources>

实现列表框:

<ListBox ItemsSource="{Binding MyView}"
         DisplayMemberPath="Title"
         SelectedItem="{Binding SelectedItem}" 
         ItemContainerStyle="{StaticResource ListBoxItemContainerStyle}"/>

这篇关于mvvm 如何使列表视图自动滚动到列表视图中的新项目的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！