Xamarin.Forms CollectionView kaydırma

Örneği indirin

CollectionViewScrollToöğeleri görünüme kaydırılan iki yöntemi tanımlar. Aşırı yüklerden biri, belirtilen dizindeki öğeyi görünüme kaydırır, diğeri belirtilen öğeyi görünüme kaydırır. Her iki aşırı yükleme, öğenin ait olduğu grubu belirtmek için belirtime ek bağımsız değişkenlere, kaydırma işlemi tamamlandıktan sonra öğenin tam konumunu ve kaydırmanın animasyonu yapılıp yapılmayacağını belirtir.

CollectionViewScrollToRequestedmetotlardan biri çağrıldığında tetiklenen bir olay tanımlar ScrollTo . ScrollToRequestedEventArgsOlaya eşlik eden nesne,,, ScrollToRequested ve dahil olmak üzere birçok özelliğe sahiptir IsAnimatedIndexItemScrollToPosition . Bu özellikler, yöntem çağrılarında belirtilen bağımsız değişkenlerden ayarlanır ScrollTo .

Ayrıca, CollectionViewScrolled kaydırılan olduğunu göstermek için tetiklenen bir olayı tanımlar. ItemsViewScrolledEventArgsOlaya eşlik eden nesnenin Scrolled birçok özelliği vardır. Daha fazla bilgi için bkz. kaydırmayı Algıla.

CollectionView Ayrıca ItemsUpdatingScrollMode , CollectionView yeni öğeler eklendiğinde öğesinin kaydırma davranışını temsil eden bir özelliği tanımlar. Bu özellik hakkında daha fazla bilgi için, bkz. yeni öğeler eklendiğinde kaydırma konumunu denetleme.

Bir Kullanıcı bir kaydırma başlatmak üzere pes geldiğinde, kaydırmanın bitiş konumu, öğelerin tam olarak gösterilmesi için denetlenebilir. Kaydırma işlemi durdurulduğunda öğeler konuma yapışdığı için bu özellik yapışma olarak bilinir. Daha fazla bilgi için bkz. yaslama noktaları.

CollectionView Ayrıca, Kullanıcı kaydırıldığında verileri artımlı olarak yükleyebilir. Daha fazla bilgi için bkz. verileri artımlı olarak yükleme.

Kaydırmayı Algıla

CollectionViewScrolledkaydırmanın oluştuğunu göstermek için tetiklenen bir olay tanımlar. ItemsViewScrolledEventArgsOlaya eşlik eden nesneyi temsil eden sınıfı, Scrolled aşağıdaki özellikleri tanımlar:

• HorizontalDelta, türünde double , yatay kaydırma miktardaki değişikliği temsil eder. Bu, sola kaydırma sırasında negatif bir değer ve sağ kaydırılırken pozitif bir değer.
• VerticalDelta, türü double Dikey kaydırma miktardaki değişikliği temsil eder. Bu, yukarı kaydırma sırasında negatif bir değer ve aşağı kaydırılırken pozitif bir değer.
• HorizontalOffset, türünde double , listenin yatay olarak kaynağından yatay olarak kaydırılacağı miktarı tanımlar.
• VerticalOffsettüründe double , listenin sıfırdan dikey olarak kaydırılacağı miktarı tanımlar.
• FirstVisibleItemIndex, türünde int , listede görünen ilk öğenin dizinidir.
• CenterItemIndex, türü, int listede görünür olan Merkez öğesinin dizinidir.
• LastVisibleItemIndex, türünde int , listede görünen son öğenin dizinidir.

Aşağıdaki XAML örneği, CollectionView olay için bir olay işleyicisi ayarlayan bir göstermektedir Scrolled :

<CollectionView Scrolled="OnCollectionViewScrolled">
    ...
</CollectionView>

Eşdeğer C# kodu:

CollectionView collectionView = new CollectionView();
collectionView.Scrolled += OnCollectionViewScrolled;

Bu kod örneğinde olay OnCollectionViewScrolled işleyicisi Scrolled olay tetiklendiğinde yürütülür:

