Creating a Fluid surface with Blueprints and Render Targets

How-To use Blueprints and Render Targets to create realtime fluid surface Actor.

Windows
MacOS
Linux

FS_Header_Image.png

Using Blueprints and Render Targets, you can create a fluid surface that simulates what happens to water when it is hit by a projectile or player. In the following guide we will learn how you can use Blueprints & Render Targets to create a fluid surface actor by creating a new set of render targets and Materials that are specifically setup to work with render targets. We will then create and setup a new Blueprint that will contain and power the fluid surface interaction when the fluid surface is touched or shot at.

Part of this guide uses the same assets created in the Creating a Height Field Painter with Blueprints and Render Targets How To guide. If you have not completed the Creating a Height Field Painter with Blueprints and Render Targets How To guide, please do so before starting this one. You can also find this example map in the Content Example project that can be downloaded from the Learn tab of the Epic Games launcher.

1 - Project Setup

In this section, we will go over how to set your project up so that you can create a fluid surface Blueprint.

The project setup for the Fluid surface is the same as for the Height Field Painter. If you have not done so, read the Project Setup section of the Creating a Height Field Painter with Blueprints and Render Targets How To guide. When completed you should now have a new Game Mode and HUD. When you run the project, you should see something similar to the image below.

HFP_PS_07.jpg

In the next section we will take a look at creating all of the required assets to create a Fluid Surface Blueprint.

2 - Required Asset Creation & Setup

For the fluid surface to function correctly, we are going to need to create some new assets. We'll also use some assets created for the Height Field Painter. In the following section, we will go over how each of these assets needs to be setup and any special properties that you will need to use.

Render Target Creation & Setup

For the fluid surface to function correctly, we will need to create four new Render Targets by right-clicking in the Content Browser and from the menu that is displayed, go to Create Advanced Asset > Materials & Textures to select the Render Target option.

HFP_RT_Creation_00.png

Once you have created four new Render Targets, give them the following names:

  • Height0

  • Height1

  • Height2

  • HeightfieldNormal

FS_Render_Targets.png

Material Creation & Setup

For the fluid simulation to work, we are going to need to create two new Materials; one Material for the water, and one Material for the heightmap simulation. To create these Materials, right-click in the Content Browser and from the Create Basic Assets list, select the Material option.

Do not forget to Compile and Save your Blueprint so that it can be used.

  • WaterMaterial is what makes the surface look and act like water. Before you start to build WaterMaterial, make sure the following options have been set in the Details panel for the WaterMaterial.

    • Blend Mode: Translucent

    • Lighting Mode: Surface Translucency Volume

    • Used with Static Lighting: True

    • Uses Distortion: True

    • Refraction Mode: Pixel Normal Offset

    Copy Expression Graph

    FS_Water_Material.png

  • The HeightSim Material is used to propagate the various waves that happen when you shoot at the surface of the fluid simulation. Before you start to build the HeightSim Material, make sure the following options have been set in the Details panel for the HeightSim Material.

    • Shading Model: Unlit

    • Allow Negative Emissive Color: True

    Copy Expression Graph

    FS_HeighSim_Material.png

  • The ComputeNormal Material is used to create the normals that are needed for the water surface. Before you start to build the ComputeNormal Material, make sure the following options have been set in the Details panel for the ComputeNormal Material.

    • Shading Model: Unlit

    • Allow Negative Emissive Color: True

    Copy Expression Graph

    FS_ComputeNormal_Material.png

  • The MAT_ForceSplat is used to determine where the impact happened and how big the impact was. Before you start to build the MAT_ForceSplat Material, make sure the following options have been set in the Details panel for the MAT_ForceSplat Material.

    • Blend Mode: Additive

    • Shading Model: Unlit

    • Allow Negative Emissive Color: Checked

    Copy Expression Graph

    HFP_Material_Creation_03.png

    The MAT_ForceSplat Material is the same Material that was used in the Height Field Painter. If you have already created this Material, feel free to use that one.

With the necessary assets now setup, in the next section, we will take a look at how each piece fits togther to create the Fluid Surface Blueprint.

3 - Blueprint Setup

Now that the required Materials and Render Targets have been created and setup, it is now time to create a new Blueprint and configure it to work as the fluid surface Actor.

Blueprint Creation & Variable Setup

  1. Right-click in the Content Browser and from the menu in the Create Basic Asset section, click on the Blueprint Class option.

    HFP_BP_Setup_00.png

  2. From the Pick Parent Class window, select Actor, naming it WaterSurface_BP.

    FS_Water_BP_Creation.png

  3. Double-click on the WaterSurface_BP to open it up and then add the following variable types.

    FS_Var_Creation.png

  4. Now, set the variables to the following default values:

    Variable Name

    Variable Type

    Default Value

    WaterMeshAsset

    Static Mesh

    SM_Plane1000_512 (Included in the Content Example Maps)

    WaterMaterial

    Material Interface

    WaterMaterial

    HeightState

    Integer

    0

    TimeAccumulator

    Float

    0.0

    WaterMID

    MaterialInstanceDynamic

    N/A

    UpdateRate

    Float

    60.0

    TouchingCharacter

    Actor

    N/A

    LastTouchingActorPosition

    Vector

    0, 0, 0

    InteractionDistance

    Float

    1.0

    MouseDown

    Bool

    Un-Checked

Blueprint Function Creation & Setup

Now that the Blueprint has been created with its required variables, it is now time to create some functions. In the following section, we will go over what the three functions are and how you go about setting them up.

