WPF ListBox滑动滚动条到底部时持续追加数据

背景

由于我们的数据展示中使用过的listBox，如果一下子展示过多的数据时，如果还需要加载图片等，可能会导致加载过程中等待时间过长，用户体验不不佳，因此我们采用分页的方式来实现更佳的用户体验，但是需要实现当滑动滚动条（这里是向底部滑动过程中）进行数据加载，也就是相当于点击下一页的效果。

实现思路

ListBox本身有一个ScrollView，ScrollView有几个属性可以标记是否当前已经滑到底部，然后进行数据的追加。

 

 

 

使用VisualTreeHelper来获取ListBox中的ScrollViewer 

获取方式： scrollViewer = FindSimpleVisualChild<ScrollViewer>(listBox);

 T FindSimpleVisualChild<T>(DependencyObject element) where T : class
        {
            while (element != null)
            {

                if (element is T)
                    return element as T;

                element = VisualTreeHelper.GetChild(element, 0);
            }

            return null;
        }

然后监听：  scrollViewer.ScrollChanged += ScrollViewer_ScrollChanged;当滑动到底部时去加载数据。

 private void ScrollViewer_ScrollChanged(object sender, ScrollChangedEventArgs e)
        {

            if (isBootomScrollView(scrollViewer))
            {
                if (pageSize < Total)
                {
                    page++;
                    pageSize = page * 10;
                   // NextPaged?.Invoke( page,10);
　　　　　　　　　　　//追加数据的逻辑
                }
            } 
        }

        private bool isBootomScrollView(ScrollViewer view)
        {
            bool isBottom = false;

            double dVer = view.VerticalOffset;
            double vViewport = view.ViewportHeight;
            double eextent = view.ExtentHeight;
            if (dVer != 0)
            {
                if (dVer + vViewport == eextent)
                {
                    isBottom = true;
                }
                else
                {
                    isBottom = false;
                }
            }
            else
            {
                isBottom = false;
            }

            return isBottom;
            
        }

每次首页加载时需要注意，一定要将Scrollviewer设置滑动到顶部，否则数据会一直加载

完整代码如下：public event Action<object> SelectItemChanged;

private int Total = 0; int pageSize = 0; int page = 1; ScrollViewer scrollViewer = null; /// <summary>
        /// 刷新数据 /// </summary>
        /// <param name="total"></param>
        /// <param name="newlist"></param>
        public void ReFleshImage(int total, ObservableCollection<Data> newlist) { Task.Run(() => { Total = total; if (newlist==null) { pageSize = OldData.Count; } this.Dispatcher.InvokeAsync(() => { if (alreadyHookedScrollEvents) return; if (scrollViewer == null)//首次加载中去获取ScrollView可能会报异常，因此在这里再次判断获取 { scrollViewer = FindSimpleVisualChild<ScrollViewer>(listBox); if (scrollViewer != null) { scrollViewer.ScrollChanged -= ScrollViewer_ScrollChanged; scrollViewer.ScrollChanged += ScrollViewer_ScrollChanged; alreadyHookedScrollEvents = true; } } else { scrollViewer.ScrollChanged -= ScrollViewer_ScrollChanged; scrollViewer.ScrollChanged += ScrollViewer_ScrollChanged; alreadyHookedScrollEvents = true; } alreadyHookedScrollEvents = true;//标注下次不需要再获取 }); }); Task.Run(() => { this.Dispatcher.InvokeAsync(() => { try { List<BitmapSource> list = new List<BitmapSource>(); if (newlist == null) { foreach (var item in OldData) { var img = ImageService.GetImageByUrl(item.imagePath); list.Add(img); } for (int i = 0; i < list.Count; i++) { OldeData[i].ImageSource = list[i]; } } else { foreach (var item in newlist) { var img = ImageService.GetImagebyUrl(item.imagePath); list.Add(img); } for (int i = 0; i < list.Count; i++) { newlist[i].ImageSource = list[i]; } List<Data> oldlist = OldData.ToList(); oldlist.AddRange(newlist); OlData = oldlist.ToObservableCollection(); } } catch (Exception ex) {  } }); }); } /// <summary>
        /// 再次加载 /// </summary>
        public void ResetPage() { try { page = 1; if (scrollViewer != null) { scrollViewer.ScrollToHome(); } } catch (Exception ex) { CommonLib.LogClass.SystemErrLog("", ex.ToString()); } } public event Action<int,int> NextPaged; bool alreadyHookedScrollEvents = false; void UserControl_Loaded(object sender, RoutedEventArgs e) { Task.Run(() => { this.Dispatcher.InvokeAsync(() => { try { scrollViewer = FindSimpleVisualChild<ScrollViewer>(listBox); } catch (Exception ex) { 
 } }); }); } T FindSimpleVisualChild<T>(DependencyObject element) where T : class { while (element != null) { if (element is T) return element as T; element = VisualTreeHelper.GetChild(element, 0); } return null; } private void ScrollViewer_ScrollChanged(object sender, ScrollChangedEventArgs e) { if (isBootomScrollView(scrollViewer)) { if (pageSize < Total) { page++; pageSize = page * 10; NextPaged?.Invoke( page,10);
 } } } private bool isBootomScrollView(ScrollViewer view) { bool isBottom = false; double dVer = view.VerticalOffset; double vViewport = view.ViewportHeight; double eextent = view.ExtentHeight; if (dVer != 0) { if (dVer + vViewport == eextent) { isBottom = true; } else { isBottom = false; } } else { isBottom = false; } return isBottom; } }

 

以上只是个人见解，应该有更好的方式。希望大家指点一下。