Przewodnik dewelopera dotyczący interakcji dotykowych

Zaprojektuj aplikację z oczekiwaniami, że dotknięcie będzie podstawową metodą wprowadzania danych wejściowych użytkowników. Jeśli używasz kontrolek WinUI, obsługa touchpadu, myszy i pióra/rysika nie wymaga dodatkowego programowania, ponieważ aplikacje WinUI zapewniają to bezpłatnie.

Należy jednak pamiętać, że interfejs użytkownika zoptymalizowany pod kątem dotyku nie zawsze jest lepszy od tradycyjnego interfejsu użytkownika. Obie zapewniają zalety i wady, które są unikatowe dla technologii i aplikacji. W przejściu do interfejsu użytkownika opartego na dotyku ważne jest, aby zrozumieć podstawowe różnice między dotykiem, touchpadem, piórem/rysikiem, myszą a wpisywaniem z klawiatury.

Ważne interfejsy API: Microsoft.UI.Xaml.Input, Windows.UI.Core, Windows.Devices.Input

Wiele urządzeń ma wielodotykowe ekrany, które obsługują używanie co najmniej jednego palca (lub kontaktów dotykowych) jako danych wejściowych. Kontakty dotykowe i ich ruch są interpretowane jako gesty dotykowe i manipulacje w celu obsługi różnych interakcji użytkownika.

Windows app zawiera szereg różnych mechanizmów obsługi wprowadzania dotykowego, co umożliwia tworzenie immersyjnego środowiska, które użytkownicy mogą z ufnością eksplorować. W tym miejscu omówimy podstawy korzystania z wprowadzania danych dotykowych w Windows app.

Interakcje dotykowe wymagają trzech rzeczy:

• Wyświetlacz z uwzględnieniem dotyku.
• Bezpośredni kontakt (lub bliskość, jeśli wyświetlacz jest wyposażony w czujniki zbliżeniowe i obsługuje wykrywanie zawieszenia) jednego lub większej liczby palców na tym wyświetlaczu.
• Ruch kontaktów dotykowych (lub ich brak w zależności od ustalonego progu czasu).

Dane wejściowe dostarczane przez czujnik dotykowy mogą być następujące:

• Interpretowany jako gest fizyczny do bezpośredniej manipulacji co najmniej jednym elementem interfejsu użytkownika, takim jak przesuwanie, obracanie, zmienianie rozmiaru lub przenoszenie. (Natomiast interakcja z elementem poprzez jego okno właściwości, okno dialogowe lub inny element interfejsu użytkownika jest uważana za pośrednią manipulację.)
• Rozpoznawana jako alternatywna metoda wprowadzania, taka jak mysz lub pióro.
• Służy do uzupełniania lub modyfikowania aspektów innych metod wejściowych, takich jak rozmazywanie kreski atramentowej rysowanej piórem.

Wprowadzanie dotykowe zwykle obejmuje bezpośrednie manipulowanie elementem na ekranie. Element reaguje natychmiast na każdy kontakt dotykowy w obszarze testowym trafienia i reaguje odpowiednio na każdy kolejny ruch kontaktów dotykowych, w tym usunięcie.

Niestandardowe gesty dotykowe i interakcje powinny być starannie zaprojektowane. Powinny one być intuicyjne, dynamiczne i wykrywalne, a użytkownicy powinni mieć pewność eksplorowania aplikacji.

Upewnij się, że funkcje aplikacji są stale uwidaczniane w każdym obsługiwanym typie urządzenia wejściowego. W razie potrzeby użyj jakiejś formy pośredniego trybu wprowadzania, takiego jak wprowadzanie tekstu na potrzeby interakcji z klawiaturą lub dostępność interfejsu użytkownika dla myszy i pióra.

Pamiętaj, że tradycyjne urządzenia wejściowe (takie jak mysz i klawiatura) są znane i atrakcyjne dla wielu użytkowników. Mogą one oferować szybkość, dokładność i dotykową informację zwrotną, której nie może zapewnić dotyk.

Zapewnienie unikatowych i charakterystycznych środowisk interakcji dla wszystkich urządzeń wejściowych będzie obsługiwać najszerszy zakres możliwości i preferencji, odwołać się do najszerszej możliwej grupy odbiorców i przyciągnąć większej liczby klientów do aplikacji.

