c# - 在 Xamarin Forms 中滚动时如何折叠(隐藏或向上滑动)导航栏(标题栏)？

Question

我有一个 ContentPage，上面有一个包含页面标题的导航栏(标题栏)。我希望导航栏在内容(可能是 ListView)向上滚动时折叠，并且当内容向下滚动时导航栏必须再次出现(向下滑动)。

请注意，我使用的是以前称为 MasterDetailPage 的 FlyoutPage。

这是我的 XAML 代码

<ContentPage ...
             NavigationPage.HasNavigationBar="True"
             Title="Home">
    <ContentPage.Content>

        <ListView VerticalOptions="FillAndExpand" HasUnevenRows="True" CachingStrategy="RecycleElement"
                        ItemsSource="{Binding ListItems}" SeparatorVisibility="None">
            <ListView.ItemTemplate>
                <DataTemplate>
                    <ViewCell>
                        <StackLayout...>
                            <Label... />
                        </StackLayout>
                    </ViewCell>
                </DataTemplate>
            </ListView.ItemTemplate>
        </ListView>

    </ContentPage.Content>
</ContentPage>

类似于此:

我如何在 Xamarin.Forms 中实现这一目标？

Answer 1

步骤:

1. 伪造一个标题栏并设置一个引用名称。
2. 附加滚动事件。
3. 添加动画。

检查示例代码或 sample project here .

XAML 页面

<ContentPage NavigationPage.HasNavigationBar="False">
    <ContentPage.Content>
        <StackLayout Spacing="0">
            <StackLayout
                x:Name="TitleLayout"
                BackgroundColor="#2296f3"
                HeightRequest="58"
                Orientation="Horizontal">
                <Label
                    Margin="40,0,0,0"
                    FontSize="20"
                    Text="Title"
                    TextColor="White"
                    VerticalOptions="CenterAndExpand" />
            </StackLayout>
            <ListView ...
                      Scrolled="ScrollView_Scrolled" >
            </ListView>
        </StackLayout>
    </ContentPage.Content>
</ContentPage>

XAML.cs 类

        private double previousOffset;

        private async void ScrollView_Scrolled(object sender, ScrolledEventArgs e)
        {
            double translation;
            bool visibility;

            if (previousOffset < e.ScrollY - 45) //scroll sensitivity
            {
                translation = -58; //same Title bar height
                visibility = false;
            }
            else if (previousOffset > e.ScrollY + 45)
            {
                translation = 0;
                visibility = true;
            }
            else
            {
                return;
            }

            await TitleLayout.TranslateTo(TitleLayout.TranslationX, translation, 300);
            await Task.Delay(100);
            TitleLayout.IsVisible = visibility;
            previousOffset = e.ScrollY;
        }