A button placed under another view cannot be tapped/clicked on iOS and MacCatalyst

[dilyantraykov]

Description

A button placed under another view cannot be tapped/clicked on iOS and MacCatalyst.

For example:

    <!-- Button cannot be tapped/clicked on iOS and MacCatalyst -->
    <Grid>
        <Button Text="Click" Clicked="Button_Clicked" />
        <Grid />
    </Grid>

Expected Behavior:
The button reacts to the interaction - the Clicked event is fired and an alert is shown.

Actual Behavior
The button does not react to interaction - the Clicked event is not fired - on iOS and MacCatalyst.

Steps to Reproduce

1. Open the project from the referenced reproduction repository.
2. Try to click on the button.

Other Observations

There seems to be some inconsistency between the behavior on the different platforms about how click/tap events are passed with respect to the Background of the layout.

On Windows, for example, the Click is received by the button only if the Background property of the overlaying Grid is not explicitly set. If the property is set, even to Transparent, the Clicked event is not fired as the click/tap seems to be intercepted by the Grid.

On Android, the Clicked event is raised regardless of the value of the Background property.

On Mac/iOS, the Clicked event is never raised, regardless of the Background of the Grid.

Link to public reproduction project repository

https://github.com/telerik/ms-samples/tree/main/Maui/CannotInteractWithButtonUnderneathView

Version with bug

7.0.59

Last version that worked well

Unknown/Other

Affected platforms

iOS, macOS

Affected platform versions

iOS 16

Did you find any workaround?

No response

Relevant log output

No response

[ghost]

We've added this issue to our backlog, and we will work to address it as time and resources allow. If you have any additional information or questions about this issue, please leave a comment. For additional info about issue management, please read our Triage Process.

[mattleibow]

This is not really a bug (or maybe it is) because you have a control on top of the button. To make taps pass through, you should set InputTransparent = true on the layout.

Android seems to work because of #10252

This is different to other XAML frameworks where it is input transparent by default until you set some color: #19124 If you have opinions or comments on that, please leave a comment there.

For now, I am closing this issue as it is working as currently designed.