void OnCollectionViewScrolled(object sender, ItemsViewScrolledEventArgs e)
{
    // Custom logic
}

Dizindeki bir öğeyi görünüme kaydır

İlk ScrollTo yöntem aşırı yüklemesi belirtilen dizindeki öğeyi görünüme kaydırır. Adlı bir CollectionView nesne verildiğinde collectionView Aşağıdaki örnek, öğesinin 12 dizinindeki öğenin görünümüne nasıl kaydırılacağını göstermektedir:

collectionView.ScrollTo(12);

Alternatif olarak, gruplandırılmış verilerdeki bir öğe, öğe ve grup dizinleri belirtilerek görünüm halinde kaydırılabilirler. Aşağıdaki örnek, ikinci gruptaki üçüncü öğenin görünümüne nasıl kaydırılacağını gösterir:

// Items and groups are indexed from zero.
collectionView.ScrollTo(2, 1);

Öğeyi görünüme kaydır

İkinci ScrollTo yöntem aşırı yüklemesi belirtilen öğeyi görünüme kaydırır. Adlı bir CollectionView nesne verildiğinde collectionView , aşağıdaki örnek Proboscne maymun öğesinin görünüme kaydırılacağını gösterir:

MonkeysViewModel viewModel = BindingContext as MonkeysViewModel;
Monkey monkey = viewModel.Monkeys.FirstOrDefault(m => m.Name == "Proboscis Monkey");
collectionView.ScrollTo(monkey);

Alternatif olarak, gruplandırılmış verilerdeki bir öğe, öğe ve grup belirtilerek görünüm halinde kaydırılabilirler. Aşağıdaki örnek, Monboscne maymun öğesinin Monkeys grubunda nasıl görüneceğini gösterir:

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

Kaydırma animasyonunu devre dışı bırak

Bir öğeyi görünüme kaydırırken kaydırılan bir animasyon görüntülenir. Ancak, bu animasyon animate yöntemin bağımsız değişkeni olarak ayarlanarak devre dışı bırakılabilir ScrollTofalse :

collectionView.ScrollTo(monkey, animate: false);

Denetim kaydırma konumu

Bir öğeyi görünüme kaydırırken, kaydırma tamamlandıktan sonra öğenin tam konumu, position yöntemlerin bağımsız değişkeniyle birlikte belirtilebilir ScrollTo . Bu bağımsız değişken bir ScrollToPosition numaralandırma üyesini kabul eder.

MakeVisible

ScrollToPosition.MakeVisibleÜye, görünümde görünene kadar öğenin kaydırılabileceğini belirtir:

collectionView.ScrollTo(monkey, position: ScrollToPosition.MakeVisible);

Bu örnek kod, öğeyi görünüme kaydırmak için gereken en az kaydırma ile sonuçlanır:

ile bir CollectionView dikey listesinin kaydırılan öğe

Başlangıç

ScrollToPosition.StartÜye, öğenin görünümün başlangıcına kaydırılacağını gösterir:

collectionView.ScrollTo(monkey, position: ScrollToPosition.Start);

Bu örnek kod, görünümün başlangıcına kaydırılmakta olan öğe ile sonuçlanır:

, kaydırılan öğe içeren listesini

Merkez

ScrollToPosition.CenterÜye, öğenin görünümün merkezine kaydırılacağını gösterir:

collectionView.ScrollTo(monkey, position: ScrollToPosition.Center);

Bu örnek kod, görünümün ortasına kaydırılmakta olan öğe ile sonuçlanır:

ile bir CollectionView dikey listesinin kaydırılan öğe dikey liste

End

ScrollToPosition.EndÜye, öğenin görünümün sonuna kaydırılacağını gösterir:

collectionView.ScrollTo(monkey, position: ScrollToPosition.End);

Bu örnek kod, görünümün sonuna kaydırılmakta olan öğe ile sonuçlanır:

'ta dikey liste ile kaydırılan öğe

Yeni öğeler eklendiğinde kaydırma konumunu denetle

