CollectionView 无法按索引滚动到所需的组

问题描述 投票：0回答：1

为什么当我尝试导航到特定组时，我总是被发送回第一个组？

如果我找到一个组，并在其中找到我需要的实例，并将其传递给 ScrollTo，则搜索可以正常工作。

AnimalGroup group = viewModel.Animals.FirstOrDefault(a => a.Name == "Monkeys");
Animal monkey = group.FirstOrDefault(m => m.Name == "Proboscis Monkey");
collectionView.ScrollTo(monkey, group);

但是我不能用索引来做到这一点。请帮我解决一下。

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             x:Class="MauiAppColScroll.MainPage">

    <ScrollView>
        <VerticalStackLayout
            Padding="30,0"
            Spacing="25">
            

            <CollectionView HeightRequest="300" x:Name="collectionView" 
                            ItemsSource="{Binding Animals}" 
                IsGrouped="true">
                <CollectionView.GroupHeaderTemplate>
                    <DataTemplate>
                        <Label Text="{Binding Name}"
                   BackgroundColor="LightGray"
                   FontSize="18"
                   FontAttributes="Bold" />
                    </DataTemplate>
                </CollectionView.GroupHeaderTemplate>
                <CollectionView.ItemTemplate>
                    <DataTemplate>
                        <Grid Padding="10">
                            
                            <Image Grid.RowSpan="2"
                       Source="{Binding ImageUrl}"
                       Aspect="AspectFill"
                       HeightRequest="60"
                       WidthRequest="60" />
                            <Label Grid.Column="1"
                       Text="{Binding Name}"
                       FontAttributes="Bold" />
                            <Label Grid.Row="1"
                       Grid.Column="1"
                       Text="{Binding Location}"
                       FontAttributes="Italic"
                       VerticalOptions="End" />
                        </Grid>
                    </DataTemplate>
                </CollectionView.ItemTemplate>
            </CollectionView>

            <Button x:Name="Btn1"  Text="Btn1"  
                    Clicked="Btn1_Clicked"/>
            <Button x:Name="Btn2"  Text="Btn2"  
        Clicked="Btn2_Clicked"/>
            <Button x:Name="Btn3"  Text="Btn3"  
        Clicked="Btn3_Clicked"/>
            <Button x:Name="Btn4"  Text="Btn4"  
        Clicked="Btn4_Clicked"/>
            <Button x:Name="Btn5"  Text="Btn5"  
        Clicked="Btn5_Clicked"/>
        </VerticalStackLayout>
    </ScrollView>

</ContentPage>


using Microsoft.Maui.Controls;
using System.Collections.ObjectModel;

namespace MauiAppColScroll
{
    public partial class MainPage : ContentPage
    {
        int count = 0;
        public ObservableCollection<AnimalGroup> Animals { get; private set; } = new ObservableCollection<AnimalGroup>();

