CEF 实现全屏播放视频

一、问题

通过使用cef实现的浏览器，在播放视频时，点击最大化，结果只有网页最大化了，但是窗口没有最大化，结果出人意料。为了解决这个问题，在网上查找一番资料后，整理了这篇博客。

二、主要接口

CefClient

提供对浏览器实例的访问的回调，一个CefClient实例可一个共享给多个浏览器。可以处理浏览器生命周期，菜单，对话框，显示通知，拖拽事件，键盘事件等。

CefDisplayHandler

提供给与浏览器显示相关的接口，详细接口说明参考源码注释，下面全屏状态相关的接口：

  ///
  // Called when web content in the page has toggled fullscreen mode. If
  // |fullscreen| is true the content will automatically be sized to fill the
  // browser content area. If |fullscreen| is false the content will
  // automatically return to its original size and position. The client is
  // responsible for resizing the browser if desired.
  ///
  /*--cef()--*/
  virtual void OnFullscreenModeChange(CefRefPtr browser,
                                      bool fullscreen) {}

三、实现

1、实现点击播放控件全屏和退出全屏

#pragma once

class CWebClient : public CefClient, public CefDisplayHandler
{
public:
	
	virtual CefRefPtr GetDisplayHandler() {
		return this;
	}

	//CefDisplayHandler
	virtual void OnFullscreenModeChange(CefRefPtr browser, bool fullscreen) 
	{
		static RECT preWinRect = {0};

		//The parent window of the inner browser
		if (m_hParent == NULL)
		{
			return;
		}

		if (fullscreen)
		{
			//Title bar height
			int nHeadHeight = 34; 
			//The number of px between parent window and inner browser
			int nOffset = 1; 
			int nW = GetSystemMetrics(SM_CXSCREEN);
			int nH = GetSystemMetrics(SM_CYSCREEN);
			//Store the rectangle of old window
			::GetWindowRect(m_hParent, &preWinRect); 
			::SetWindowPos(m_hParent, HWND_TOPMOST, 0, -nHeadHeight, nW, nH + nHeadHeight + nOffset, SWP_NOACTIVATE | SWP_NOSENDCHANGING);
		}
		else
		{
			int nW = preWinRect.right - preWinRect.left;
			int nH = preWinRect.bottom - preWinRect.top;
			int nX = preWinRect.left;
			int nY = preWinRect.top;

			if (nW <= 0 || nH <= 0)
			{
				return;
			}

			::SetWindowPos(m_hParent, HWND_NOTOPMOST, nX, nY, nW, nH, SWP_NOACTIVATE);
		}

		return;
	}

private:
	HWND m_hParent;
};

2、实现按下ESC退出全屏

CefKeyboardHandler

提供处理键盘输入相关的接口，这里使用的接口说明如下：

  ///
  // Called before a keyboard event is sent to the renderer. |event| contains
  // information about the keyboard event. |os_event| is the operating system
  // event message, if any. Return true if the event was handled or false
  // otherwise. If the event will be handled in OnKeyEvent() as a keyboard
  // shortcut set |is_keyboard_shortcut| to true and return false.
  ///
  /*--cef()--*/
  virtual bool OnPreKeyEvent(CefRefPtr browser,
                             const CefKeyEvent& event,
                             CefEventHandle os_event,
                             bool* is_keyboard_shortcut) { return false; }

在CWebClient中添加如下代码即可实现按ESC键退出全屏

bool CWebClient::OnPreKeyEvent( CefRefPtr browser, const CefKeyEvent& event, CefEventHandle os_event, bool* is_keyboard_shortcut )
{
	if (event.type == KEYEVENT_RAWKEYDOWN && event.windows_key_code == VK_ESCAPE)
	{
		CefRefPtr frame = browser->GetMainFrame();
		frame->ExecuteJavaScript("{document.webkitExitFullscreen()}", frame->GetURL(), 0);
	}
	
	return false;
}

CefRefPtr CWebClient::GetKeyboardHandler()
{
	return this;
}

至此全屏播放视频及退出全屏功能便完成了，如果还想实现其他快捷键（如F11）进入或退出全屏，按照上述方法也能实现。