maui
maui copied to clipboard
dotnet
[Bug] Click on an element of one view behind another view.
Description
In Xamarin when I placed a view on top of another view, the back view did not capture click events.
Steps to Reproduce
Version with bug
6.0.408 (current)
Last version that worked well
Unknown/Other
Affected platforms
Android
That is expected, right? If you put something on top then it's not going to capture the events anymore. Add the InputTransparent property to make the top element not capture any input and the button will work.
Also please add a reproduction project through a GitHub repo, unfortunately we can't accept zip files. I'm going to assume this will fix your issue, if not feel free to open a new one with more details and the repro on a repo. Thanks!
@jfversluis Hi!
Expected is that if I put something on top, the button behind won't capture any events. But that doesn't happen. Even with a view on top, the back button continues to capture events. This did not happen in Xamarin.
Code:
<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui" xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" x:Class="MauiApp1.MainPage">
<ScrollView>
<Grid>
<VerticalStackLayout Spacing="25"
Padding="30,0"
VerticalOptions="Center">
<Image Source="dotnet_bot.png"
SemanticProperties.Description="Cute dot net bot waving hi to you!"
HeightRequest="200"
HorizontalOptions="Center" />
<Label Text="Hello, World!"
SemanticProperties.HeadingLevel="Level1"
FontSize="32"
HorizontalOptions="Center" />
<Label Text="Welcome to .NET Multi-platform App UI"
SemanticProperties.HeadingLevel="Level2"
SemanticProperties.Description="Welcome to dot net Multi platform App U I"
FontSize="18"
HorizontalOptions="Center" />
<Button x:Name="CounterBtn"
Text="Click me"
SemanticProperties.Hint="Counts the number of times you click"
Clicked="OnCounterClicked"
HorizontalOptions="Center" />
</VerticalStackLayout>
<VerticalStackLayout VerticalOptions="End"
BackgroundColor="#80FFFFFF"
HeightRequest="340">
</VerticalStackLayout>
</Grid>
</ScrollView>
Ah OK seems I got it backwards then. Does this only happen on Android? Did you try Windows or iOS?
If you do set InputTransparent explicitly, does that change anyhing?
@jfversluis I tested it on Windows and iOS and both are working correctly. Do not capture the event. Only on Android that this is happening.
On Android I set the InputTransparent and it works. But I can't always use InputTransparent because sometimes I need a click event only in the visible area of the view behind.
Windows:
iOS:
Simplest workaround for me was adding an empty TapGestureRecognizer to the view that's over top. Explicitly setting InputTransparent didn't seem to do anything. Tested on 6.0.305 and 6.0.402
I'm having the same problem, I realized that it doesn't happen with the Frame control, with the others it's happening as described here. Here are some tests I did in a clean project:
https://user-images.githubusercontent.com/85559208/214406619-6829a630-648f-44dd-aa54-40582c57bc04.mp4
https://user-images.githubusercontent.com/85559208/214406463-a56293ed-7a4b-42e8-b5bf-5104e6eea494.mp4
