I want to enable swipe gestures in media element in Maui Community Toolkit

Question

I will mention this is not an issue on Windows. I don't know about mac or iOS. On Windows it just works.

I would like to enable swipe gestures in Media Player for Maui Community toolkit. The player being used internally on Android is Exoplayer. The exoplayer github team has publicly stated that gestures being blocked is intended.

If I disable the media controls swipe gestures work. If I enable the media controls it does not work. I would like to somehow override the media controls and enable custom control that brings back gestures. I would also like to stop the video at the same time. I want to swipe right to navigate back to previous page.

Example code that is not working:

<?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"
              xmlns:viewmodel="clr-namespace:NerdNewsNavigator2.ViewModel"
               xmlns:toolkit="http://schemas.microsoft.com/dotnet/2022/maui/toolkit"
             x:Class="NerdNewsNavigator2.View.PlayPodcastPage"
              x:DataType="viewmodel:PlayPodcastViewModel"
             Shell.NavBarIsVisible="False"
             Title="">
    <Shell.BackButtonBehavior>
        <BackButtonBehavior IsEnabled="True" IsVisible="{OnPlatform Android=False,iOS=False, WinUI=True}">
        </BackButtonBehavior>
    </Shell.BackButtonBehavior>
    <FlexLayout>
        <FlexLayout.GestureRecognizers>
            <SwipeGestureRecognizer
                  Direction="Right" 
                Swiped="SwipedGesture" />
        </FlexLayout.GestureRecognizers>
        <toolkit:MediaPlayer
            IsVisible="True"
            ShouldAutoPlay="True"
            ShouldKeepScreenOn="True"
            ShouldShowPlaybackControls="True"
            Source="{Binding Url}">
        </toolkit:MediaPlayer>
    </FlexLayout>
</ContentPage>

This code works on Windows exactly as listed. On Android it does not. If I set ShouldShowPlaybackControls to false it does work in Android. I would like to have media control and be able to swipe right.

I have been unable to find a way around this issue. I have no idea where to start. I believe I need to override exoplayer controls as it is blocking swipe gestures. I have no idea how to do that.

Answer 1

As a work-around, put MediaPlayer inside a Grid.

Then it is possible to overlay another element on top of it.

To allow the controls to still work, don't cover them.
Something like this (I assume media controls are at bottom, with height 50):

<Grid RowDefinitions="*,50" >
  <MediaPlayer Grid.RowSpan="2" ... />
  <BoxView Grid.Row="0" BackgroundColor="Transparent" VerticalOptions="Fill" >
    <BoxView.GestureRecognizers>
      <SwipeGestureRecognizer ... />
    </BoxView.GestureRecognizers>
  </BoxView>
</Grid>