Do not forget to Compile and Save your Blueprint so that it can be used.

  • The GetHeightRT function will get and store the height of the render target so that it can be used later. Before you start to create this function, make sure you setup the function's Inputs and Outputs with the following information.

    • Inputs:

      • Name: Index

      • Type:Integer

    • Outputs:

      • Name: Heigh RT

      • Type:Texture Render Target 2D

      Copy Node Graph

      FS_Get_Height_Function.png

      Do not forget to add each of the three render targets to the Height RT inputs on the Return Node.

  • The GetLastHeight function will store the last known height for the fluid surface for later use. Before you start to create this function, make sure you setup the function's Inputs and Outputs with the following information.

    • Inputs:

      • Name: CurrentHeightIndex

      • Type:Integer

      • Name: NumFramesOld

      • Type:Integer

    • Outputs:

      • Name: Heigh RT

      • Type:Texture Render Target 2D

      Copy Node Graph

      FS_Store_Last_Height.png

  • Trace From Camera is the same trace that was used in the Height Field Painter Blueprint. For this function, there are no input or output variables that need to be setup.

    Copy Node Graph

    HFP_BP_Setup_05.png

Blueprint Construction Graph Setup

The Construction Graph is used to create and set both of the Static Meshes and Materials that fluid simulation needs to function correctly. In the following section, we will go over what the three functions are, and how you go about setting them up.

Do not forget to Compile and Save your Blueprint so that it can be used.

  • In the Construction Graph, we are going to create a Static Mesh that is needed for the water surface and then create and apply a Dynamic Material Instance to that Static Mesh, which will simulate the water's surface.

    Copy Node Graph

    FS_Con_Script.png

Blueprint Event Graph Setup

The Event graph is where everything that is needed for this effect to work correctly is added and connected. In the following section, we will go over what each section of the Event Graph does and how it affects the final Blueprint that is placed in the world.

Do not forget to Compile and Save your Blueprint so that it can be used.

  • Clear all render targets of data is the part of the Blueprint that clears all of the render targets of any previous data that they might contain in order to ensure that no artifacts appear the first time the Blueprint is run.

    Copy Node Graph

    FS_Clear_All_RT.png

    Do not forget to add each of the three render targets to the *Height RT** inputs on the Return Node.

  • Check to see if Left Mouse Button is held down is the part of the Blueprint that checks to see if the user has the Left Mouse Button held down or not. If the user has the Left Mouse button held down, the MouseDown is set to true; otherwise, it is set to false.

    Copy Node Graph

    FS_Check_If_Left_Mouse.png

  • The Take Damage Force section finds the location on the Static Mesh that was hit and applies the ForceSplat Material to that section so that it can offset the surface that is simulating an impact event.

    Copy Node Graph

    FS_Take_Damage_Force.png

  • The Begin & End Overlap section checks to see if the player is currently touching the fluid surface Actor that has been placed in the world or not.

    Copy Node Graph

    FS_Begin_End_Overlap.png

  • Shoot when mouse is down is the part of the Blueprint that checks each Tick to see if the Left Mouse button is held down. When the Left Mouse button is held down, the Trace From Camera function is called, which traces from the center of the camera into the world.

    Copy Node Graph

    FS_Shoot_When_Mouse_Is_Down.png

  • Touching Character Force is the part of the Blueprint that is responsible for applying and updating the force that is applied to the fluid surface Actor when a player is touching it.

    Copy Node Graph

    FS_Touching_Char_FOrce.png

  • Fixed timestep, so fluid speed is framerate independent is the part of the Blueprint that makes sure that the propagation of the waves through the fluid surface has a frame rate that is not tied to the frame rate of the project. Essentially, the waves in the fluid surface will not slow down or speed up based on what is currently happening in the level.

    Copy Node Graph

    FS_Fixed_Time_Step.png

  • Cycle Active heightfield is the part of the Blueprint that cycles through the various render targets for the fluid surface so that the fluid surface has a more dynamic look when shot or touched.

    Copy Node Graph

    FS_Cycle_Active_Heightfield.png

  • Apply fluid surface simulation kernel, which propagates waves is the part of the Blueprint that handles the propagation of the waves through the fluid surface Actor making it look like the waves die out over time.

    Copy Node Graph

    FS_ApplySim.png

  • Compute Surface Normal is a section of the Blueprint that applies a normal to the surface of the fluid which helps make the ripples more pronounced and easier to see.

    Copy Node Graph

    FS_Compute_Surface_Normal.png

Now that the Blueprints have been setup in the next section we will take a look at how to set all of this up for use in UE4.

4 - End Result

When all of the various pieces of the fluid surface Blueprint have been connected, and the fluid surface Blueprint has been compiled and saved, add it to a level. Once placed in a level, you can play the level and then interact with the fluid surface Blueprint by holding down the left mouse button to shoot at it or by walking over it with your character. Below are some videos that show both these types of interaction.

This video shows what happens when you shoot at the fluid surface Blueprint.

This video shows what happens when you walk over the fluid surface Blueprint with a Pawn-based character.

Copy Node Graph

FS_Completed_Blueprint.png

Here is a copy of the entire completed fluid surface Blueprint.

Welcome to the new Unreal Engine 4 Documentation site!

We're working on lots of new features including a feedback system so you can tell us how we are doing. It's not quite ready for use in the wild yet, so head over to the Documentation Feedback forum to tell us about this page or call out any issues you are encountering in the meantime.

We'll be sure to let you know when the new system is up and running.

Post Feedback