xamarin .NET MAUI CollectionView重置为第一个索引

bgibtngc  于 2023-04-18  发布在  .NET
关注(0)|答案(1)|浏览(138)

所以我试着做一个无限的左右滚动。我可以正确地做它的权利,但代码不能顺利地向左工作。如果万一用户滚动到右边,并达到年底,它会添加更多的itens到ObservableCollection和加载更多的itens。如果用户滚动到左边,它会插入一个新的0索引,以创建一个无限排序的ObservableCollection。但是当我在列表的开头插入一个项目时,collectionview会滚动到0位置。
在我的ViewModel上:

public void UpdateCollectionView(int mag)
        {
            if (mag == 1)
            {
                for (int i = 0; i < 5; i++)
                {
                    Dates.Add(new Label() { Text = (ConvertToDate(Dates[Dates.Count - 1].Text).Date.AddDays(1).ToString()) } ) ;
                }
            }
            else if (mag == -1)
            {
                for (int i = 0; i < 5; i++)
                {
                    Dates.Insert(0, new Label() { Text = (ConvertToDate(Dates[0].Text).Date.AddDays(-1).ToString()) });
                }
            }
        }

代码隐藏:

private void collectionViewDates_Scrolled(object sender, ItemsViewScrolledEventArgs e)
    {
        vm.UpdateMounth(e.CenterItemIndex);
        if ((e.LastVisibleItemIndex - 5) == (vm.Dates.Count - 6))
            vm.UpdateCollectionView(1);
        else if (e.FirstVisibleItemIndex == 0)
        {
            vm.UpdateCollectionView(-1);
        }
    }

示例1:

<CollectionView x:Name="collectionViewDates" ItemsSource="{Binding Dates}" SelectionChanged="CollectionView_SelectionChanged"
                                    SelectionMode="Single" SelectedItem="{Binding SelectedItem}" ItemsUpdatingScrollMode="KeepScrollOffset" Scrolled="collectionViewDates_Scrolled"
                                 ItemsLayout="HorizontalList" VerticalOptions="CenterAndExpand">
                    <CollectionView.ItemTemplate>
                        <DataTemplate>
                               
                                <Grid>
                                    <VisualStateManager.VisualStateGroups>
                                        <VisualStateGroup Name="CommonStates">
                                            <VisualState Name="Normal"></VisualState>
                                            <VisualState Name="Selected">
                                                <VisualState.Setters>
                                                    <Setter Property="BackgroundColor" Value="Transparent"></Setter>
                                                </VisualState.Setters>
                                            </VisualState>

                                        </VisualStateGroup>
                                    </VisualStateManager.VisualStateGroups>

                                    <Border ZIndex="0" Grid.Column="0" HeightRequest="50"  WidthRequest="75" BackgroundColor="#1DABF9"
                                       Padding="0" HorizontalOptions="CenterAndExpand" Margin="25,10,25,0"
                                           VerticalOptions="FillAndExpand" >
                                            <Border.StrokeShape>
                                                <RoundRectangle CornerRadius="10,10,10,10">
                                                </RoundRectangle>
                                            </Border.StrokeShape>

                                        <Label Text="{Binding Text, Converter={StaticResource StringConverter}}" TextColor="White" FontSize="18" FontAttributes="Bold" 
                                                   HorizontalTextAlignment="Center" VerticalTextAlignment="Center">
                    
                                        </Label>
                                        </Border>

                                </Grid>

                        </DataTemplate>
                    </CollectionView.ItemTemplate>
                </CollectionView>

如果它到达CollectionView的开始,它会向左加载5个itens。
示例:
一二三四五
-4 -3 -2 -1 0 1 2 3 4 5
但是,由于-4现在的索引为0,因此它将滚动到-4 -3 -2,而不是保持1 2 3可见。
有一种方法可以锁定CollectionView的滚动到列表的开头?或者以不同的方式进行inifinity滚动?我真的需要一些帮助来解决这个问题或如何实现此功能的其他想法。

4zcjmb1e

4zcjmb1e1#

我创建了一个小示例来重现你的问题。但是当我在collectionview的头部插入item时,它不会滚动到0索引。
Page.xaml:

<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             x:Class="MauiAppTest.NewPage1"
             Title="NewPage1">
    <VerticalStackLayout>
        <CollectionView x:Name="collection" ItemsLayout="HorizontalList" Scrolled="collection_Scrolled">
            <CollectionView.ItemTemplate>
                <DataTemplate>
                    <Label Text="{Binding}" HeightRequest="80" WidthRequest="80" BackgroundColor="Pink"/>
                </DataTemplate>
            </CollectionView.ItemTemplate>
        </CollectionView>
    </VerticalStackLayout>
</ContentPage>

和页面.cs:

public partial class NewPage1 : ContentPage
{
      ObservableCollection<string> values = new();
      public NewPage1()
      {
            InitializeComponent();
            for(int i = 0; i < 10; i++)
            {
                  values.Add(i.ToString());
            }
            collection.ItemsSource = values;
            
      }

      private void collection_Scrolled(object sender, ItemsViewScrolledEventArgs e)
      {
            if(e.FirstVisibleItemIndex == 0)
            {
            for (int i = 0; i < 5; i++)
            {
                values.Insert(0,i.ToString());
            }
        }
            if(e.LastVisibleItemIndex == values.Count - 1)
            {
            for (int i = 0; i < 5; i++)
            {
                values.Add(i.ToString());
            }
        }
    }
}

相关问题