I have a Xamarin page with a TouchAction event and some ImageButtons (HorizontalGrid and VerticalGrid). Each of these ImageButtons has a Clicked event.
I work with MS Visual Studio, Here is the XAML code behind the page:
<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:skia="clr-namespace:SkiaSharp.Views.Forms;assembly=SkiaSharp.Views.Forms"
xmlns:tt="clr-namespace:TouchTracking.Forms;assembly=TouchTracking.Forms"
x:Class="Mobile.StorageBuild"
BackgroundColor="White"
Title="APP">
<ContentPage.Content>
<Grid>
<skia:SKCanvasView x:Name="CanvasView" EnableTouchEvents="True" PaintSurface="CanvasView_PaintSurface"/>
<Grid HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand" BackgroundColor="Transparent">
<StackLayout Orientation="Horizontal" HorizontalOptions="Center" VerticalOptions="Start" Spacing="10" Margin="0,10">
<ImageButton x:Name="HorizontalGrid" Source="HorizontalIcon.png" BackgroundColor="White" HorizontalOptions="Center" VerticalOptions="Center" Clicked="HorizontalGrid_Clicked"/>
<ImageButton x:Name="VerticalGrid" Source="VerticalIcon.png" BackgroundColor="White" HorizontalOptions="Center" VerticalOptions="Center" Clicked="VerticalGrid_Clicked"/>
</StackLayout>
<StackLayout Orientation="Horizontal" HorizontalOptions="Center" VerticalOptions="End" Margin="0,10">
<Frame x:Name="DivFrame" BorderColor="Black" Padding="0" IsVisible="True">
<Picker x:Name="Division" Title="#" HorizontalTextAlignment="Center" VerticalTextAlignment="Center" TitleColor="Black" TextColor="Black" FontSize="30" SelectedIndexChanged="Division_SelectedIndexChanged"/>
</Frame>
<ImageButton x:Name="Forward" Source="ArrowRight.png" BackgroundColor="#444444" Clicked="Forward_Clicked"/>
</StackLayout>
</Grid>
<Grid.Effects>
<tt:TouchEffect Capture="True" x:Name="OnTouch" TouchAction="OnTouch_TouchAction"/>
</Grid.Effects>
</Grid>
</ContentPage.Content>
</ContentPage>
Expected Behaviour (Clicked event over TouchAction event): If you click on ImageButton, the Clicked event should respond. If you click elsewhere, the TouchAction event should respond.
Actual Behavior: Android reacts as expected, but iOS iPhone triggers the TouchAction event even if you click on ImageButton.
My Observation: I confirmed that there is a conflict between the Clicked and the TouchAction events: The ImageButton Clicked event responds as expected with iOS device only if the TouchAction event is completely removed.
My Questions (Removing the TouchAction event is not an acceptable option):
- Does anyone know why iOS behaves this way?
- Is there a way to set this priority (Clicked event over TouchAction event) explicitly?
- Is there any other uncomplicated way to make iOS respond just like Android in this case?
Greetings and thanks to the community in advance.