Porównanie wymagań dotyczących interakcji dotykowych

W poniższej tabeli przedstawiono niektóre różnice między urządzeniami wejściowymi, które należy wziąć pod uwagę podczas projektowania aplikacji systemu Windows zoptymalizowanych pod kątem dotyku.

Korzystanie z opinii dotykowej

Odpowiednie opinie wizualne podczas interakcji z aplikacją pomagają użytkownikom rozpoznawać, uczyć się i dostosowywać się do sposobu interpretowania ich interakcji zarówno przez aplikację, jak i platformę Windows. Opinie wizualne mogą wskazywać na pomyślne interakcje, stan systemu przekazywania, poprawić poczucie kontroli, zmniejszyć błędy, pomóc użytkownikom zrozumieć system i urządzenie wejściowe oraz zachęcić do interakcji.

Informacja zwrotna wizualna ma kluczowe znaczenie, gdy użytkownik korzysta z interfejsu dotykowego do działań wymagających dokładnego i precyzyjnego określenia położenia. Wyświetlaj informację zwrotną zawsze, gdy wykrywane są dane wejściowe dotyku, aby pomóc użytkownikowi zrozumieć wszelkie niestandardowe reguły celowania zdefiniowane przez aplikację i jej kontrolki.

Celowanie

Określanie wartości docelowej jest zoptymalizowane za pomocą:

• Rozmiary obszarów dotyku

  Jasne wytyczne dotyczące rozmiaru zapewniają, że aplikacje mają wygodny interfejs użytkownika, który zawiera obiekty i kontrolki łatwe i bezpieczne do obsługi.

• Geometria kontaktu

  Cały obszar kontaktu palca określa najbardziej prawdopodobny obiekt docelowy.

• Scrubbing

  Elementy w grupie można łatwo ponownie użyć, przeciągając palcem między nimi (na przykład przyciskami radiowymi). Obecny obiekt jest aktywowany po zwolnieniu dotyku.

• Kołysanie

  Gęsto rozmieszczone elementy (na przykład hiperlinki) można łatwo ponownie wycelować, naciskając palcem w dół i bez przesuwania, kołysząc nim tam i z powrotem nad elementami. Z powodu okluzji bieżący element jest identyfikowany za pośrednictwem etykietki narzędzia lub paska stanu i jest aktywowany po zwolnieniu dotyku.

Dokładność

Projektowanie pod kątem niechlujnych interakcji przy użyciu:

• Punkty przyciągania, które mogą ułatwić zatrzymanie się w żądanych lokalizacjach, gdy użytkownicy wchodzą w interakcję z zawartością.
• Kierunkowe "szyny", które mogą pomóc w pionowym lub poziomym przesuwaniu, nawet wtedy, gdy ręka porusza się w lekkim łuku. Aby uzyskać więcej informacji, zobacz Wytyczne dotyczące przesuwania .

Okluzja

Unika się zasłaniania palców i dłoni poprzez:

• Rozmiar i pozycjonowanie interfejsu użytkownika

  Utwórz elementy interfejsu użytkownika wystarczająco duże, aby nie mogły być całkowicie pokryte obszarem styku palca.

  Umieszczaj menu i wyskakujące okienka powyżej obszaru kontaktu, gdy tylko jest to możliwe.

• Tooltips

  Pokaż etykietki narzędzi, gdy użytkownik utrzymuje kontakt palca na obiekcie. Jest to przydatne do opisywania funkcji obiektów. Użytkownik może przesunąć opuszkiem palca na bok obiektu, aby uniknąć wywoływania podpowiedzi.

  W przypadku małych obiektów, przesuń podpowiedzi, aby nie były objęte obszarem kontaktu z palcem. Jest to przydatne w przypadku określania wartości docelowej.

• Uchwyty do precyzyjnej pracy

  Jeśli wymagana jest precyzja (na przykład zaznaczenie tekstu), podaj uchwyty zaznaczenia, które są przesunięte w celu zwiększenia dokładności. Aby uzyskać więcej informacji, zobacz Wytyczne dotyczące wybierania tekstu i obrazów (aplikacje środowisko wykonawcze systemu Windows).

