Xamarin.forms: Tap Gesture not working on iOS [Bug]

[odapplications]

When having a tap gesture within a frame in xaml it will work on some but not all tap gestures. When adding it to the .cs file it would work but not directly within xaml.

Description

Steps to Reproduce

1. 
   
   
   2.
   
3.

Expected Behavior

Actual Behavior

Basic Information

• Version with issue:
• Last known good version:
• IDE:
• Platform Target Frameworks:
  
  
  
  • iOS:
  
  
  • Android:
  
  
  • UWP:
  
  
• Android Support Library Version:
• Nuget Packages:
• Affected Devices:

Screenshots

Reproduction Link

Workaround

[odapplications]

Note: some ios versions work and some dont

[AdamMarciniec]

I'm getting this too, I have TapGestureRecognizers on grids that fail to fire and all of my ListViews won't allow a selected item to happen in iOS. Buttons still seem to work though. All this was working last week. Everything works fine in Android.
Let me know if I can send anything to help this along, our app is basically useless on ios now.

Edit. I saw the note that some versions of ios are ok. I can only confirm that 13.4 has this issue.

Edit 2: I found this issue and it sorted me out after reading the comments nearer the bottom. Thanks.

[PureWeen]

@odapplications @AdamMarciniec

Can you attach a repro? Also make sure you're fully updating on VS

[odapplications]

@PureWeen I ended up fixing the issue. It does not seem to work the same ways as it used to. I think it was just a weird way I was adding the tap gesture. Now I get multiple imports of xamarin forms which I checked there is not.

I would link you to the repo... but it is private so I would have to invite you.

[samhouts]

@odapplications Please check your csproj file for duplicates. Sometimes NuGet will install improperly on an update.

[LGFox]

I observe this issue on iOS 13.5.1
Updating VS to the latest 8.6.5 (build 23) fixes this issue.

[samhouts]

Oops, didn't mean to close this one without asking first! Is there still an issue here, or is it okay to close?

[dhindrik]

I still have an issue with the latest stable version of Forms. It works on Android, but not on iOS. Here is a repo that reproduces it, https://github.com/dhindrik/RatingControl

I comment away some other "work in progress code" so it will be easier to see the TapGesture problem.

[PureWeen]

@dhindrik do you know a specific version where this broke for you? Or have TapGesture's just never really worked for shapes?

[dhindrik]

If you set Rating to example 3.5 you will add the Gesture Recognizer to a Grid and it still not working. But I can investigate more. I tried to downgrade to 3.6, but then I realized that Shapes was introduced in 3.5.

[dhindrik]

If I replace the Shapes with a BoxView instead it is working, so it looks like Shapes are the problem, even if it is wrapped in a Grid.

[PureWeen]

@jsuarezruiz

[PureWeen]

@dhindrik do you think your issue relates to the original post here?

I'm a little lost on your version lists here

If you set Rating to example 3.5 you will add the Gesture Recognizer to a Grid and it still not working. But I can investigate more. I tried to downgrade to 3.6, but then I realized that Shapes was introduced in 3.5.

Did you mean 4.5/4.6 etc..?

[dhindrik]

4.6 and 4.7. 3.5 was if you set the Rating value to 3.5 to get a half star.

[dhindrik]

When I add a PanGestureRecognizer to the control (the code I commented away) so will it just work if I start with the Gesture outside of the Shape. I add the PanGestureRecognizer to the underlying control. That problem is also for Android.

[ccsousa01]

TapGestureRecognizer within a frame, which is the parent view inside a <CollectionView> <CollectionView.ItemTemplate> <DataTemplate> still does not trigger from iOS (Xamarin Forms v.4.8). Works fine in Android.

[DellaMoraWalter]

I confirm that shape objects are involved in this problem.
In my case I have a StackLayout with inside a Label and a Shape created through a Path.
A TapGestureRecognizer is attached to the StackLayout which has the task of executing a command.
Basically it's a button whose image is rendered from a shape and not from a png.
By tapping on the label the command is executed but not by tapping on the Shape.

