Media Element Full Screen for Android/Windows

[ne0rrmatrix]

I have created device specific code for adding Full screen controls to media element. I have not yet added it to my fork of media element. I am looking for suggestions as to how to move forward with adding it to toolkit. It uses platform specific code to set full screen and restore screen.

This is a example with custom controls using bindable properties for inserting full screen control. This is just an example of layout for specific UI element for full screen toggle control. It as shown is in upper right as an image button. This is subject to discussion and change as needed.

I have example code in a forked copy of community toolkit. Here is example code for windows and android.

Windows code in AppBuilderExtensions.shared.cs

#if WINDOWS
		Microsoft.Maui.Handlers.WindowHandler.Mapper.AppendToMapping(nameof(IWindow), (handler, view) =>
		{
			var nativeWindow = handler.PlatformView;
			nativeWindow.Activate();
			nativeWindow.ExtendsContentIntoTitleBar = false;

			var windowHandle = WinRT.Interop.WindowNative.GetWindowHandle(nativeWindow);
			var windowId = Microsoft.UI.Win32Interop.GetWindowIdFromWindow(windowHandle);
			var appWindow = Microsoft.UI.Windowing.AppWindow.GetFromWindowId(windowId);

			if (appWindow.Presenter is Microsoft.UI.Windowing.OverlappedPresenter p)
			{
				p.IsResizable = true;
				// these only have effect if XAML isn't responsible for drawing the titlebar.
				p.IsMaximizable = true;
				p.IsMinimizable = true;
			}
		});
#endif

MediaManager.windows.cs:

Page currentPage = Shell.Current.CurrentPage;
	bool navBarIsVisible = false;
	bool tabBarIsVisible = false;

	protected virtual partial void PlatformFullScreen()
	{
		var window = currentPage.GetParentWindow().Handler.PlatformView as MauiWinUIWindow;
		if (window is not null)
		{
			navBarIsVisible = Shell.GetNavBarIsVisible(currentPage);
			tabBarIsVisible = Shell.GetTabBarIsVisible(currentPage);
			NavigationPage.SetHasNavigationBar(currentPage, false);
			Shell.SetNavBarIsVisible(currentPage, false);
			Shell.SetTabBarIsVisible(currentPage, false);
			var currentWindow = GetAppWindow(window);
			switch (currentWindow.Presenter)
			{
				case OverlappedPresenter overlappedPresenter:
					overlappedPresenter.SetBorderAndTitleBar(false, false);
					overlappedPresenter.Maximize();
					break;
			}
		}

	}
	protected virtual partial void PlatformRestoreScreen()
	{
		var window = currentPage.GetParentWindow().Handler.PlatformView as MauiWinUIWindow;
		if (window is not null)
		{
			NavigationPage.SetHasNavigationBar(currentPage, navBarIsVisible);
			Shell.SetNavBarIsVisible(currentPage, navBarIsVisible);
			Shell.SetTabBarIsVisible(currentPage, tabBarIsVisible);
			var currentWindow = GetAppWindow(window);
			switch (currentWindow.Presenter)
			{
				case OverlappedPresenter overlappedPresenter:
					if (overlappedPresenter.State == Microsoft.UI.Windowing.OverlappedPresenterState.Maximized)
					{
						overlappedPresenter.SetBorderAndTitleBar(true, true);
						overlappedPresenter.Restore();
					}
					break;
			}
		}

	}
	static AppWindow GetAppWindow(MauiWinUIWindow window)
	{
		var handle = WinRT.Interop.WindowNative.GetWindowHandle(window);
		var id = Microsoft.UI.Win32Interop.GetWindowIdFromWindow(handle);
		var appWindows = Microsoft.UI.Windowing.AppWindow.GetFromWindowId(id);
		return appWindows;
	}

MediaManager.android.cs

Page currentPage = Shell.Current.CurrentPage;
	bool navBarIsVisible = false;
	bool tabBarIsVisible = false;

	protected virtual partial void PlatformFullScreen()
	{
		var activity = Platform.CurrentActivity;

		if (activity == null || activity.Window == null || Shell.Current == null)
		{
			return;
		}

		navBarIsVisible = Shell.GetNavBarIsVisible(currentPage);
		tabBarIsVisible = Shell.GetTabBarIsVisible(currentPage);
		NavigationPage.SetHasNavigationBar(currentPage, false);
		Shell.SetNavBarIsVisible(currentPage, false);
		Shell.SetTabBarIsVisible(currentPage, false);
		AndroidX.Core.View.WindowCompat.SetDecorFitsSystemWindows(activity.Window, false);
		var windowInsetsControllerCompat = AndroidX.Core.View.WindowCompat.GetInsetsController(activity.Window, activity.Window.DecorView);
		var types = AndroidX.Core.View.WindowInsetsCompat.Type.StatusBars() |
					AndroidX.Core.View.WindowInsetsCompat.Type.NavigationBars();

		windowInsetsControllerCompat.SystemBarsBehavior = AndroidX.Core.View.WindowInsetsControllerCompat.BehaviorShowBarsBySwipe;
		windowInsetsControllerCompat.Hide(types);
	}
	protected virtual partial void PlatformRestoreScreen()
	{
		var activity = Platform.CurrentActivity;

		if (activity == null || activity.Window == null || Shell.Current == null)
		{
			return;
		}

		NavigationPage.SetHasNavigationBar(currentPage, navBarIsVisible);
		Shell.SetNavBarIsVisible(currentPage, navBarIsVisible);
		Shell.SetTabBarIsVisible(currentPage, tabBarIsVisible);
		AndroidX.Core.View.WindowCompat.SetDecorFitsSystemWindows(activity.Window, false);
		var windowInsetsControllerCompat = AndroidX.Core.View.WindowCompat.GetInsetsController(activity.Window, activity.Window.DecorView);
		var types = AndroidX.Core.View.WindowInsetsCompat.Type.StatusBars() |
					AndroidX.Core.View.WindowInsetsCompat.Type.NavigationBars();
		windowInsetsControllerCompat.Show(types);
	}

This is for making full screen or restore screen code. What I need is feedback on the above code and what I should do next. I have an implementation working with the command:

mediaElement.FullScreen();
mediaElement.RestoreScreen();

This is an example. It works regardless of navbar and tab bar status. Either can be on or off. You can have a title set etc. It will disable it for full screen and re-enable it to previous settings upon exit. In the windows code I have appended a mapping in in the build section and I am unsure if that is ok? Can someone get back to me about that? I have ran a demo and incorporated it into a fork of a program that uses media element and it works for me in Windows and Android. I don't have a mac but I can adjust it for IOS if needed. I think with IOS you can only set it at start and thats it. I have checked the IOS apple apps and they exhibit that behavior themselves.

Should I do different Discussion and separate the controls and implementation of full screen as separate items?
https://github.com/ne0rrmatrix/Maui/tree/FullScreen

[CliffAgius]

Closing as duplicate discussion - #929 #929