Czas

Unikaj zmian trybu czasowego na rzecz bezpośredniej manipulacji. Bezpośrednie manipulowanie symuluje bezpośrednią, fizyczną obsługę obiektu w czasie rzeczywistym. Obiekt reaguje, gdy palce są przenoszone.

Natomiast interakcja czasowa następuje po interakcji dotykowej. Interakcje z czasem zwykle zależą od niewidocznych progów, takich jak czas, odległość lub szybkość, aby określić, jakie polecenie należy wykonać. Czasowe interakcje nie dają wizualnego sprzężenia zwrotnego, dopóki system nie wykona akcji.

Bezpośrednie manipulowanie zapewnia wiele korzyści w porównaniu z interakcjami czasowymi.

• Błyskawiczne informacje zwrotne wizualne podczas interakcji sprawiają, że użytkownicy czują się bardziej zaangażowani, pewniejsi siebie i mają kontrolę.
• Bezpośrednie manipulacje sprawiają, że bezpieczniejsze jest eksplorowanie systemu, ponieważ są one odwracalne — użytkownicy mogą łatwo przechodzić wstecz przez swoje działania w logiczny i intuicyjny sposób.
• Interakcje, które bezpośrednio wpływają na obiekty i naśladują interakcje w świecie rzeczywistym, są bardziej intuicyjne, wykrywalne i pamiętne. Nie polegają na niejasnych ani abstrakcyjnych interakcjach.
• Interakcje czasowe mogą być trudne do przeprowadzenia, ponieważ użytkownicy muszą osiągnąć przypadkowe i niewidoczne progi.

Ponadto zdecydowanie zalecane są następujące elementy:

• Manipulacje nie powinny być rozróżniane przez liczbę używanych palców.
• Interakcje powinny obsługiwać manipulacje złożone. Na przykład zbliżenie dwoma palcami w celu powiększenia obrazu podczas przesuwania nimi po ekranie.
• Interakcje nie powinny być rozróżniane według czasu. Ta sama interakcja powinna mieć taki sam wynik niezależnie od czasu potrzebnego do jego wykonania. Aktywacje oparte na czasie wprowadzają obowiązkowe opóźnienia dla użytkowników i uniemożliwiają zarówno immersywny charakter bezpośredniej manipulacji oraz postrzeganie reakcji systemu.

  Uwaga / Notatka

  Wyjątkiem jest użycie określonych interakcji czasowych w celu ułatwienia nauki i eksploracji (na przykład naciśnięcia i blokady).

• Odpowiednie opisy i wskazówki wizualne mają duży wpływ na korzystanie z zaawansowanych interakcji.

Widoki aplikacji

Dostosuj środowisko interakcji użytkownika za pomocą ustawień przesuwania/przewijania i powiększania widoków aplikacji. Widok aplikacji określa, w jaki sposób użytkownik uzyskuje dostęp do aplikacji i jej zawartości oraz manipuluje nią. Widoki zapewniają również zachowania, takie jak inercja, odbicie granic zawartości i punkty przyciągania.

Ustawienia przesuwania i skrolowania kontrolki ScrollViewer określają sposób, w jaki użytkownicy nawigują w jednym widoku, gdy treść nie mieści się w polu widoku. Pojedynczy widok może być na przykład stroną magazynu lub książki, strukturą folderów komputera, biblioteką dokumentów lub albumem fotograficznym.

Ustawienia powiększenia mają zastosowanie zarówno do powiększania optycznego (obsługiwanego przez kontrolkę ScrollViewer ) jak i kontrolki Semantic Zoom . Semantyczny zoom to technika zoptymalizowana pod kątem dotyku do prezentowania i nawigowania po dużych zestawach powiązanych danych lub zawartości w jednym widoku. Działa przy użyciu dwóch odrębnych trybów klasyfikacji lub poziomów powiększenia. Jest to analogiczne do przesuwania i przewijania w jednym widoku. Przesuwanie i przewijanie można używać w połączeniu z powiększeniem semantycznym.

