Connecting UI Slider to Material Instance Color(RGB Values)

Hello!
I have a quick question - I have a basic Menu UI blueprint with 3 slider’s the player can drag. And, I have an object with a Material Instance that has R, G, B values I want the player to be able to control with the sliders - I’m not sure how to set the blueprint for that up. I understand that I’m supposed to do something with a dynamic material instance blueprint, but I’m not sure what the web for that looks like :frowning: Here is a video describing my situation more clearly:

https://www.youtube.com/watch?v=eY6fw2qDR40

Thank you so much for your time and help!

-RS

As you mention, you’ll want to use a dynamic material.

In begin play, you’re just transforming a normal material into a dynamic version of itself.

Then whenever each of your sliders are updated, we set the dynamic material instance’s color. How you communicate between these is up to you, but one way is to pass a reference of that dynamic material into the UI.
Since both sliders and colors use a 0-1 scale, we can just directly use the value.
Here’s how we could set that up:


The set members in linearcolor node just allows us to easily change the Red value without changing anything else.


Feel free to ask any follow-up questions you may have- I’ll be happy to help

1 Like

!??! Thank you so much for the quick response Rokenrock!
I’ll try that immediately, do you mind sharing a screenshot of how you would augment this setup to include R, G, and B instead of just R?

Thanks again for your time and effort, I really appreciate it!

-RS

It’s already there, kind of, when you Set Members of any struct, you get to expose what is needed:

1 Like

Sorry- I passed out right after writing that.

To make it for R, G, and B, you just need to duplicate it for your other sliders and change which variable is being changed in the linear color.

Alternatively, a much cleaner option:

1 Like

Awesome, thank you so much for the amazing help!
I’ve gotten much farther now, but I’ve hit a little hiccup in the second step - Here’s what I got so far:
https://www.youtube.com/watch?v=GMFMzip0eqM
I think I’m just missing something small, but yeah I’m all ears as to what it could be, thank you again for your time!

No problem.

So the problem is that you’re using a different function. The functions you have laid out are for Material Parameter Collections. To get the right functions, you’ll want to drag off of the test material variable and search there.

Also, I recommend you go with the alternative setup:

Now as for how you’d get a material from that sphere to the UI is a bit more complicated. It’d be really easy if this was for the player, but it’s for a random sphere.
This is the part where you have to decide how you want to do it- the approach will change depending on the purpose of the sphere.

For now, I’ll suggest you just use the closest sphere. If you decide if you want to use an interaction system, you’ll want to change it to whatever you’re interacting with. This is a very backwards way of doing it as the UI shouldn’t be handling something like interaction, but this is the best way to show:


In tick, we simply find the closest sphere. An error will be thrown if we check against an invalid object, so we make sure ClosestSphere is set first.

Then back in the slider region, we instead use a variable inside that sphere. In your case, that would be DynaMatTest

2 Likes

It works! Thank you guys so much for your help! My question has been answered, and I really appreciate the help!

Hope you have a Fantastic Day!

All the best,

-RS

2 Likes

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.