Aracılığıyla paylaş

Çekme hareketi tanıyıcısı ekleme

  • Makale

Parmağınız ekranda yatay veya dikey yönde taşındığında ve genellikle içerikte gezinmeyi başlatmak için kullanıldığında çekme hareketi gerçekleşir.

View Çekme hareketini tanımak için bir SwipeGestureRecognizer örnek oluşturun, özelliği bir SwipeDirection numaralandırma değerine (Left, Right, Upveya Down) ayarlayınDirection, isteğe bağlı olarak özelliği ayarlayınThreshold, olayı işleyin Swiped ve görünümdeki koleksiyona yeni hareket tanıyıcısını GestureRecognizers ekleyin. Aşağıdaki kod örneği, öğesine eklenmiş bir SwipeGestureRecognizerBoxViewöğesini gösterir:

<BoxView Color="Teal" ...>
    <BoxView.GestureRecognizers>
        <SwipeGestureRecognizer Direction="Left" Swiped="OnSwiped"/>
    </BoxView.GestureRecognizers>
</BoxView>

Eşdeğer C# kodu aşağıdadır:

var boxView = new BoxView { Color = Color.Teal, ... };
var leftSwipeGesture = new SwipeGestureRecognizer { Direction = SwipeDirection.Left };
leftSwipeGesture.Swiped += OnSwiped;

boxView.GestureRecognizers.Add(leftSwipeGesture);

sınıfıSwipeGestureRecognizer, isteğe bağlı olarak cihazdan bağımsız birimlerde bir çekmenin tanınması için ulaşılması gereken en düşük çekme uzaklığı temsil eden bir uint değere ayarlanabilen bir özellik de içerirThreshold. Bu özelliğin varsayılan değeri 100'dür, yani cihazdan bağımsız 100 birimden küçük tüm çekme işlemleri yoksayılır.

Çekme yönünü tanıma

Yukarıdaki örneklerde özelliği, Direction numaralandırmadan SwipeDirection tek bir değere ayarlanmıştır. Ancak, bu özelliği numaralandırmadan SwipeDirection birden çok değere ayarlamak da mümkündür, böylece Swiped olay birden fazla yöndeki bir çekme işlemine yanıt olarak tetiklenir. Ancak kısıtlama, tek SwipeGestureRecognizer bir tekin yalnızca aynı eksende gerçekleşen çekmeleri tanıyabilmesidir. Bu nedenle, yatay eksende gerçekleşen çekme işlemleri özelliği Left ve Rightolarak ayarlanarak tanınabilirDirection:

<SwipeGestureRecognizer Direction="Left,Right" Swiped="OnSwiped"/>

Benzer şekilde, dikey eksende gerçekleşen çekme işlemleri, özelliği Up ve Downolarak ayarlanarak tanınabilirDirection:

var swipeGesture = new SwipeGestureRecognizer { Direction = SwipeDirection.Up | SwipeDirection.Down };

Alternatif olarak, her yöndeki çekmeleri tanımak için her çekme yönü için bir SwipeGestureRecognizer oluşturulabilir:

<BoxView Color="Teal" ...>
    <BoxView.GestureRecognizers>
        <SwipeGestureRecognizer Direction="Left" Swiped="OnSwiped"/>
        <SwipeGestureRecognizer Direction="Right" Swiped="OnSwiped"/>
        <SwipeGestureRecognizer Direction="Up" Swiped="OnSwiped"/>
        <SwipeGestureRecognizer Direction="Down" Swiped="OnSwiped"/>
    </BoxView.GestureRecognizers>
</BoxView>

Eşdeğer C# kodu aşağıdadır:

var boxView = new BoxView { Color = Color.Teal, ... };
var leftSwipeGesture = new SwipeGestureRecognizer { Direction = SwipeDirection.Left };
leftSwipeGesture.Swiped += OnSwiped;
var rightSwipeGesture = new SwipeGestureRecognizer { Direction = SwipeDirection.Right };
rightSwipeGesture.Swiped += OnSwiped;
var upSwipeGesture = new SwipeGestureRecognizer { Direction = SwipeDirection.Up };
upSwipeGesture.Swiped += OnSwiped;
var downSwipeGesture = new SwipeGestureRecognizer { Direction = SwipeDirection.Down };
downSwipeGesture.Swiped += OnSwiped;

boxView.GestureRecognizers.Add(leftSwipeGesture);
boxView.GestureRecognizers.Add(rightSwipeGesture);
boxView.GestureRecognizers.Add(upSwipeGesture);
boxView.GestureRecognizers.Add(downSwipeGesture);

Not

Yukarıdaki örneklerde, aynı olay işleyicisi olay tetiklemesine Swiped yanıt verir. Ancak, gerekirse her SwipeGestureRecognizer örnek farklı bir olay işleyicisi kullanabilir.

Çekme işlemini yanıtlama

Olay için Swiped bir olay işleyicisi aşağıdaki örnekte gösterilmiştir:

void OnSwiped(object sender, SwipedEventArgs e)
{
    switch (e.Direction)
    {
        case SwipeDirection.Left:
            // Handle the swipe
            break;
        case SwipeDirection.Right:
            // Handle the swipe
            break;
        case SwipeDirection.Up:
            // Handle the swipe
            break;
        case SwipeDirection.Down:
            // Handle the swipe
            break;
    }
}

, SwipedEventArgs çekme işleminin yönünü belirlemek için incelenebilir ve özel mantık çekme işlemini gerektiği gibi yanıtlar. Çekme işleminin yönü, numaralandırmanın Direction değerlerinden birine ayarlanacak olan olay bağımsız değişkenlerinin SwipeDirection özelliğinden alınabilir. Buna ek olarak, olay bağımsız değişkenlerinin de tanımlanmışsa özelliğin CommandParameter değerine ayarlanacak bir Parameter özelliği vardır.

Komutları kullanma

sınıfı ve SwipeGestureRecognizer özelliklerini de içerir CommandParameterCommand. Bu özellikler genellikle Model-View-ViewModel (MVVM) desenini kullanan uygulamalarda kullanılır. Command özelliği, bir çekme hareketi tanındığında çağrılacak öğesini tanımlar ICommand ve CommandParameter özelliği, bir nesne tanımlayarak bu özelliğin ICommand. görünümü modelinde tanımlanan ve örneği sayfa BindingContextolarak ayarlanmış olan bir ICommand nesnenin nasıl bağlanacağını Command gösterir:

var boxView = new BoxView { Color = Color.Teal, ... };
var leftSwipeGesture = new SwipeGestureRecognizer { Direction = SwipeDirection.Left, CommandParameter = "Left" };
leftSwipeGesture.SetBinding(SwipeGestureRecognizer.CommandProperty, "SwipeCommand");
boxView.GestureRecognizers.Add(leftSwipeGesture);

Eşdeğer XAML kodu:

<BoxView Color="Teal" ...>
    <BoxView.GestureRecognizers>
        <SwipeGestureRecognizer Direction="Left" Command="{Binding SwipeCommand}" CommandParameter="Left" />
    </BoxView.GestureRecognizers>
</BoxView>

SwipeCommand, görünüm modeli örneğinde tanımlanan ve sayfası BindingContextolarak ayarlanan türünde ICommand bir özelliktir. Çekme hareketi tanındığında Execute , nesnenin SwipeCommand yöntemi yürütülür. yönteminin Execute bağımsız değişkeni özelliğin CommandParameter değeridir. Komutlar hakkında daha fazla bilgi için bkz . Komut Arabirimi.

Çekme kapsayıcısı oluşturma

SwipeContainer Aşağıdaki kod örneğinde gösterilen sınıfı, çekme hareketi tanıma gerçekleştirmek için çevresinde sarmalanan genelleştirilmiş bir View çekme tanıma sınıfıdır:

public class SwipeContainer : ContentView
{
    public event EventHandler<SwipedEventArgs> Swipe;

    public SwipeContainer()
    {
        GestureRecognizers.Add(GetSwipeGestureRecognizer(SwipeDirection.Left));
        GestureRecognizers.Add(GetSwipeGestureRecognizer(SwipeDirection.Right));
        GestureRecognizers.Add(GetSwipeGestureRecognizer(SwipeDirection.Up));
        GestureRecognizers.Add(GetSwipeGestureRecognizer(SwipeDirection.Down));
    }

    SwipeGestureRecognizer GetSwipeGestureRecognizer(SwipeDirection direction)
    {
        var swipe = new SwipeGestureRecognizer { Direction = direction };
        swipe.Swiped += (sender, e) => Swipe?.Invoke(this, e);
        return swipe;
    }
}

sınıfı SwipeContainer , dört çekme yönü için de nesneler oluşturur SwipeGestureRecognizer ve olay işleyicileri ekler Swipe . Bu olay işleyicileri tarafından SwipeContainertanımlanan olayı çağırırSwipe.

Aşağıdaki XAML kodu örneği, sınıfını SwipeContainer sarmalama işlemini BoxViewgösterir:

<ContentPage ...>
    <StackLayout>
        <local:SwipeContainer Swipe="OnSwiped" ...>
            <BoxView Color="Teal" ... />
        </local:SwipeContainer>
    </StackLayout>
</ContentPage>

Aşağıdaki kod örneği, C# sayfasına nasıl kaydırılır SwipeContainerBoxView gösterir:

public class SwipeContainerPageCS : ContentPage
{
    public SwipeContainerPageCS()
    {
        var boxView = new BoxView { Color = Color.Teal, ... };
        var swipeContainer = new SwipeContainer { Content = boxView, ... };
        swipeContainer.Swipe += (sender, e) =>
        {
          // Handle the swipe
        };

        Content = new StackLayout
        {
            Children = { swipeContainer }
        };
    }
}

BoxView bir çekme hareketi aldığında içindeki Swiped olay SwipeGestureRecognizer tetiklenir. Bu, kendi Swipe olayını tetikleyen sınıfı tarafından SwipeContainer işlenir. Bu Swipe olay sayfada işlenir. SwipedEventArgs Daha sonra, çekme işleminin yönünü belirlemek için özel mantık çekme işlemini gerektiği gibi yanıtlayarak incelenebilir.