Użyj widoków aplikacji i zdarzeń, aby zmodyfikować zachowania przesuwania/przewijania i powiększania. Może to zapewnić płynniejsze doświadczenie interakcji niż to, co jest możliwe dzięki obsłudze zdarzeń wskaźnika i gestów.

Aby uzyskać więcej informacji na temat widoków aplikacji, zobacz Kontrolki, układy i tekst.

Niestandardowe interakcje dotykowe

Jeśli implementujesz własną obsługę interakcji, pamiętaj, że użytkownicy oczekują intuicyjnego środowiska obejmującego bezpośrednią interakcję z elementami interfejsu użytkownika w aplikacji. Zalecamy modelowanie niestandardowych interakcji w bibliotekach kontrolek platformy, aby zachować spójność i możliwość odnajdywania elementów. Kontrolki w tych bibliotekach zapewniają pełne doświadczenie interakcji użytkownika, w tym standardowe interakcje, animowane efekty fizyczne, wizualną informację zwrotną i ułatwienia dostępu. Tworzenie interakcji niestandardowych tylko wtedy, gdy istnieje jasne, dobrze zdefiniowane wymaganie i podstawowe interakcje nie obsługują twojego scenariusza.

Aby zapewnić niestandardową obsługę dotykową, można obsługiwać różne zdarzenia UIElement. Te zdarzenia są pogrupowane w trzy poziomy abstrakcji.

• Zdarzenia gestów statycznych są wyzwalane po zakończeniu interakcji. Zdarzenia gestów obejmują Dotknięcie, Podwójne Dotknięcie, Dotknięcie prawym przyciskiemi Przytrzymanie.

  Zdarzenia gestów dla określonych elementów można wyłączyć, ustawiając IsTapEnabled, IsDoubleTapEnabled, IsRightTapEnabled, i IsHoldingEnabled na false.

• Zdarzenia wskaźnika, takie jak PointerPressed i WskaźnikPrzesunięty zapewniają szczegóły niskiego poziomu dla każdego kontaktu dotykowego, w tym ruch wskaźnika i możliwość rozróżniania zdarzeń naciśnięcia i zwolnienia.

  Wskaźnik to ogólny typ danych wejściowych z ujednoliconym mechanizmem zdarzeń. Udostępnia podstawowe informacje, takie jak położenie ekranu, na aktywnym źródle wejściowym, które mogą być dotykowe, touchpad, mysz lub pióro.

• Zdarzenia gestów manipulowania, takie jak ManipulationStarted, wskazują trwającą interakcję. Zaczynają działać, gdy użytkownik dotyka elementu i kontynuują, aż użytkownik podniesie palec/palce lub manipulacja zostanie anulowana.

  Zdarzenia manipulowania obejmują interakcje wielodotykowe, takie jak powiększanie, przesuwanie lub obracanie oraz interakcje, które używają danych inercji i prędkości, takich jak przeciąganie. Informacje udostępniane przez zdarzenia manipulacji nie identyfikują formy interakcji, która została wykonana, ale zawierają dane, takie jak położenie, delta tłumaczenia i szybkość. Możesz użyć tych danych dotykowych, aby określić typ interakcji, które mają być wykonywane.

Oto podstawowy zestaw gestów dotykowych obsługiwanych przez interfejs WinUI.

Wydarzenia związane z gestami

Aby uzyskać szczegółowe informacje na temat poszczególnych kontrolek, zobacz Lista kontrolek.

Zdarzenia wskaźnika

Zdarzenia wskaźnika są wywoływane przez różne aktywne źródła danych wejściowych, w tym dotyk, touchpad, pióro i mysz (zastępują tradycyjne zdarzenia myszy).

Zdarzenia wskaźnika są oparte na pojedynczym punkcie wejściowym (palec, końcówka pióra, kursor myszy) i nie obsługują interakcji zależnych od szybkości.

Oto lista zdarzeń wskaźnika oraz ich powiązanych argumentów zdarzeń.

W poniższym przykładzie pokazano, jak używać zdarzeń PointerPressed, PointerReleasedi PointerExited do obsługi interakcji stuknięcia w obiekt Prostokąt .