        public MainPage()
        {
            Animals.Add(new AnimalGroup("Bears", new ObservableCollection<Animal>
{
    new Animal
    {
        Name = "American Black Bear",
        Location = "North America",
        Details = "Details about the bear go here.",
        ImageUrl = "https://upload.wikimedia.org/wikipedia/commons/0/08/01_Schwarzbär.jpg"
    },
    new Animal
    {
        Name = "Asian Black Bear",
        Location = "Asia",
        Details = "Details about the bear go here.",
        ImageUrl = "https://upload.wikimedia.org/wikipedia/commons/thumb/b/b7/Ursus_thibetanus_3_%28Wroclaw_zoo%29.JPG/180px-Ursus_thibetanus_3_%28Wroclaw_zoo%29.JPG"
    },
}));

            Animals.Add(new AnimalGroup("Monkeys", new ObservableCollection<Animal>
{
    new Animal
    {
        Name = "Baboon",
        Location = "Africa & Asia",
        Details = "Details about the monkey go here.",
        ImageUrl = "https://upload.wikimedia.org/wikipedia/commons/thumb/f/fc/Papio_anubis_%28Serengeti%2C_2009%29.jpg/200px-Papio_anubis_%28Serengeti%2C_2009%29.jpg"
    },
    new Animal
    {
        Name = "Capuchin Monkey",
        Location = "Central & South America",
        Details = "Details about the monkey go here.",
        ImageUrl = "https://upload.wikimedia.org/wikipedia/commons/thumb/4/40/Capuchin_Costa_Rica.jpg/200px-Capuchin_Costa_Rica.jpg"
    },
    new Animal
    {
        Name = "Blue Monkey",
        Location = "Central and East Africa",
        Details = "Details about the monkey go here.",
        ImageUrl = "https://upload.wikimedia.org/wikipedia/commons/thumb/8/83/BlueMonkey.jpg/220px-BlueMonkey.jpg"
    },
}));
            Animals.Add(new AnimalGroup("Horses", new ObservableCollection<Animal>
{
    new Animal
    {
        Name = "American Black Bear",
        Location = "North America",
        Details = "Details about the bear go here.",
        ImageUrl = "https://upload.wikimedia.org/wikipedia/commons/0/08/01_Schwarzbär.jpg"
    },
    new Animal
    {
        Name = "Asian Black Bear",
        Location = "Asia",
        Details = "Details about the bear go here.",
        ImageUrl = "https://upload.wikimedia.org/wikipedia/commons/thumb/b/b7/Ursus_thibetanus_3_%28Wroclaw_zoo%29.JPG/180px-Ursus_thibetanus_3_%28Wroclaw_zoo%29.JPG"
    },
}));
            Animals.Add(new AnimalGroup("Cats", new ObservableCollection<Animal>
{
    new Animal
    {
        Name = "American Black Bear",
        Location = "North America",
        Details = "Details about the bear go here.",
        ImageUrl = "https://upload.wikimedia.org/wikipedia/commons/0/08/01_Schwarzbär.jpg"
    },
    new Animal
    {
        Name = "Asian Black Bear",
        Location = "Asia",
        Details = "Details about the bear go here.",
        ImageUrl = "https://upload.wikimedia.org/wikipedia/commons/thumb/b/b7/Ursus_thibetanus_3_%28Wroclaw_zoo%29.JPG/180px-Ursus_thibetanus_3_%28Wroclaw_zoo%29.JPG"
    },
}));
            Animals.Add(new AnimalGroup("Dogs", new ObservableCollection<Animal>
{
    new Animal
    {
        Name = "American Black Bear",
        Location = "North America",
        Details = "Details about the bear go here.",
        ImageUrl = "https://upload.wikimedia.org/wikipedia/commons/0/08/01_Schwarzbär.jpg"
    },
    new Animal
    {
        Name = "Asian Black Bear",
        Location = "Asia",
        Details = "Details about the bear go here.",
        ImageUrl = "https://upload.wikimedia.org/wikipedia/commons/thumb/b/b7/Ursus_thibetanus_3_%28Wroclaw_zoo%29.JPG/180px-Ursus_thibetanus_3_%28Wroclaw_zoo%29.JPG"
    },
}));
            InitializeComponent();
            BindingContext = this;
       
        }



        private void Btn1_Clicked(object sender, EventArgs e)
        {
            collectionView.ScrollTo(1, 0);
        }
        private void Btn2_Clicked(object sender, EventArgs e)
        {
            collectionView.ScrollTo(1, 1);
        }
        private void Btn3_Clicked(object sender, EventArgs e)
        {
            collectionView.ScrollTo(1, 2);
        }
        private void Btn4_Clicked(object sender, EventArgs e)
        {
            collectionView.ScrollTo(1, 3);
        }
        private void Btn5_Clicked(object sender, EventArgs e)
        {
            collectionView.ScrollTo(1, 4);
        }
    }

}


using System;
using System.Collections.Generic;
using System.Collections.ObjectModel;
using System.Linq;
using System.Text;
using System.Threading.Tasks;

namespace MauiAppColScroll
{
    public class AnimalGroup : ObservableCollection<Animal>
    {
        public string Name { get; private set; }

        public AnimalGroup(string name, ObservableCollection<Animal> animals) : base(animals)
        {
            Name = name;
        }
    }
}


using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;

namespace MauiAppColScroll
{
    public class Animal
    {
        public string Name { get; set; }
        public string Location { get; set; }
        public string Details { get; set; }
        public string ImageUrl { get; set; }
    }
}

我预料到了 打电话时

 private void Btn5_Clicked(object sender, EventArgs e)
 {
     collectionView.ScrollTo(1, 4);
 }

我将看到第五组“狗”，如果我位于列表中间，它会将我转移到第一组。或者如果我在加载后立即单击 Btn5，则什么也不会发生。

c# maui collectionview scrolltoindex
1个回答
0
投票

您可以使用 

LINQ
过滤 
5th group "Dogs"
，然后直接 将项目滚动到视图中 到 
5th Dogs group
:

private void Btn5_Clicked(object sender, EventArgs e)
{
    AnimalGroup group = Animals.FirstOrDefault(a => a.Name == "Dogs");
    Animal dog = group.FirstOrDefault(m => m.Name == "American Black Bear");
    
    collectionView.ScrollTo(dog, group);
}
最新问题
© www.soinside.com 2019 - 2024. All rights reserved.