xamarin / Xamarin.Forms

Xamarin.Forms is no longer supported. Migrate your apps to .NET MAUI.
https://aka.ms/xamarin-upgrade
Other
5.63k stars 1.88k forks source link

Shell flyout menu not selected item with ripple effect #13253

Open ghost opened 3 years ago

ghost commented 3 years ago

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

Basic Information

Workaround

Reproduction imagery

ezgif com-gif-maker (1)

Reproduction Link

hartez commented 3 years ago

I think this is a touch effect issue, not a problem with the flyout - waiting for confirmation on https://github.com/xamarin/XamarinCommunityToolkit/issues/707.

isness commented 3 years ago

I believe adding a TapGestureRecongizer in grid might help with this case, it's just that I don't know which command to bind to.

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