Najpierw prostokąt o nazwie touchRectangle zostaje utworzony w języku XAML (Extensible Application Markup Language).

<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
    <Rectangle Name="touchRectangle"
           Height="100" Width="200" Fill="Blue" />
</Grid>

Następnie określeni są odbiorniki zdarzeń: PointerPressed, PointerReleasedoraz PointerExited.

MainPage::MainPage()
{
    InitializeComponent();

    // Pointer event listeners.
    touchRectangle->PointerPressed += ref new PointerEventHandler(this, &MainPage::touchRectangle_PointerPressed);
    touchRectangle->PointerReleased += ref new PointerEventHandler(this, &MainPage::touchRectangle_PointerReleased);
    touchRectangle->PointerExited += ref new PointerEventHandler(this, &MainPage::touchRectangle_PointerExited);
}

public MainPage()
{
    this.InitializeComponent();

    // Pointer event listeners.
    touchRectangle.PointerPressed += touchRectangle_PointerPressed;
    touchRectangle.PointerReleased += touchRectangle_PointerReleased;
    touchRectangle.PointerExited += touchRectangle_PointerExited;
}

Public Sub New()

    ' This call is required by the designer.
    InitializeComponent()

    ' Pointer event listeners.
    AddHandler touchRectangle.PointerPressed, AddressOf touchRectangle_PointerPressed
    AddHandler touchRectangle.PointerReleased, AddressOf Me.touchRectangle_PointerReleased
    AddHandler touchRectangle.PointerExited, AddressOf touchRectangle_PointerExited

End Sub

Na koniec program obsługi zdarzeń PointerPressed zwiększa wysokość i szerokości prostokąta , podczas gdy programy obsługi zdarzeń PointerReleased i PointerExited ustawiają Height i Width z powrotem do ich wartości początkowych.

// Handler for pointer exited event.
void MainPage::touchRectangle_PointerExited(Object^ sender, PointerRoutedEventArgs^ e)
{
    Rectangle^ rect = (Rectangle^)sender;

    // Pointer moved outside Rectangle hit test area.
    // Reset the dimensions of the Rectangle.
    if (nullptr != rect)
    {
        rect->Width = 200;
        rect->Height = 100;
    }
}

// Handler for pointer released event.
void MainPage::touchRectangle_PointerReleased(Object^ sender, PointerRoutedEventArgs^ e)
{
    Rectangle^ rect = (Rectangle^)sender;

    // Reset the dimensions of the Rectangle.
    if (nullptr != rect)
    {
        rect->Width = 200;
        rect->Height = 100;
    }
}

// Handler for pointer pressed event.
void MainPage::touchRectangle_PointerPressed(Object^ sender, PointerRoutedEventArgs^ e)
{
    Rectangle^ rect = (Rectangle^)sender;

    // Change the dimensions of the Rectangle.
    if (nullptr != rect)
    {
        rect->Width = 250;
        rect->Height = 150;
    }
}

// Handler for pointer exited event.
private void touchRectangle_PointerExited(object sender, PointerRoutedEventArgs e)
{
    Rectangle rect = sender as Rectangle;

    // Pointer moved outside Rectangle hit test area.
    // Reset the dimensions of the Rectangle.
    if (null != rect)
    {
        rect.Width = 200;
        rect.Height = 100;
    }
}
// Handler for pointer released event.
private void touchRectangle_PointerReleased(object sender, PointerRoutedEventArgs e)
{
    Rectangle rect = sender as Rectangle;

    // Reset the dimensions of the Rectangle.
    if (null != rect)
    {
        rect.Width = 200;
        rect.Height = 100;
    }
}

// Handler for pointer pressed event.
private void touchRectangle_PointerPressed(object sender, PointerRoutedEventArgs e)
{
    Rectangle rect = sender as Rectangle;

    // Change the dimensions of the Rectangle.
    if (null != rect)
    {
        rect.Width = 250;
        rect.Height = 150;
    }
}

' Handler for pointer exited event.
Private Sub touchRectangle_PointerExited(sender As Object, e As PointerRoutedEventArgs)
    Dim rect As Rectangle = CType(sender, Rectangle)

    ' Pointer moved outside Rectangle hit test area.
    ' Reset the dimensions of the Rectangle.
    If (rect IsNot Nothing) Then
        rect.Width = 200
        rect.Height = 100
    End If
