Как отобразить поисковую строку на прокрутке сетки в UWP, такую ​​же, как Whatsapp в iOS?

Question

Я хочу отобразить SearchBox, когда пользователь прокручивает сетку, подобную поисковому окну, который появляется в Whatsapp, когда пользователь прокручивает списокView. Я знаю, как добавить простое окно поиска, которое всегда видимо, но возможно ли в UWP иметь такое же поведение, как и iOS?

Answer 1

Одним из способов достижения этой цели является наличие обработчик событий ScrollViewers ViewChanged проверить тип прокруткой. Это ScrollViewer может быть частью ListView, GridView и т.д.

private double previousScrollPosition = -1; 

private async void ScrollViewer_ViewChanged(object sender, ScrollViewerViewChangedEventArgs e) 
{ 
    try 
    { 
     ScrollViewer Scroller = sender as ScrollViewer; 

     var verticalOffsetValue = Scroller.VerticalOffset; 
     var maxVerticalOffsetValue = Scroller.ExtentHeight - Scroller.ViewportHeight; 
     if (previousScrollPosition < Scroller.VerticalOffset) 
     { 
      await Windows.ApplicationModel.Core.CoreApplication.MainView.CoreWindow.Dispatcher.RunAsync(CoreDispatcherPriority.Normal, 
      () => 
      { 
       previousScrollPosition = Scroller.VerticalOffset; 
       SearchSP.Visibility = Visibility.Collapsed; 
      }); 
     } 
     else if (previousScrollPosition > Scroller.VerticalOffset + 70 || Scroller.VerticalOffset == 0) 
     { 
      await Windows.ApplicationModel.Core.CoreApplication.MainView.CoreWindow.Dispatcher.RunAsync(CoreDispatcherPriority.Normal, 
      () => 
      { 
       previousScrollPosition = Scroller.VerticalOffset; 
       SearchSP.Visibility = Visibility.Visible; 
      }); 
     } 
    } 
    catch (Exception ex) 
    { 
     Debug.WriteLine("Error in scrollviewer changed " + ex.Message); 
    } 
} 

Это ниже линии коды, когда, если я прокрутка небольшого количества вертикального расстояния, т.е.; 70, то не показывает SearchBox, но если изменение больше, чем смещение + 70, а затем отображение SearchBox. Также покажите это, если scrollviewer находится наверху.

previousScrollPosition > Scroller.VerticalOffset + 70 || Scroller.VerticalOffset == 0 

И так как вы хотите только SearchBox, когда находитесь на самом верху. замените указанную выше строку кода только Scroller.VerticalOffset == 0