在 Xamarin c# 中滚动到可观察集合中的选定项目

Posted 2023-04-13

【中文标题】在 Xamarin c# 中滚动到可观察集合中的选定项目

【英文标题】：Scrolling to a selected item in an observable collection in Xamarin c#

【发布时间】：2021-12-09 00:54:23

【问题描述】：

我想自动滚动到我的收藏视图中的选定项目。我正在使用 ObservableCollection 并且能够在我的视图中预先选择一个项目。所以我希望它出现在屏幕上以防万一物品很多。

所以视图应该自动滚动到选定的项目。

代码

public ObservableCollection WorkerFlockDetails  get; set; 

private WorkerFlock selectedFlock;
    public WorkerFlock SelectedFlock
    
        get => selectedFlock;
         set
        
            if (selectedFlock != value)
            
                try
                
                    //Feed = selectedFlock.Feed_intake.ToString() + " Kg";
                    selectedFlock = value;
                
                catch
                

                
                finally
                
                    PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(nameof(SelectedFlock)));
                
            
        
    

这是我初始化和预选的地方

public HomeWorkerViewModel()
    

        WorkerFlockDetails = new ObservableCollection<WorkerFlock>();

        //populate the collection
        Init();

        
        SelectedFlock = WorkerFlockDetails.Skip(3).FirstOrDefault();

    

【参考方案1】：

您可以使用下面的代码并在页面变为可见之前在 OnAppearing 中设置 ScrollTo 方法。

Xaml：

  <CollectionView x:Name="collectionView"
                    ItemsSource="Binding WorkerFlockDetails" 
                    ItemsLayout="HorizontalList" 
                    SelectionMode="Single"  
                     VerticalOptions="Start"
                        Margin="0,22,0,0"
                        HeightRequest="32"
                    SelectedItem="Binding SelectedFlock, Mode=TwoWay">
        <CollectionView.ItemTemplate>
            <DataTemplate>
                <Grid>
                    <Label Text="Binding Name"  Margin="20,0,20,0"
                           TextColor="#707070"
                           FontSize="20"></Label>
                </Grid>
            </DataTemplate>
        </CollectionView.ItemTemplate>
    </CollectionView>

后面的代码：

  public partial class Page19 : ContentPage

    public ObservableCollection<WorkerFlock> WorkerFlockDetails  get; set; 
    public WorkerFlock SelectedFlock  get; set; 
    public Page19()
    
        InitializeComponent();

        WorkerFlockDetails = new ObservableCollection<WorkerFlock>()
        
            new WorkerFlock() Name="A",
            new WorkerFlock() Name="B",
            new WorkerFlock() Name="C",
            new WorkerFlock() Name="D",
            new WorkerFlock() Name="E",
            new WorkerFlock() Name="F",
            new WorkerFlock() Name="G"
        ;
        SelectedFlock = WorkerFlockDetails.Skip(3).FirstOrDefault();

        this.BindingContext = this; 
    
    protected override void OnAppearing()
    
        base.OnAppearing();
        collectionView.ScrollTo(collectionView.SelectedItem, null, ScrollToPosition.Center, false);
    

public class WorkerFlock

    public string Name  get; set; 

【参考方案2】：

您可以使用 .ScrollTo(); CollectionView 上的方法。