Xamarin - ImageButton doesnt activate every click

Question

Screen

On the picture above you can see where the ImageButton sometimes activates. When I spam clicking in the blue area the counter sometimes increases. I think there might be another Layer on top of the ImageButton but I dont know how to fix it. Below there is the XAML code. Hopefully somebody can help. Thanks!

<StackLayout>
    <Label Text="Discover" TextColor="Black" FontSize="24" FontAttributes="Bold" Margin="15" />

    <CarouselView ItemsSource="{Binding plants}" HeightRequest="300" PeekAreaInsets="100">
        <CarouselView.ItemTemplate>
            <DataTemplate>
                <StackLayout>
                    <Frame  HeightRequest="280" WidthRequest="180" BackgroundColor="Wheat" HasShadow="True" Margin="10" Padding="0" HorizontalOptions="CenterAndExpand" CornerRadius="10" >
                        <Grid>
                            <StackLayout>
                                <ImageButton Source="{Binding imgsource}" VerticalOptions="FillAndExpand" 
                                    Aspect="AspectFill" Opacity="0.8" Clicked="ImageButton_Clicked"/>
                            </StackLayout>

                            <StackLayout Margin="0,10" >

                                <Image Source="https://icons-for-free.com/iconfiles/png/512/bookmark-131964752402712733.png" HeightRequest="35"
                       Aspect="AspectFit" HorizontalOptions="EndAndExpand" Margin="5,-15"/>
                                <Label Text="{Binding name_norm}" TextColor="Black" FontSize="16" FontAttributes="Bold"
                       Margin="15,-10,0,0" VerticalOptions="EndAndExpand" />

                                <StackLayout Orientation="Horizontal" Margin="15,-8,0,0" >
                                    <Image Source="https://www.freeiconspng.com/thumbs/info-icon/info-icon-24.png" HeightRequest="15"
                       Aspect="AspectFit"/>
                                    <Label Text="{Binding name_lat}" TextColor="Black" FontSize="16" FontAttributes="Italic"  VerticalOptions="EndAndExpand" Margin="-5,0" />
                                </StackLayout>
                            </StackLayout>
                        </Grid>
                    </Frame>
                </StackLayout>
            </DataTemplate>
        </CarouselView.ItemTemplate>
    </CarouselView>
    <Label x:Name="label" Text="0 ImageButton clicks"
           FontSize="Large"
           HorizontalOptions="Center"
           VerticalOptions="CenterAndExpand" />
</StackLayout>

Here the C# Code:

namespace PlantBase
{
public partial class MainPage : ContentPage
{
    int clickTotal;
    public MainPage()
    {
        InitializeComponent();
    }

    private void ImageButton_Clicked(object sender, EventArgs e)
    {
        clickTotal += 1;
        label.Text = $"{clickTotal} ImageButton click{(clickTotal == 1 ? "" : "s")}";
    }
}

}

Answer 1

Check VisualElement.InputTransparent Property.

false if the element and its children should receive input; true if neither the element nor its children should receive input and should, instead, pass inputs to the elements that are visually behind the current visual element. Default is false.

What you need is to set InputTransparent to true on the text stackLayout .

 <StackLayout  InputTransparent="True"  Margin="0,10" VerticalOptions="EndAndExpand" BackgroundColor="SaddleBrown">
     <Label Text="{Binding name_norm}" TextColor="White" FontSize="16" FontAttributes="Bold" Margin="15,-10,0,0" VerticalOptions="EndAndExpand" />
     <StackLayout Orientation="Horizontal" Margin="15,-8,0,0" BackgroundColor="Aqua">
         <Image Source="https://www.freeiconspng.com/thumbs/info-icon/info-icon-24.png" HeightRequest="15" Aspect="AspectFit" />
         <Label Text="{Binding name_lat}" TextColor="White" FontSize="16" FontAttributes="Italic"  VerticalOptions="EndAndExpand" Margin="-5,0" />
     </StackLayout>
 </StackLayout>