UE4 - How to scale a texture or material given 4 screen coordinates?

Question

I am trying to replicate the portal shown in this video: https://youtu.be/_SmPR5mvH7w?t=245 .

And more specifically the implementation of the concept: "What our portal camera currently sees is this, but what our camera actually should see is this"

Right now I have a SceneCaptureComponent2D that renders to a Render Target which is hooked up to the material shown in the image below.

Link to image showing my material.

The white square with the four red corners shown in the image is the back side of the portal (currently visible for debugging reasons).

What I want to do is to take that white square and scale it up to cover the entire material. Given the screen coordinates of those red corners. Is there a way to scale the image such that those corners is now placed in coordinates (0,0), (0,1), (1,0) and (1,1) of the material or texture?

The CapureComponent moves around the sceen in relation to the player so this needs to be done in runtime and account for viewing the white square at an angle, making the coordinates diagonal in relation to each other. I've tried previously with changing the material UV and multiply an offset so that I kind of zero in on the white square, but did not manage to make it diagonal to fit only the square when viewed at an angle.

Do I change the camera, the texture or the material? Any help is appreciated!

Answer 1

No idea how it works but the blueprint node ScreenAlignedUVs is pure magic and solved it!