UE4 problems encountered in using the Webbrowser plug-in and solutions

1. Unable to play webpage video, this is because UE4's WebBrowser comes with cef3 version 3071, which does not support h264 and other live streams by default, resulting in the live streams in the web cannot be played

Solution: The first method is to recompile the cef source code to support H.264, and then replace the relevant files in the UE4 installation directory. There are tutorials on the Internet to search for yourself. The second way is to directly find the modified plug-in, Taobao

2. Hide the web page slider

Solution: Use the ExecuteJavascript function of the webbrowser to execute the js code. The general meaning of this code is to set the length and width of the slider to 0 to hide the sliding items. It should be noted that the js code needs to be fully loaded before the web page Execute the js code correctly, but UE does not have a callback for the complete loading of the web page, so you need to add a delay before using this function, and test the specific delay by yourself

var style = document.createElement('style');style.type = 'text/css';style.innerHTML = '::-webkit-scrollbar {width: 0px;height: 0px;}';document.getElementsByTagName('head')[0].appendChild(style);

3. The webpage opened with webbrowser cannot input Chinese in the edit box

Solution: Modify the source code and find the RebuildWidget function in WebViewBrowser.cpp to modify it

//支持中文输入
ITextInputMethodSystem* const TextInputMethodSystem = FSlateApplication::Get().GetTextInputMethodSystem();
WebViewBrowserWidget->BindInputMethodSystem(TextInputMethodSystem);

4. Sliding up and down is not supported on the touch screen, because the OnTouchMoved method is not rewritten in the WebViewBrowserViewport class

Solution: Rewrite this method and implement the logic. Another problem is that when you move on the touch screen, the OnMouseButtonDown and OnTouchMove functions will be triggered at the same time. The logic of sliding in the webpage and the logic of clicking the button will be triggered at the same time, so it is necessary to make a judgment in OnMouseButtonUp to prevent the button event from being triggered.

virtual FReply OnTouchMoved(const FGeometry& MyGeometry, const FPointerEvent& InTouchEvent) override;

FVector2D clickpos;

clickpos = MouseEvent.GetScreenSpacePosition();

FVector2D vec = MouseEvent.GetScreenSpacePosition() - clickpos;
	if (!(FMath::Abs(vec.Y) < 1))
	{
		return FReply::Handled();
	}

FReply FWebViewBrowserViewport::OnTouchMoved(const FGeometry& MyGeometry, const FPointerEvent& InTouchEvent)
{
	FVector2D vec = InTouchEvent.GetCursorDelta();
	FString str = FString::Printf(TEXT("window.scrollBy(0,%f);"), vec.Y * -1);
	WebViewBrowserWindow->ExecuteJavascript(str);
	return FReply::Handled();
}