How to add fullscreen support to a GeckoFx browser?

Question

I'm building a web browser in a C# .NET Windows Form Application and wanted to add support for fullscreen usage (mainly on HTML5 videos).

So that when users press the fullscreen button on a video like a youtube video, the video would take up the full screen.

The browser uses a GeckoFx control to view the interweb. How would I go about doing this?

Answer 1

Set the Browser Control Dock property to Dock.Fill.
You can get the Screen size where you program is currently displayed and use its Bounds to size your Form.

Subscribe to the Resize event. When the Form is maximized, remove the border (which will remove the title bar, too), set the FormWindowState back to FormWindowState.Normal (otherwise you won't be able to use the full screen size) then resize it as needed.

You application should be DPIAware (if it's not see here).
You should also handle the F11 key to allow the user to maximize/normalize the Form's window.

using System;
using System.Drawing;
using System.Windows.Forms;
using Gecko;
using Screen = System.Windows.Forms.Screen;

public partial class Form1 : Form
{
    bool IsMaximized = false;
    bool TheaterClicked = false;
    Rectangle previousPosition = Rectangle.Empty;
    string UserAgent = "Mozilla/5.0 (Windows NT 6.1; Win64; x64; rv:65.0) Gecko/20100101 Firefox/65.0";
    public Form1()
    {
        InitializeComponent();
        Xpcom.Initialize("Firefox");
        GeckoPreferences.User["full-screen-api.enabled"] = true;
        GeckoPreferences.Default["full-screen-api.enabled"] = true;
        GeckoPreferences.User["general.useragent.override"] = UserAgent;
        GeckoPreferences.Default["general.useragent.override"] = UserAgent;
    }

    private void Form1_Load(object sender, EventArgs e)
    {
        previousPosition = Bounds;
        geckoWebBrowser1.Navigate("[Some URL]");
        geckoWebBrowser1.GetDocShellAttribute().SetFullscreenAllowed(true);
    }

    private void Form1_Resize(object sender, EventArgs e)
    {
        if (WindowState == FormWindowState.Maximized) { 
            SetWindowState(WindowState, false);
        }
        else if (!IsMaximized) { 
            previousPosition = Bounds;
        }
    }

    private void geckoWebBrowser1_DomMouseDown(object sender, DomMouseEventArgs e)
    {
        if (geckoWebBrowser1.Url.Host.Contains("youtu")) {
            GeckoHtmlElement elm = (GeckoHtmlElement)e.Target.CastToGeckoElement();
            switch (elm.ClassName)
            {
                case "ytp-fullscreen-button ytp-button":
                    if (geckoWebBrowser1.Document.GetElementsByClassName("ytp-size-button ytp-button").FirstOrDefault() is GeckoHtmlElement theater) {
                        if (!TheaterClicked) {
                            theater.Click();
                            TheaterClicked = true;
                        }
                    }
                    break;
                case "ytp-size-button ytp-button":
                    TheaterClicked = !TheaterClicked;
                    break;
                default:
                    break;
            }
        }
    }

    private void SetWindowState(FormWindowState state, bool setSize)
    {
        if (state == FormWindowState.Maximized) {
            IsMaximized = true;
            if (setSize) previousPosition = Bounds;
            WindowState = FormWindowState.Normal;
            FormBorderStyle = FormBorderStyle.None;
            Location = Point.Empty;
            Size = Screen.FromHandle(Handle).Bounds.Size;
        }
        else {
            FormBorderStyle = FormBorderStyle.Sizable;
            Bounds = previousPosition;
            IsMaximized = false;
        }
    }

    protected override bool ProcessCmdKey(ref Message msg, Keys keyData)
    {
        base.ProcessCmdKey(ref msg, keyData);
        if (keyData == Keys.F11) {
            SetWindowState(IsMaximized ? FormWindowState.Normal : FormWindowState.Maximized, true);
            return true;
        }
        else {
            return false;
        }
    }
}