Xamarin.Forms CarouselView Kaydırma

CarouselView aşağıdaki kaydırmayla ilgili özellikleri tanımlar:

• HorizontalScrollBarVisibility, türündedir ScrollBarVisibilityve yatay kaydırma çubuğunun ne zaman görünür olduğunu belirtir.
• IsDragging, öğesinin kaydırılıp kaydırılmadığını CarouselView gösteren türündedirbool. Bu, varsayılan değeri olan salt okunur bir özelliktir false.
• IsScrollAnimated, türündedir boolve bu, kaydırılırken CarouselViewbir animasyonun gerçekleşip gerçekleşmeyeceğini belirtir. Varsayılan değer şudur: true.
• ItemsUpdatingScrollMode, türündedir ItemsUpdatingScrollMode. Bu, yeni öğeler eklendiğinde kaydırma CarouselView davranışını temsil eder.
• VerticalScrollBarVisibility, türündeki ScrollBarVisibilitydikey kaydırma çubuğunun ne zaman görünür olduğunu belirtir.

Bu özelliklerin tümü nesneler tarafından BindableProperty desteklenir; bu da veri bağlamalarının hedefleri olabileceği anlamına gelir.

CarouselView ayrıca öğeleri görünüme kaydıran iki ScrollTo yöntem tanımlar. Aşırı yüklemelerden biri belirtilen dizindeki öğeyi görünüme kaydırırken, diğeri belirtilen öğeyi görünüme kaydırıyor. Her iki aşırı yükleme, kaydırma tamamlandıktan sonra öğenin tam konumunu ve kaydırmaya animasyon eklenip eklenmeyeceğini belirtmek için belirtilebilen ek bağımsız değişkenlere sahiptir.

CarouselViewyöntemlerinden biri ScrollTo çağrıldığında tetiklenen bir ScrollToRequested olayı tanımlar. Olaya ScrollToRequestedEventArgs eşlik ScrollToRequested eden nesne, , Index, Itemve ScrollToPositiongibi IsAnimatedbirçok özelliğe sahiptir. Bu özellikler, yöntem çağrılarında ScrollTo belirtilen bağımsız değişkenlerden ayarlanır.

Ayrıca, CarouselView kaydırmanın gerçekleştiğini belirtmek için tetiklenen bir Scrolled olayı tanımlar. Olaya ItemsViewScrolledEventArgs eşlik eden nesnenin Scrolled birçok özelliği vardır. Daha fazla bilgi için bkz . Kaydırmayı algılama.

Bir kullanıcı kaydırmayı başlatmak için çekince, öğelerin tam olarak görüntülenmesi için kaydırmanın bitiş konumu denetlenebilir. Kaydırma dururken öğeler konumlandırıldığından bu özellik tutturma olarak bilinir. Daha fazla bilgi için bkz . Tutturma noktaları.

CarouselView kullanıcı kaydırdıkça verileri artımlı olarak da yükleyebilir. Daha fazla bilgi için bkz . Verileri artımlı olarak yükleme.

Kaydırmayı algılama

özelliği IsDragging şu anda öğeleri kaydırıp kaydırmadığını CarouselView belirlemek için incelenebilir.

Ayrıca, CarouselView kaydırmanın gerçekleştiğini belirtmek için tetiklenen bir Scrolled olayı tanımlar. Bu olay, kaydırmayla ilgili veriler gerektiğinde kullanılmalıdır.

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

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

Eşdeğer C# kodu:

CarouselView carouselView = new CarouselView();
carouselView.Scrolled += OnCarouselViewScrolled;

Bu kod örneğinde OnCarouselViewScrolled , olay çalıştırıldığında Scrolled olay işleyicisi yürütülür:

void OnCarouselViewScrolled(object sender, ItemsViewScrolledEventArgs e)
{
    Debug.WriteLine("HorizontalDelta: " + e.HorizontalDelta);
    Debug.WriteLine("VerticalDelta: " + e.VerticalDelta);
    Debug.WriteLine("HorizontalOffset: " + e.HorizontalOffset);
    Debug.WriteLine("VerticalOffset: " + e.VerticalOffset);
    Debug.WriteLine("FirstVisibleItemIndex: " + e.FirstVisibleItemIndex);
    Debug.WriteLine("CenterItemIndex: " + e.CenterItemIndex);
    Debug.WriteLine("LastVisibleItemIndex: " + e.LastVisibleItemIndex);
}

Bu örnekte, OnCarouselViewScrolled olay işleyicisi olaya eşlik eden nesnenin ItemsViewScrolledEventArgs değerlerini verir.

Önemli

Olay Scrolled , kullanıcı tarafından başlatılan kaydırmalar ve programlı kaydırmalar için tetiklenir.

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

