How to make a slideshow on a StaticMeshComponent in BluePrint?

Hello!

Is there a way to make a slideshow on a StatichMeshComponent in BluePrint? I want to display a slideshow for the player/user in the world, of different pictures, but I just can’t come up with a solution.

It should be like a list / array of images that you switch between with BP. I’m thinking, to switch the materials that you can get from the images with some SetMaterial, or something similar, on a StaticMeshComponent.

Do you guys have any solutions?

Thanks in advance!

  • have a material with an exposed parameter

  • create a dynamic material instance (top)

  • use a timer to iterate through the array and feed its element to the material instance (bottom)

Would that work for you?

Image from Gyazo

Wow, thanks for the reply. I didn’t expect that. But what do you mean by “have a material with an exposed parameter”? And you only create that material once, right? Not one for every image.

Another qustion, in the second picture (in the Blueprint), you have a “Set” node in-between “Create Dynamic Material Instance” and “Set Timer By Event”. What Set node is that? There are so many different types of Set nodes.

I can also see that you’ve created variables “Images” and “Next Image”, right? And is the Images variable of type “Texture2D, Object Reference” or “Texture2DArray, Object Reference”?

I can’t bring up the Array elements when trying to create a “Texture2D, Object Reference” variable. I can only choose one picture there.

“have a material with an exposed
parameter”? And you only create that
material once, right? Not one for
every image.

Once is enough, instanced dynamic materials can be modified during run-time. So you get away with having 1 material and pipe in data modifying it. You can create a texture parameter by holding ‘t’ and left clicking in the graph, then right click that node and convert it to a parameter - the name is important, we’ll use it later to send a texture this material will use:

You will need to give the parameter a default texture value in the details panel; otherwise, it will complain.

you have a “Set” node in-between

One can Get (read from) or Set (write to) variables. In this very case, the DMI (named after Dynamic Material Instance) holds a reference to an instance of a dynamic material we’ve just created. I’m setting this variable to the return value of the Create Dynamic Material Instance node - we need to access this material later on in order to send it a new texture to use. A reference like this allows for it.

An easy way to to create reference of the correct type, is to right click a pin and Promote to Variable:

319294-prmo.jpg

And is the Images variable of type
“Texture2D, Object Reference” or
“Texture2DArray, Object Reference”?

It’s an array of Texture 2D:

319293-images.jpg

I can’t bring up the Array elements
when trying to create a “Texture2D,
Object Reference” variable. I can only
choose one picture there.

You will need to turn this variable into an array. The first red dot above.

I can also see that you’ve created
variables “Images” and “Next image”?
Right? And are they both located
within the BP of the aDisplay?

Yup, it’s all self contained. This way you can have many actors, each with an array of unique images cycling them at different speeds.

Thank you so, so, so much for your comprehensive answers and careful descriptions. How little would I know thatm in order to create a reference to the correct type, is by right-clicking the pin and press “Promote to Variable”. Thanks bud!

the Your “Next Image” variable, is it an integer? I tried to use integer as the variable type, but it then asks for a default value (starts automatically with 0) when I want to add a Set (Next Image) node. I can’t see that you have done that.

It’s an integer, yes. The timer fires once per second and increases this int by 1 (++), the modulo (%) wraps this value back to 0 when we reach the end of the array.

In the end you’re getting a [0,1,2,3,4] sequence and the int pulls the appropriate element from the array which is then pushed into the material.

Thank you so much for all your help. You made my day. Wish you all the best.

That’s awesome! Thank you for your tutorial. How would you add Fading from one Image to the next to this one?

Great tutorial! How do you add a fade between the Images to this one?

You’d need 2 texture samples in the material. Instead of pushing 1 texture, you push in 2.

Promote the Timer return value to a variable and use the handle’s elapsed / remaining time to drive the alpha in the material.

That should be it, I think.

Thanks for your help! I will try to get it to work. Take care!

Lerp between 2 textures.

So I create a second “ImageToShow” and lerp them and animate the Alpha? But where and how do I connect it into the blueprint?

I changed the setup a bit so I can use keyboard commands to go back and forth between the images.
I promoted the lerp(Blend) Value and will use the set scalar parameter value to drive it, right?
I don’t know how and where to connect it though…
Thanks for replying so fast =)

I did it like this:

320260-screenshot-2020-10-27-112301.jpg

Image from Gyazo


But you must be super close; if you want a smooth transition, you will need to generate alpha somehow. A timer is a good option as it gives you plenty of control and it can be then sampled on Tick.

In your case, a timeline would work better, actually!

There might be a better way but this seems to work ok, providing the goal is to cycle through the content both ways:

In short, figure out the Current | Next array elements needed depending on the direction, pull them out of the array and push them into the material.

You may need to find a better way to handle the initial numbers.

Thanks! I will give it a try.