End Sub

' Handler for pointer released event.
Private Sub touchRectangle_PointerReleased(sender As Object, e As PointerRoutedEventArgs)
    Dim rect As Rectangle = CType(sender, Rectangle)

    ' Reset the dimensions of the Rectangle.
    If (rect IsNot Nothing) Then
        rect.Width = 200
        rect.Height = 100
    End If
End Sub

' Handler for pointer pressed event.
Private Sub touchRectangle_PointerPressed(sender As Object, e As PointerRoutedEventArgs)
    Dim rect As Rectangle = CType(sender, Rectangle)

    ' Change the dimensions of the Rectangle.
    If (rect IsNot Nothing) Then
        rect.Width = 250
        rect.Height = 150
    End If
End Sub

Zdarzenia manipulowania

Użyj zdarzeń manipulowania w aplikacji, jeśli musisz obsługiwać wiele interakcji palców lub interakcji, które wymagają danych prędkości.

Zdarzenia manipulowania umożliwiają wykrywanie interakcji, takich jak przeciąganie, powiększanie i trzymanie.

Oto lista zdarzeń manipulowania i powiązanych argumentów zdarzeń.

Gest składa się z serii zdarzeń manipulowania. Każdy gest rozpoczyna się od zdarzenia ManipulationStarted, na przykład wtedy, gdy użytkownik dotyka ekranu.

Następnie zostanie wyzwolony co najmniej jeden ManipulationDelta zdarzenia. Jeśli na przykład dotykasz ekranu, a następnie przeciągasz palcem po ekranie. Na koniec, gdy interakcja zostanie zakończona, zgłoszone zostanie zdarzenie ManipulationCompleted.

W poniższym przykładzie pokazano, jak za pomocą zdarzeń ManipulationDelta obsługiwać interakcję slajdu na prostokąta i przenosić je na ekranie.

Najpierw w języku XAML tworzony jest Prostokąt o nazwie touchRectangle z wysokością i szerokością 200.

<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
    <Rectangle Name="touchRectangle"
               Width="200" Height="200" Fill="Blue" 
               ManipulationMode="All"/>
</Grid>

Następnie zostanie utworzona globalna TranslateTransform o nazwie do tłumaczeniaprostokąta . Odbiornik zdarzeń ManipulationDelta jest określony naprostokąta , a jest dodawany do RenderTransformprostokąta .

// Global translation transform used for changing the position of 
// the Rectangle based on input data from the touch contact.
Windows::UI::Xaml::Media::TranslateTransform^ dragTranslation;

// Global translation transform used for changing the position of 
// the Rectangle based on input data from the touch contact.
private TranslateTransform dragTranslation;

' Global translation transform used for changing the position of 
' the Rectangle based on input data from the touch contact.
Private dragTranslation As TranslateTransform

MainPage::MainPage()
{
    InitializeComponent();

    // Listener for the ManipulationDelta event.
    touchRectangle->ManipulationDelta += 
        ref new ManipulationDeltaEventHandler(
            this, 
            &MainPage::touchRectangle_ManipulationDelta);
    // New translation transform populated in 
    // the ManipulationDelta handler.
    dragTranslation = ref new TranslateTransform();
    // Apply the translation to the Rectangle.
    touchRectangle->RenderTransform = dragTranslation;
}

public MainPage()
{
    this.InitializeComponent();

    // Listener for the ManipulationDelta event.
    touchRectangle.ManipulationDelta += touchRectangle_ManipulationDelta;
    // New translation transform populated in 
    // the ManipulationDelta handler.
    dragTranslation = new TranslateTransform();
    // Apply the translation to the Rectangle.
    touchRectangle.RenderTransform = this.dragTranslation;
}

Public Sub New()

    ' This call is required by the designer.
    InitializeComponent()

    ' Listener for the ManipulationDelta event.
    AddHandler touchRectangle.ManipulationDelta,
        AddressOf testRectangle_ManipulationDelta
    ' New translation transform populated in 
    ' the ManipulationDelta handler.
    dragTranslation = New TranslateTransform()
    ' Apply the translation to the Rectangle.
    touchRectangle.RenderTransform = dragTranslation