Tested with iOS 11.1 and ios 13.6.
Xamarin.Forms v 4.8.0.1364
UWP and Android seem to work fine.

[frankzielen]

I face the same issue as @DellaMoraWalter and @dhindrik. TapGestureRecognizer does not work for shapes on iOS. I have added it to Path, Polygone and Polyline objects - none did it, neither in a StackLayout nor in a Grid. Wrapping the shape in a Frame works but only if I tap on the area outside the shape. That's not what I want so it's not an appropriate workaround. Wrapping in a ContentView shows no effect.

I have tested on iOS 13.5 and 14.0, XF is 4.8.0.1451.

I am awaiting a fix or workaround! Thx in advance.

[jgold6]

@frankzielen

When the Shape is in another element, the SHape is still on top and still gets the tap from the user, so you have to pass the tap down to the wrapping container, whether a Frame or ContentView

If you set the InputTransparent property on the Shape to true then the Tapped event will fire from the View (whatever subtype) that is wrapping the Shape. E.g.:

        var tgr = new TapGestureRecognizer();
        tgr.Tapped += async (s, e) => {
            await DisplayAlert("Info", "Tapped", "OK");
        };

        Polygon triangle = new Polygon
        {
            Points = new PointCollection(),
            Fill = Brush.Blue,
        };
        triangle.Points.Add(new Point(0, 0));
        triangle.Points.Add(new Point(100, 0));
        triangle.Points.Add(new Point(50, 50));
        triangle.InputTransparent = true;  // <------------------------set InputTransparent to True

        var frame= new Frame(); 
        frame.Content = triangle; // <--------------------- add to Frame

        frame.GestureRecognizers.Add(tgr); // <-----------TapGestureRecognizer on Frame

        Content = new StackLayout
        {
            Children = { frame }, // <------------------------ add Frame to view heirarchy
            HorizontalOptions = LayoutOptions.Center,
            VerticalOptions = LayoutOptions.Center
        };

[frankzielen]

Thx @jgold6! The InputTransparent property was the missing link to make wrapping in a Frame or ContentView work. However, the workaround is still not perfect (for my application) because Frame and ContentView have rectangular shapes. E.g. for the triangle I can now tap on the area outside the triangle but inside the wrapping object to fire the event. Is there a possibility to wrap seamlessly around the shape?

[jgold6]

@frankzielen

If you need to only have the tap work when the actual triangle is being tapped, then you will need to do that in platform specific renderers and use the iOS/Android/UWP SDK APIs to do hit tests.

Since a Xamarin.Forms Shape is a View, and a View is rectangular, adding a TapGestureRecognizer to a Shape will trigger the Tap for the View box, not for the shape inside of it. This is what happens on Android when the Shape is not wrapped in a Frame, etc.

There is a discussion of getting the tap coordinates in Xamarin.Forms on the Xamarin Forums: https://forums.xamarin.com/discussion/17767/touch-coordinates-in-tapgesturerecognizer

Docs on handling touch events in Xamarin.iOS: https://docs.microsoft.com/en-us/xamarin/ios/app-fundamentals/touch/
Docs on handling touch events in Xamarin.Android: https://docs.microsoft.com/en-us/xamarin/android/app-fundamentals/touch/touch-in-android
Docs on handling touch events in UWP: https://docs.microsoft.com/en-us/windows/uwp/design/input/touch-interactions

Alternately you could use SkiaSharp for your shapes: https://docs.microsoft.com/en-us/xamarin/xamarin-forms/user-interface/graphics/skiasharp/transforms/touch

And there is a paid plugin, noted in the Xamarin Forums discussion linked above (I can't vouch for it) that claims to enable determining where the touch occurred: https://www.mrgestures.com/

[mduchev]

I'm having the same issue with a shape. The workaround with the InputTransparent seems to do the trick for me until the issue is fixed.