Download

Background Blur on mobile and alternatives?

Development Discussion Rendering
#1

Hi
I’m wondering if there is any possibility to get the BackgroundBlur working on mobile devices or are there working alternatives?
The widget itselfs uses the FSlateDrawElement::MakePostProcessPass() function but that results always as black on mobile devices…

My current “solution” imitates the blur by having an UI Domain Material (which blurs the input texture with a kawase blur or spiral blur on high end devies) which is a render scene capture 2d. But obviously the whole UI is not going to be captured (any solution to this? any hidden c++ function to capture the whole viewportclient/renderer what so ever to get all visible pixels 3d and UI?

Appreciate every input!

[RIGHT]sidenote: Also having that question on answerhub [How to take Screenshot of viewport or get pixels to imitate BackgroundBlur Widget - UE4 AnswerHub][/RIGHT]

#2

So far I think I have the solution, it’s
FSlateApplication::Get().TakeScreenshot()
It makes a screenshot of UI and the 3d Scene. :slight_smile:


TArray<FColor> Bitmap;
bool bScreenshotSuccessful { FSlateApplication::Get().TakeScreenshot(GEngine->GetGameViewportWidget().ToSharedRef(), Bitmap, Size)};

FCreateTexture2DParameters Params;
Params.bDeferCompression = true;
Params.bSRGB = true;
Params.bUseAlpha = false;
Params.CompressionSettings = TextureCompressionSettings::TC_Default;

TArray<FColor> DstData;
FImageUtils::ImageResize(Size.X, Size.Y, Bitmap, Size.X / 4, Size.Y / 4, DstData, false);
UTexture2D* Tex { FImageUtils::CreateTexture2D(Size.X / 4, Size.Y / 4, DstData, PlayerController->GetGameInstance(), "DynamicTestImage", EObjectFlags::RF_Dynamic, Params)};

​​​​​DynImage = MakeShareable(
    new FSlateDynamicImageBrush(
        Tex,
        FIntPoint(Size.X, Size.Y),
        FName("DynamicImageTest"),
        FLinearColor(1.0f, 1.0f, 1.0f, 1.0f),
        ESlateBrushTileType::NoTile,
        ESlateBrushImageType::FullColor
   )
);

TestImage->SetImage(DynImage.Get());

It captues the game viewport downscales it by 4 creates an UTexture2D and displays it in an SImage, works currently fine in the Editor, but results in an crash on actual mobile devices. :frowning:
Still trying though.

// Edit:
The crash must relate to the resizing or creating a dynamic image brush.
But nevermind, FSlateApplication::Get().TakeScreenshot function is too costly for mobile (takes a whole sec on low end devices).

#3

For low-spec machines where the blur effect is too computationally expensive,
a user-specified fallback image is used instead (effectively turning this into a Border)

#4

4.26 will finally support SBackgroundBlur on Android (according to the github source), propably because of deprecating support of opengl es 2.0.