Как показать и скрыть StackLayout на основе направления прокрутки ListView в Xamarin.Forms?

Question

У меня есть экран с ListView, который показывает коллекцию комментариев. Кроме того, у меня есть StackLayout, перекрывающий конец ListView, который имеет Entry и Button для добавления нового комментария.

Я хочу скрыть / показать это StackLayout в зависимости от направления прокрутки ListView:

• Если пользователь прокручивает вниз -> скрыть StackLayout.
• Если пользователь прокручивает вверх -> показать StackLayout.

Кто-нибудь знает способ достижения такого поведения?

Заранее спасибо!

Answer 1

Xamarin.Forms ListView предоставляет событие OnItemAppearing, на которое вы можете подписаться. При этом вы можете отслеживать направление прокрутки, найдя индекс элемента, который появился, и сравнив его с последним элементом, который появился. Попробуйте что-то вроде этого:

public partial class MainPage : ContentPage
{
    public ObservableCollection<MyItemType> Items { get; set; } = new ObservableCollection<MyItemType>();
    int lastItemIndex;
    int currentItemIndex;

    public MainPage()
    {
        ...
        listView.ItemAppearing += ListView_ItemAppearing;
    }

    void ListView_ItemAppearing(object sender, ItemVisibilityEventArgs e)
    {
        MyItemType item = e.Item as MyItemType;

        currentItemIndex = Items.IndexOf(item);
        if (currentItemIndex > lastItemIndex)
        {
            stackLayout.IsVisible = false;
        }
        else
        {
            stackLayout.IsVisible = true;
        }
        lastItemIndex = currentItemIndex;
    }
}

РЕДАКТИРОВАТЬ: Мерцание действительно из-за изменения размера ListView, когда StackLayout показывает и скрывает, поэтому убедитесь, что ListView не изменяется. Возможно, поместите ListView и StackLayout в сетку, чтобы при отображении и скрытии StackLayout размер ListView не изменялся, например ::

<Grid>
    <Grid.RowDefinitions>
        <RowDefinition Height="*" />
        <RowDefinition Height="35" />
    </Grid.RowDefinitions>
    <ListView x:Name="listView"
              ItemsSource="{Binding Items}" 
              Grid.Row="0">
        <ListView.ItemTemplate>
            ...
        </ListView.ItemTemplate>
    </ListView>
    <StackLayout x:Name="stackLayout"
                 Grid.Row="1">
        ...
    </StackLayout>
</Grid>

С учетом вышеизложенного мерцание больше не возникает.