İlk ScrollTo yöntem aşırı yüklemesi, belirtilen dizindeki öğeyi görünüme kaydırıyor. adlı carouselViewbir CarouselView nesne verüldüğünde, aşağıdaki örnekte 6. dizindeki öğenin nasıl görünüme kaydırılıp kaydırılamadığ gösterilmektedir:

carouselView.ScrollTo(6);

Not

ScrollToRequested yöntemi çağrıldığında ScrollTo olay tetiklenir.

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

İkinci ScrollTo yöntem aşırı yüklemesi belirtilen öğeyi görünüme kaydırıyor. adlı carouselViewbir CarouselView nesne verüldüğünde, aşağıdaki örnekte Proboscis Monkey öğesinin nasıl görüntüleyebileceğiniz gösterilmektedir:

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

Not

ScrollToRequested yöntemi çağrıldığında ScrollTo olay tetiklenir.

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

içindeki öğeler arasında hareket ederken kaydırma animasyonu CarouselViewgörüntülenir. Bu animasyon hem kullanıcı tarafından başlatılan kaydırmalar hem de programlı kaydırmalar için gerçekleşir. özelliğinin IsScrollAnimated false olarak ayarlanması, her iki kaydırma kategorisi için de animasyonu devre dışı bırakır.

Alternatif olarak, animate programlı kaydırmalarda kaydırma animasyonunu devre dışı bırakmak için yönteminin bağımsız değişkeni ScrollTo olarak ayarlanabilir false :

carouselView.ScrollTo(monkey, animate: false);

Kaydırma konumunu denetleme

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

Görünür Yap

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

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

Bu örnek kod, öğeyi görünüme kaydırmak için gereken en düşük kaydırmayı sağlar.

Not

yöntemi ScrollToPosition.MakeVisible çağrılırken ScrollTo bağımsız değişken belirtilmezseposition, üye varsayılan olarak kullanılır.

Başlangıç

Üye, ScrollToPosition.Start öğenin görünümün başlangıcına kaydırılması gerektiğini belirtir:

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

Bu örnek kod, öğenin görünümün başlangıcına kaydırılmasıyla sonuçlanır.

Orta

Üye, ScrollToPosition.Center öğenin görünümün ortasına kaydırılması gerektiğini belirtir:

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

Bu örnek kod, öğenin görünümün ortasına kaydırılmasıyla sonuçlanır.

End

Üye, ScrollToPosition.End öğenin görünümün sonuna kaydırılması gerektiğini belirtir:

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

Bu örnek kod, öğenin görünümün sonuna kaydırılmasıyla sonuçlanır.

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

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

• KeepItemsInView yeni öğeler eklendiğinde listedeki ilk öğeyi görüntüler.
• KeepScrollOffset yeni öğeler eklendiğinde geçerli kaydırma konumunun korunmasını sağlar.
• KeepLastItemInView yeni öğeler eklendiğinde listedeki son öğenin görüntülenmesini sağlamak için kaydırma uzaklığını ayarlar.

özelliğinin ItemsUpdatingScrollMode varsayılan değeridir KeepItemsInView. Bu nedenle, listedeki ilk öğeye CarouselView yeni öğeler eklendiğinde görüntülenir. Yeni öğeler eklendiğinde listedeki son öğenin görüntülendiğinden ItemsUpdatingScrollMode emin olmak için özelliğini olarak KeepLastItemInViewayarlayın:

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

Eşdeğer C# kodu:

CarouselView carouselView = new CarouselView
{
    ItemsUpdatingScrollMode = ItemsUpdatingScrollMode.KeepLastItemInView
};

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

CarouselView, bağlanabilir özellikler tarafından yedeklenen ve VerticalScrollBarVisibility özelliklerini tanımlarHorizontalScrollBarVisibility. Bu özellikler yatay veya dikey kaydırma çubuğunun ne zaman görünür olduğunu gösteren bir ScrollBarVisibility numaralandırma değeri alır veya ayarlar. Numaralandırma ScrollBarVisibility aşağıdaki üyeleri tanımlar:

• Defaultplatform için varsayılan kaydırma çubuğu davranışını gösterir ve ve VerticalScrollBarVisibility özellikleri için HorizontalScrollBarVisibility varsayılan değerdir.
• 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ünmeyeceklerini gösterir.

Tutturma noktaları

Bir kullanıcı kaydırmayı başlatmak için çekince, öğelerin tam olarak görüntülenmesi için kaydırmanın bitiş konumu denetlenebilir. Bu özellik, kaydırma dururken öğeler konuma uydurduğundan ve sınıfından aşağıdaki özellikler ItemsLayout tarafından denetlendiğinden tutturma olarak bilinir:

• SnapPointsTypetüründe SnapPointsType, kaydırma sırasında tutturma noktalarının davranışını belirtir.
• SnapPointsAlignmentSnapPointsAlignmenttüründe, tutturma noktalarının öğelerle nasıl hizalı olduğunu belirtir.

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

Not

Tutturma gerçekleştiğinde, en az miktarda hareket üreten yönde gerçekleşir.

Tutturma noktaları türü

Numaralandırma SnapPointsType aşağıdaki üyeleri tanımlar:

• None kaydırmanın öğelere uydurmadığını gösterir.
• Mandatory , içeriğin her zaman, hareketsizlik yönü boyunca kaydırmanın doğal olarak duracağı en yakın tutturma noktasına tutturduğunu gösterir.
• MandatorySingle ile aynı davranışı Mandatorygösterir, ancak aynı anda yalnızca bir öğeyi kaydırıyor.

varsayılan olarak bir CarouselViewSnapPointsType üzerinde özelliği olarak ayarlanır SnapPointsType.MandatorySingleve kaydırmanın bir kerede yalnızca bir öğeyi kaydırmasını sağlar.

Aşağıdaki ekran görüntüleri, tutturma özelliğinin kapalı olduğu bir CarouselView ekran görüntüsü gösterir:

Tutturma noktaları hizalama

Numaralandırma SnapPointsAlignment , Centerve End üyelerini tanımlarStart.

Önemli

Özelliğin SnapPointsAlignment değerine yalnızca özelliği olarak MandatorySingleayarlandığında veya değeri dikkate MandatoryedilirSnapPointsType.

Başlangıç

Üye, SnapPointsAlignment.Start tutturma noktalarının öğelerin başındaki kenarla hizalandığını gösterir. Aşağıdaki XAML örneğinde bu numaralandırma üyesinin nasıl ayarlanacağı gösterilmektedir:

<CarouselView ItemsSource="{Binding Monkeys}"
              PeekAreaInsets="100">
    <CarouselView.ItemsLayout>
        <LinearItemsLayout Orientation="Horizontal"
                           SnapPointsType="MandatorySingle"
                           SnapPointsAlignment="Start" />
    </CarouselView.ItemsLayout>
    ...
</CarouselView>

Eşdeğer C# kodu:

CarouselView carouselView = new CarouselView
{
    ItemsLayout = new LinearItemsLayout(ItemsLayoutOrientation.Horizontal)
    {
        SnapPointsType = SnapPointsType.MandatorySingle,
        SnapPointsAlignment = SnapPointsAlignment.Start
    },
    // ...
};

Kullanıcı yatay kaydırmada CarouselViewkaydırma başlatmak için çekince, sol öğe görünümün soluyla hizalanır:

Orta

Üye, SnapPointsAlignment.Center tutturma noktalarının öğelerin merkezine hizalandığını gösterir.

varsayılan olarak bir CarouselViewüzerinde SnapPointsAlignment özelliği olarak Centerayarlanır. Ancak, tamlık için aşağıdaki XAML örneği bu numaralandırma üyesinin nasıl ayarlandığını gösterir:

<CarouselView ItemsSource="{Binding Monkeys}"
              PeekAreaInsets="100">
    <CarouselView.ItemsLayout>
        <LinearItemsLayout Orientation="Horizontal"
                           SnapPointsType="MandatorySingle"
                           SnapPointsAlignment="Center" />
    </CarouselView.ItemsLayout>
    ...
</CarouselView>

Eşdeğer C# kodu:

CarouselView carouselView = new CarouselView
{
    ItemsLayout = new LinearItemsLayout(ItemsLayoutOrientation.Horizontal)
    {
        SnapPointsType = SnapPointsType.MandatorySingle,
        SnapPointsAlignment = SnapPointsAlignment.Center
    },
    // ...
};

Kullanıcı yatay kaydırmada CarouselViewkaydırma başlatmak için çekince, ortadaki öğe görünümün ortasına hizalanır:

End

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

<CarouselView ItemsSource="{Binding Monkeys}"
              PeekAreaInsets="100">
    <CarouselView.ItemsLayout>
        <LinearItemsLayout Orientation="Horizontal"
                           SnapPointsType="MandatorySingle"
                           SnapPointsAlignment="End" />
    </CarouselView.ItemsLayout>
    ...
</CarouselView>

Eşdeğer C# kodu:

CarouselView carouselView = new CarouselView
{
    ItemsLayout = new LinearItemsLayout(ItemsLayoutOrientation.Horizontal)
    {
        SnapPointsType = SnapPointsType.MandatorySingle,
        SnapPointsAlignment = SnapPointsAlignment.End
    },
    // ...
};

Kullanıcı yatay kaydırmada CarouselViewkaydırma başlatmak için çekince, sağ öğe görünümün sağıyla hizalanır.