End Sub

Na koniec w procedurze obsługi zdarzeń ManipulationDelta pozycja Prostokąt jest aktualizowana, używając TranslateTransform na właściwości Delta.

// Handler for the ManipulationDelta event.
// ManipulationDelta data is loaded into the
// translation transform and applied to the Rectangle.
void MainPage::touchRectangle_ManipulationDelta(Object^ sender,
    ManipulationDeltaRoutedEventArgs^ e)
{
    // Move the rectangle.
    dragTranslation->X += e->Delta.Translation.X;
    dragTranslation->Y += e->Delta.Translation.Y;
    
}

// Handler for the ManipulationDelta event.
// ManipulationDelta data is loaded into the
// translation transform and applied to the Rectangle.
void touchRectangle_ManipulationDelta(object sender,
    ManipulationDeltaRoutedEventArgs e)
{
    // Move the rectangle.
    dragTranslation.X += e.Delta.Translation.X;
    dragTranslation.Y += e.Delta.Translation.Y;
}

' Handler for the ManipulationDelta event.
' ManipulationDelta data Is loaded into the
' translation transform And applied to the Rectangle.
Private Sub testRectangle_ManipulationDelta(
    sender As Object,
    e As ManipulationDeltaRoutedEventArgs)

    ' Move the rectangle.
    dragTranslation.X = (dragTranslation.X + e.Delta.Translation.X)
    dragTranslation.Y = (dragTranslation.Y + e.Delta.Translation.Y)

End Sub

Zdarzenia trasowane

Wszystkie zdarzenia wskaźnika, zdarzenia gestów i zdarzenia manipulacji wymienione tutaj są implementowane jako zdarzenia routowane. Oznacza to, że zdarzenie może być potencjalnie obsługiwane przez obiekty inne niż ten, który pierwotnie je wywołał. Kolejni rodzice w drzewie obiektów, tacy jak kontenery nadrzędne elementu interfejsu użytkownika lub główna strona aplikacji, mogą wybrać przetwarzanie tych zdarzeń, nawet jeśli oryginalny element ich nie obsługuje. Z drugiej strony każdy obiekt, który obsługuje zdarzenie, może oznakować zdarzenie jako obsłużone, aby nie dotarło już do żadnego elementu nadrzędnego. Aby uzyskać więcej informacji na temat koncepcji zdarzenia kierowanego i jego wpływu na sposób pisania procedur obsługi kierowanych zdarzeń, zobacz Zdarzenia i zdarzenia kierowane — omówienie.

Zalecenia i zakazy

• Projektowanie aplikacji z interakcją dotykową jako podstawowej oczekiwanej metody wejściowej.
• Zapewnij wizualną informację zwrotną dla wszystkich typów interakcji (dotyk, pióro, rysik, mysz itp.)
• Optymalizacja celowania przez dostosowanie rozmiaru celu dotykowego, geometrii kontaktu, przewijania i kołysania.
• Optymalizuj dokładność dzięki użyciu punktów przyciągania i kierunkowych "prowadnic".
• Dostarcz podpowiedzi i kontrolki, aby zwiększyć dokładność dotyku dla gęsto rozmieszczonych elementów interfejsu użytkownika.
• Nie używaj interakcji czasowych, kiedy to możliwe (przykład odpowiedniego użycia: dotyk i przytrzymanie).
• Nie używaj liczby palców używanych do rozróżniania manipulacji, gdy jest to możliwe.

Powiązane artykuły

• Obsługa danych wejściowych wskaźnika
• Identyfikowanie urządzeń wejściowych

Samples

• Podstawowy przykład danych wejściowych
• Przykład danych wejściowych o niskiej latencji
• Przykładowy tryb interakcji użytkownika
• przykład wizualizacji Focus

Archiwalne przykłady

• Input: przykład możliwości urządzeń
• Input: przykładowe zdarzenia wejściowe użytkownika w XAML
• Przykładowe przewijanie, przesuwanie i powiększanie XAML
• Input: Gesty i manipulacje za pomocą GestureRecognizer