[Bug] Shell flyout menu not selected item with ripple effect

[ghost]

Description

Hi, I would like to ask if it is possible to apply the ripple effect to Shell FlyoutItem. The ripple effect works, but the menu item does not work, you cannot change the page. Without ripple effect, the transition to the page works. Advise if I'm making a mistake somewhere. I will be happy for any advice.

Steps to Reproduce

1. Create a Shell project
2. Create ItemTemplate in AppShell
3. Add a ripple effect to the DataTemplate xct:TouchEffect.NativeAnimationColor="Red" xct:TouchEffect.NativeAnimation="True"

<FlyoutItem Title="Item 1"> 
      <Shell.ItemTemplate> 
            <DataTemplate> 
                  <ContentView> 
                        <Grid HeightRequest="50" 
                            xct:TouchEffect.NativeAnimation="True" 
                            xct:TouchEffect.NativeAnimationColor="Red"> 
                        </Grid> 
                  </ContentView> 
            </DataTemplate> 
      </Shell.ItemTemplate> 
<ShellContent Route="HomePage" ContentTemplate="{DataTemplate local:HomePage}" /> 
</FlyoutItem>

Expected Behavior

Ripple effect and go to the selection page from the shell menu.

Actual Behavior

The ripple effect works, switching to another page does not work when selecting from the menu.

Platforms

• [x] Android
• [ ] iOS

Basic Information

• Version with issue:
• Xamarin.Forms 5.0.0.1791-pre5
• Last known good version:
• IDE: Visual Studio 2019
• Platform Target Frameworks:
  • iOS: Not tested
  • Android: 10, 8.1, 7.1
  • UWP: Not tested
• Android Support Library Version:
• Nuget Packages: Xamarin.CommunityToolkit 1.0.0-pre6
• Affected Devices:

Workaround

Reproduction imagery

Reproduction Link

[pictos]

@ORRNY66 I think that you want to report this bug on XF repo, right?

[ghost]

https://github.com/xamarin/Xamarin.Forms/issues/13253#issue-776136472

[pictos]

Thanks @ORRNY66, I'll close this so.

[hartez]

@pictos

I whipped up a repro for this - one of the flyout items (About) has the touch effect applied, and the other (Browse) does not. The flyout item without the touch effect works fine; the one with the touch effect does not work. Is there something special I need to do so that the touch effect passes the tapped event through? If not, I think this is a bug with the touch effect.

_13253 Repro.zip

[pictos]

@hartez I'm sorry I didn't see that xct effect :/ I'll reopen this one and investigate better.

[isness]

Has anyone found a workaround? Is it even possible to implement any touch effects on flyouts in some other way?