xamarin 保持ListView,滚动时标题锚定/粘滞/冻结在顶部

ncgqoxb0  于 2023-03-06  发布在  其他
关注(0)|答案(2)|浏览(145)

当垂直向下滚动ListView项目时,如何保持ListView的内置Header冻结在顶部?

标记为重复之前:我尝试在Keep ListView.HeaderTemplate visible/static/sticky in UWP中为Xamarin.Forms应用针对Android的答案,但没有成功。

短代码示例:

<ListView ItemsSource="{Binding MyList}"             
          HasUnevenRows="True"
          SeparatorVisibility="Default"
          CachingStrategy="RecycleElement">

    <ListView.Header>
        <Label HorizontalTextAlignment="Center"
               FontAttributes="Bold"
               Text="Header Title"/>
    </ListView.Header>
                
    <ListView.ItemTemplate>
        <DataTemplate>
            <ViewCell>
                <Label Text="{Binding Name}"/>
            </ViewCell>
        </DataTemplate>
    </ListView.ItemTemplate>
</ListView>
eoxn13cs

eoxn13cs1#

尝试将标签放置在列表视图外部,无论滚动与否,标签都将位于列表视图上方:

<Label HorizontalTextAlignment="Center"
           FontAttributes="Bold"
           Text="Header Title"/>
<ListView ItemsSource="{Binding MyList}"             
      HasUnevenRows="True"
      SeparatorVisibility="Default"
      CachingStrategy="RecycleElement"
      Margin="0,-5,0,0">

    <ListView.ItemTemplate>
        <DataTemplate>
            <ViewCell>
                <Label Text="{Binding Name}"/>
            </ViewCell>
        </DataTemplate>
    </ListView.ItemTemplate>
</ListView>
kqqjbcuj

kqqjbcuj2#

如果列表不长,下面是一种替代方法

<StackLayout>
        <Label HorizontalTextAlignment="Center"
               FontAttributes="Bold"
               Text="Header Title"/>
        <StackLayout BindableLayout.ItemsSource="{Binding MyList}">
            <BindableLayout.ItemTemplate>
                <DataTemplate>
                    <StackLayout>
                        <Label Text="{Binding Name}"/>
                        <!-- boxview as separator -->
                        <BoxView HeightRequest="1" Color="Aqua" HorizontalOptions="FillAndExpand"/>
                    </StackLayout>
                </DataTemplate>
            </BindableLayout.ItemTemplate>
        </StackLayout>
    </StackLayout>

相关问题