CollectionView bağlanabilir bir ItemsUpdatingScrollMode özellik tarafından desteklenen bir özelliği tanımlar. Bu özellik ItemsUpdatingScrollMode , CollectionView yeni öğeler eklendiğinde öğesinin kaydırma davranışını temsil eden bir sabit listesi değeri alır veya ayarlar. ItemsUpdatingScrollModeSabit listesi aşağıdaki üyeleri tanımlar:

• KeepItemsInView yeni öğeler eklendiğinde görüntülenen listedeki ilk öğeyi tutar.
• KeepScrollOffset yeni öğeler eklendiğinde geçerli kaydırma konumunun korunmasını sağlar.
• KeepLastItemInView yeni öğeler eklendiğinde görüntülenen listedeki son öğeyi tutmak için kaydırma sapmasını ayarlar.

Özelliğin varsayılan değeri ItemsUpdatingScrollModeKeepItemsInView . Bu nedenle, listedeki ilk öğe için yeni öğeler eklendiğinde CollectionView görüntülenen olarak kalır. Yeni öğeler eklendiğinde listedeki son öğenin görüntülendiğinden emin olmak için, ItemsUpdatingScrollMode özelliği şu şekilde ayarlayın KeepLastItemInView :

<CollectionView ItemsUpdatingScrollMode="KeepLastItemInView">
    ...
</CollectionView>

Eşdeğer C# kodu:

CollectionView collectionView = new CollectionView
{
    ItemsUpdatingScrollMode = ItemsUpdatingScrollMode.KeepLastItemInView
};

Kaydırma çubuğu görünürlüğü

CollectionViewHorizontalScrollBarVisibilityVerticalScrollBarVisibility , bağlanabilir Özellikler tarafından desteklenen ve özelliklerini tanımlar. Bu özellikler ScrollBarVisibility yatay veya dikey, kaydırma çubuğunun görünür olduğunu temsil eden bir sabit listesi değeri alır veya ayarlar. ScrollBarVisibilitySabit listesi aşağıdaki üyeleri tanımlar:

• Default platformun varsayılan kaydırma çubuğu davranışını gösterir ve, ve özellikleri için varsayılan değerdir HorizontalScrollBarVisibilityVerticalScrollBarVisibility .
• Always içerik görünüme sığsa bile kaydırma çubuklarının görünür olacağını gösterir.
• Never içerik görünüme sığmasa bile kaydırma çubuklarının görülemeyeceğini gösterir.

Yaslama noktaları

Bir Kullanıcı bir kaydırma başlatmak üzere pes geldiğinde, kaydırmanın bitiş konumu, öğelerin tam olarak gösterilmesi için denetlenebilir. Bu özellik yapışma olarak bilinir, çünkü kaydırma durdurulduğunda öğeler konuma yaslamayı sağlar ve sınıfından aşağıdaki özellikler tarafından denetlenir ItemsLayout :

• _ItemsLayout_SnapPointsType "Data-LinkType =" Absolute-path ">, SnapPointsTypeSnapPointsType kaydırma sırasında yaslama noktaları davranışını belirtir.
• Xamarin_Forms _ItemsLayout_SnapPointsAlignment "Data-LinkType =" Absolute-path ">, SnapPointsAlignmentSnapPointsAlignment yaslama noktalarının öğelerle nasıl hizalanacağını belirtir.

Bu özellikler nesneler tarafından desteklenir BindableProperty . Bu, özelliklerin veri bağlamalarının hedefleri olabileceği anlamına gelir.

Yaslama noktaları türü

SnapPointsTypeSabit listesi aşağıdaki üyeleri tanımlar:

• None kaydırmanın öğelere yapışmadığını gösterir.
• Mandatory içeriğin her zaman, kaydırmanın yönü içinde, kaydırmanın doğal olarak durması için en yakın yapışma noktasına yapışdığını gösterir.
• MandatorySingle aynı davranışı gösterir Mandatory , ancak aynı anda yalnızca bir öğe kayar.

