Share via

탭 제스처 인식

  • 아티클

.NET 다중 플랫폼 앱 UI(.NET MAUI) 탭 제스처 인식기는 탭 검색에 사용되며 클래스와 함께 TapGestureRecognizer 구현됩니다. 이 클래스는 다음과 같은 속성을 정의합니다.

  • Buttons기본 또는 보조 마우스 단추 또는 둘 다를 정의하는 형식 ButtonsMask은 Android, Mac Catalyst 및 Windows에서 제스처를 트리거합니다. 자세한 내용은 단추 마스크 정의를 참조 하세요.
  • Command탭이 인식될 때 실행되는 형식 ICommand의 입니다.
  • object 형식의 CommandParameter - Command에 전달되는 매개 변수입니다.
  • NumberOfTapsRequired- 탭 제스처를 인식하는 데 필요한 탭 수를 나타내는 형식 int입니다. 이 속성의 기본값은 1입니다.

이러한 속성은 BindableProperty 개체에서 지원하며, 따라서 데이터 바인딩의 대상이 될 수 있고 스타일이 지정될 수 있습니다.

또한 이 클래스는 TapGestureRecognizer 탭이 인식될 때 발생하는 이벤트를 정의 Tapped 합니다. 이벤트와 Tapped 함께 제공되는 개체는 TappedEventArgs 정의된 경우 속성에서 전달된 값을 나타내는 형식 object 의 CommandParameter 속성을 정의 Parameter 합니다. 또한 개체는 TappedEventArgs 속성 및 메서드를 GetPosition 정의합니다Buttons. 속성은 Buttons 형식 ButtonsMask이며 기본 또는 보조 마우스 단추가 Android, Mac Catalyst 및 Windows에서 제스처 인식기를 트리거했는지 여부를 확인하는 데 사용할 수 있습니다. 이 메서드는 GetPosition 탭 제스처가 검색된 위치를 나타내는 개체를 반환 Point? 합니다. 단추 마스크에 대한 자세한 내용은 단추 마스크 정의를 참조하세요. 메서드에 대한 GetPosition 자세한 내용은 제스처 위치 가져오기를 참조하세요.

Warning

A TapGestureRecognizer 는 Windows에서 두 번 이상의 탭을 인식할 수 없습니다.

TapGestureRecognizer 만들기

탭 제스처를 View 인식하려면 개체를 TapGestureRecognizer 만들고, 이벤트를 처리 Tapped 하고, 보기의 컬렉션에 새 제스처 인식기를 GestureRecognizers 추가합니다. 다음 코드 예제에서는 다음 코드에 TapGestureRecognizer 연결된 항목을 보여줍니다.Image

<Image Source="dotnet_bot.png">
    <Image.GestureRecognizers>
        <TapGestureRecognizer Tapped="OnTapGestureRecognizerTapped"
                              NumberOfTapsRequired="2" />
  </Image.GestureRecognizers>
</Image>

이벤트 처리기의 코드를 OnTapGestureRecognizerTapped 코드 숨김 파일에 추가해야 합니다.

void OnTapGestureRecognizerTapped(object sender, TappedEventArgs args)
{
    // Handle the tap
}

해당하는 C# 코드는 다음과 같습니다.

TapGestureRecognizer tapGestureRecognizer = new TapGestureRecognizer();
tapGestureRecognizer.Tapped += (s, e) =>
{
    // Handle the tap
};
Image image = new Image();
image.GestureRecognizers.Add(tapGestureRecognizer);

기본적으로 단일 Image 탭에 응답합니다. 속성이 NumberOfTapsRequired 1보다 크도록 설정되면 설정된 기간 내에 탭이 발생하는 경우에만 이벤트 처리기가 실행됩니다. 두 번째(또는 후속) 탭이 해당 기간 내에 발생하지 않으면 효과적으로 무시됩니다.

단추 마스크 정의

TapGestureRecognizer 개체에는 Buttons 기본 또는 보조 마우스 단추 또는 둘 다에서 Android, Mac Catalyst 및 Windows에서 제스처를 트리거하는지 여부를 정의하는 형식ButtonsMask의 속성이 있습니다. ButtonsMask 열거형은 다음 멤버를 정의합니다.

  • Primary 는 일반적으로 마우스 왼쪽 단추인 기본 마우스 단추를 나타냅니다.
  • Secondary 는 일반적으로 오른쪽 마우스 단추인 보조 마우스 단추를 나타냅니다.

다음 예제에서는 보조 마우스 단추를 사용하여 탭을 감지하는 방법을 보여 TapGestureRecognizer 줍니다.

<Image Source="dotnet_bot.png">
    <Image.GestureRecognizers>
        <TapGestureRecognizer Tapped="OnTapGestureRecognizerTapped"
                              Buttons="Secondary" />
  </Image.GestureRecognizers>
</Image>

이벤트에 대한 이벤트 처리기는 제스처를 Tapped 트리거한 단추를 확인할 수 있습니다.

void OnTapGestureRecognizerTapped(object sender, TappedEventArgs args)
{
    // Handle the tap
    if (args.Buttons == ButtonsMask.Secondary)
    {
        // Do something
    }
}

해당하는 C# 코드는 다음과 같습니다.

TapGestureRecognizer tapGestureRecognizer = new TapGestureRecognizer
{
    Buttons = ButtonsMask.Secondary
};
tapGestureRecognizer.Tapped += (s, e) =>
{
    // Handle the tap
    if (args.Buttons == ButtonsMask.Secondary)
    {
        // Do something
    }
};
Image image = new Image();
image.GestureRecognizers.Add(tapGestureRecognizer);

Warning

Windows에서는 TapGestureRecognizer 속성이 1보다 클 때 속성을 Secondary 존중 NumberOfTapsRequired 하지 않도록 설정하는 Buttons 속성입니다.

또한 TapGestureRecognizer 기본 또는 보조 마우스 단추가 제스처를 트리거할 수 있도록 정의할 수 있습니다.

<TapGestureRecognizer Tapped="OnTapGestureRecognizerTapped"
                      Buttons="Primary,Secondary" />

해당하는 C# 코드는 다음과 같습니다.

TapGestureRecognizer tapGestureRecognizer = new TapGestureRecognizer
{
    Buttons = ButtonsMask.Primary | ButtonsMask.Secondary
};

제스처 위치 가져오기

탭 제스처가 발생한 위치는 개체에서 TappedEventArgs 메서드를 GetPosition 호출하여 가져올 수 있습니다. 메서드는 GetPosition 인수를 Element? 수락하고 개체로 Point? 위치를 반환합니다.

void OnTapGestureRecognizerTapped(object sender, TappedEventArgs e)
{
    // Position inside window
    Point? windowPosition = e.GetPosition(null);

    // Position relative to an Image
    Point? relativeToImagePosition = e.GetPosition(image);

    // Position relative to the container view
    Point? relativeToContainerPosition = e.GetPosition((View)sender);
}

인수는 Element? 위치를 상대적으로 가져와야 하는 요소를 정의합니다. 이 인수로 값을 제공하면 null 메서드가 GetPosition 창 내에서 탭 제스처의 위치를 정의하는 개체를 반환 Point? 합니다.