Using "Bloom", how would I create a UI slider to adjust brightness of a glowing mesh material?

AdamCJ
AdamCJ Posts: 4
edited July 2023 in Programming #1

I'm using the "UI Slider" that comes with "User Interface Helper (UI System") by Snapchat, I just need the UI to connect to the brightness setting for my Bloom material. I hope this makes sense.

It seems to me that some scripting will be necessary. I'm new to this, so scripting is a bit beyond me, but if somebody does have some specific scripting instructions I'd be happy to attempt it.

Thanks in advance to anyone who tries to help out here

Best Answer

  • brandon
    brandon Posts: 15 🔥
    #2 Answer ✓

    The script would look like this:

    //@input Asset.Material bloomMaterial
    
    function onValueChange(val){
        script.bloomMaterial.mainPass.brightness = val * 10
        // multiplied by 10 because max bloom brightness is 10 not1
    }
    
    script.api.valueChanged = onValueChange
    
    

    Make a scene object, add a script component, add the script to it and import the bloom material on the script.
    Example setup image

    Click on the UI slider object and go to it's script component in the inspector. Choose the custom function event callback, select our script we just made as the custom function script (can drag and drop the object holding our script onto this spot as a fast method). Click add value under value changed category and add in "valueChanged" this must match exactly as it is the name of the function in the script, where it says script.api.valueChanged.

    Showing ui slider script component setup

Answers

  • AdamCJ
    AdamCJ Posts: 4
    edited July 2023 #3

    Wow, I didn't even see till yesterday that I'd gotten a response so sorry for the delay. I've got the thing working, it's the first piece of script I've tried that's worked at all so thank you very much!