StackLayout 位于控件之上，但允许在.Net MAUI 中点击按钮和条目

Question

I have a StackLayout inside an AbsoluteLayout with some entries and a button, and the StackLayout has the LayoutBounds equal to "0,0,1,1" and the LayoutFlags equal to "All".

When I tap on the button, I show a Grid that has the same AbsoluteLayout properties described above, so that this Grid positions itself above the previous StackLayout, hiding all controls. This Grid has a BoxView with a Gray color with some opacity, and an ActivityIndicator running.

Everything works as expected, except the fact that I still can tap on the entries (showing the virtual keyboard) and the button.

I know that this Grid is above the StackLayout with the controls, but why can I still tap on them? I have the same solution in Xamarin Forms, and it works as expected, the controls have their events inhibited, since they are in a layer beneath.

Here is some sample code. For testing purposes, the Grid is already visible, but the intent is only making it visible after the tap on the button.

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             x:Class="PdC.Views.SamplePage"
             Title="SamplePage">
    <AbsoluteLayout>
        <VerticalStackLayout
            BackgroundColor="White"
            AbsoluteLayout.LayoutBounds="0,0,1,1"
            AbsoluteLayout.LayoutFlags="All"
            VerticalOptions="FillAndExpand"
            HorizontalOptions="FillAndExpand"
            Padding="0,50,0,0"
            Spacing="50">
            <Entry
                WidthRequest="200"
                BackgroundColor="Yellow"
                TextColor="Black"
                Text="sample text on first entry" />
            <Entry
                WidthRequest="200"
                TextColor="Black"
                BackgroundColor="Yellow"
                Text="sample text on second entry" />
            <Button
                Text="tap on me"
                WidthRequest="200" />
        </VerticalStackLayout>
        <Grid
            IsVisible="True"
            AbsoluteLayout.LayoutBounds="0,0,1,1"
            AbsoluteLayout.LayoutFlags="All"
            VerticalOptions="FillAndExpand">
            <Grid.RowDefinitions>
                <RowDefinition Height="2*" />
                <RowDefinition Height="*" />
            </Grid.RowDefinitions>
            <BoxView 
                ZIndex="9"
                Grid.RowSpan="2"
                BackgroundColor="Red" 
                VerticalOptions="FillAndExpand"
                Opacity="0.5" />
            <Frame
                BackgroundColor="White"
                Grid.Row="1">
                <VerticalStackLayout
                    VerticalOptions="FillAndExpand">
                    <ActivityIndicator
                        IsRunning="True"
                        HorizontalOptions="Center"
                        Color="Red"/>
                    <Label
                        TextColor="Black"
                        Text="Please wait ..."
                        HorizontalOptions="Center"/>
                </VerticalStackLayout>
            </Frame>
        </Grid>
    </AbsoluteLayout>
</ContentPage>

As you can see, the entries and the button have their background color red with some transparency, meaning that the grid is above the stacklayout, but I still can tap on the entries (and the button) as the screenshots show.

Before tapping on the entry

After tapping the entry

Answer 1

Yes, it is the case as you said. As a test, I replaced VerticalStackLayout with StackLayout and changed the property of BoxView from BackgroundColor="Red" to BackgroundColor="Transparent" .

Then I tested on xamarin forms, there was no such problem. This should be an issue in maui.

And I have created a new issue about this problem, you can follow it up here: https://github.com/dotnet/maui/issues/9514 .

Thanks for your feedback. Have a nice day.