Xamarin form Community toolkit Media element Controls Not showing up in iOS 16

[pjsoftcoUser]

MediaElement: ShowsPlaybackControls="True" not showing controls in IOS, please fix!

[bijington]

@pjsoftcoUser we have a template that asks for a lot more information to aid understanding what the issue is and ultimately be able to reproduce it. Can you please use that template to provide the information that we require?

[pjsoftcoUser]

Xamarin forms V5.0.0.2515

IDE: VS2022

Control: xamarin.communitytoolkit.ui.views.mediaElement

Version: xamarin.communityToolkit 2.0.5

Android works just fine

IOS not showing the control panel for the video, testing on latest IOS 16 (no difference on an emulator or actual device, both not showing the controls)

Let me know if you need more info.

[pjsoftcoUser]

maybe this is also related:
https://developer.apple.com/forums/thread/711360

[lpv-1902]

Can also confirm this doesn't work on my end.

[fbcom92]

Same problem for me. Ok for Android, but no controls at all on IOS16 and Xcode 14.
Xamarin forms V5.0.0.2515
IDE: VS2022 on Mac
Control: xamarin.communitytoolkit.ui.views.mediaElement
Version: xamarin.communityToolkit 2.0.5

[fbcom92]

@bijington, can you update this one please ?

[stevetranby]

Can confirm that the same build of an app running on iOS 15 works displaying controls, but running on iOS 16 the controls are not visible. The play/pause functionality still works if you touch right in the center of the video. Possibly the controls are just hidden even if they're active?

Edit: it might also be due to the warning with 'showsplaybackcontrols' if Xamarin iOS Custom Renderer is setting this after the platform-specific element is already created?
https://developer.apple.com/documentation/avkit/avplayerviewcontroller/1615824-showsplaybackcontrols

[fbcom92]

@stevetranby I agree with you, with a little patience you can play with the slider at the bottom of the screen. So the controls are active, but not visible.

I know that all efforts are directed towards MAUI, but the correction should not be so complex and while waiting for MAUI to be 100% operational, it would be nice if these kinds of bugs were fixed.

[pjsoftcoUser]

Yet, no attention from them!!!

[bijington]

I do believe a similar issue has been observed while adding in the Media playback functionality for the MAUI Community toolkit. I suspect whatever fix is introduced there will likely make its way over to this toolkit but I don't know when that would be.

It's correct that the team doesn't have the bandwidth to cover everything in the XCT so we sadly can't fix everything and certainly not quickly. We do of course accept PRs as the C does stand for Community.

[fbcom92]

Hi @bijington, and thanks for your kind answer.
And as the C stands for Community, you will be pleased to know that if you add Shell.PresentationMode="ModalAnimated", the controls are visible on IOS16. For what it's worth, maybe it will be helpful to understand the bug for MAUI too.

[TrevorNa]

hi @fbcom92 Shell.PresentationMode="ModalAnimated" this not work for me
is iOS 16 issue resolved yet or no ?

[KindJoy]

@TrevorNa I don't believe it's been tackled within XCT yet. I had a poke around the Maui repo and from the comments by @jfversluis it looks like this commit appears to address the issue for Maui:

CommunityToolkit/Maui@68d4004

If that's all it is, the fix for XCT would probably be very similar (and pretty quick to do for someone who can compile the XCT repo?). I have a Xamarin.Forms project, which relies on MediaElement, and I've had to write my own transport controls management because of this change months ago in iOS 16.

(Edit: having had a look further, am not sure if this issue might need changes that impact further upstream, like to either Xamarin.Forms or the xamarin-macios repos, as it looks like most view controller stuff is handled there. The core of the issue is that the av player view controller needs to be attached to the parent view controller in order for the transport controls to be displayed in iOS 16. Looks like it was an easier fix in Maui due to how all that view stuff is organised.)

[AGusty]

Create a custom renderer.

`

public class MyMediaElementRenderer : MediaElementRenderer
{
    protected override void OnElementChanged(ElementChangedEventArgs<MediaElement> e)
    {
        base.OnElementChanged(e);


        if (!UIDevice.CurrentDevice.CheckSystemVersion(16, 0))
            return;


        if (e.NewElement != null)
        {
            avPlayerViewController.View.RemoveFromSuperview();

            SetNativeControl();
        }
    }

    private void SetNativeControl()
    {
        var viewController = GetCurrentUIViewController() ?? throw new NullReferenceException("ViewController can't be null.");

        _ = viewController.View ?? throw new NullReferenceException(nameof(viewController.View));

        var insets = viewController.View.SafeAreaInsets;
        avPlayerViewController.AdditionalSafeAreaInsets = new UIEdgeInsets(insets.Top * -1, insets.Left, insets.Bottom * -1, insets.Right);

        viewController.View.AddSubview(avPlayerViewController.View);

        AddSubview(avPlayerViewController.View);
    }

    private UIViewController GetCurrentUIViewController()
    {
        var window = UIApplication.SharedApplication.KeyWindow ?? UIApplication.SharedApplication.Windows?.FirstOrDefault();
        if (window == null)
            return null;

        var viewController = window.RootViewController;

        while (viewController.PresentedViewController != null)
        {
            viewController = viewController.PresentedViewController;
        }

        return viewController;
    }
}


`