Varsayılan olarak, aşağıdaki ekran görüntülerinde gösterildiği gibi, Xamarin_Forms _ItemsLayout_SnapPointsType "Data-LinkType =" Absolute-path ">SnapPointsType özelliği olarak ayarlanır SnapPointsType.None .

Yaslama noktaları hizalaması

SnapPointsAlignmentSabit listesi Start , Center , ve üyelerini tanımlar End .

Başlangıç

SnapPointsAlignment.StartÜye, yapışma noktalarının, öğelerin önde gelen kenarıyla hizalandığını gösterir.

Varsayılan olarak, Xamarin_Forms _ItemsLayout_SnapPointsAlignment "Data-LinkType =" Absolute-path ">SnapPointsAlignment özelliği olarak ayarlanır SnapPointsAlignment.Start . Ancak, bu numaralandırma üyesinin nasıl ayarlanacağını aşağıdaki XAML örneğinde gösterir:

<CollectionView ItemsSource="{Binding Monkeys}">
    <CollectionView.ItemsLayout>
        <LinearItemsLayout Orientation="Vertical"
                           SnapPointsType="MandatorySingle"
                           SnapPointsAlignment="Start" />
    </CollectionView.ItemsLayout>
    ...
</CollectionView>

Eşdeğer C# kodu:

CollectionView collectionView = new CollectionView
{
    ItemsLayout = new LinearItemsLayout(ItemsLayoutOrientation.Vertical)
    {
        SnapPointsType = SnapPointsType.MandatorySingle,
        SnapPointsAlignment = SnapPointsAlignment.Start
    },
    // ...
};

Bir Kullanıcı bir kaydırma başlatmak için bir kaydığında, üstteki öğe görünümün en üstüne hizalanır:

başlangıç yaslama noktalarıyla dikey liste

Merkez

SnapPointsAlignment.CenterÜye, yapışma noktalarının öğelerin merkeziyle hizalandığını gösterir. Aşağıdaki XAML örneği, bu numaralandırma üyesinin nasıl ayarlanacağını göstermektedir:

<CollectionView ItemsSource="{Binding Monkeys}">
    <CollectionView.ItemsLayout>
        <LinearItemsLayout Orientation="Vertical"
                           SnapPointsType="MandatorySingle"
                           SnapPointsAlignment="Center" />
    </CollectionView.ItemsLayout>
    ...
</CollectionView>

Eşdeğer C# kodu:

CollectionView collectionView = new CollectionView
{
    ItemsLayout = new LinearItemsLayout(ItemsLayoutOrientation.Vertical)
    {
        SnapPointsType = SnapPointsType.MandatorySingle,
        SnapPointsAlignment = SnapPointsAlignment.Center
    },
    // ...
};

Bir Kullanıcı bir kaydırma başlatmak üzere bir kaydığında, üstteki öğe, görünümün en üstüne hizalanır:

merkezi ek noktalarıyla dikey liste

End

SnapPointsAlignment.EndÜye, yapışma noktalarının sondaki öğelerin kenarıyla hizalandığını gösterir. Aşağıdaki XAML örneği, bu numaralandırma üyesinin nasıl ayarlanacağını göstermektedir:

<CollectionView ItemsSource="{Binding Monkeys}">
    <CollectionView.ItemsLayout>
        <LinearItemsLayout Orientation="Vertical"
                           SnapPointsType="MandatorySingle"
                           SnapPointsAlignment="End" />
    </CollectionView.ItemsLayout>
    ...
</CollectionView>

Eşdeğer C# kodu:

CollectionView collectionView = new CollectionView
{
    ItemsLayout = new LinearItemsLayout(ItemsLayoutOrientation.Vertical)
    {
        SnapPointsType = SnapPointsType.MandatorySingle,
        SnapPointsAlignment = SnapPointsAlignment.End
    },
    // ...
};

Bir Kullanıcı bir kaydırma başlatmak için bir kaydığında, alt öğe görünümün alt öğesiyle hizalanacaktır:

bitiş yaslama noktaları ile dikey liste bitiş yaslama

İlgili bağlantılar

• CollectionView (örnek)