Updating blur?

[ThinkTank]

Hi everyone, i have this blur code:

const var BlurPanel = Content.getComponent("BlurPanel");
BlurPanel.setPaintRoutine(function(g)
{ 
    g.beginLayer(true);
    g.boxBlur(33.0);  ///  0 To 100
    g.endLayer();
});

However theres a lot of knobs on top, and when i turn the knobs down, they become darker, making the blur look "off" with hard edges around the knobs. How would i update the blur effect every second (if thats not a perfomance issue)? or when i turn the knobs?

[Casmat]

@ThinkTank you would use a timer and put the blur in the callback

[ThinkTank]

@Casmat

What is the function for a timer callback?

Engine.setTimerCallback(onTimerCallback);

?

[Lindon]

@ThinkTank said in Updating blur?:

@Casmat

What is the function for a timer callback?

Engine.setTimerCallback(onTimerCallback);

?

there are two types of timer - one for the Ui and one that still runs even when the Ui is not visible - as you are using a blur here - you want the UI timer...look up Panel timers.

[aaronventure]

@ThinkTank yeah but do it for the panel, it's the same method. The panel timer is bypassed when the GUI is closed which prevents you from doing silly things.

have the timer and your knob change a variable, and have the blur reference that variable.

don't forget to call repaintImmediately() with the timer.

[ThinkTank]

@aaronventure
@Lindon
Thanks!

[ThinkTank]

This works:

// BLUR IT 
const var BlurPanel = Content.getComponent("BlurPanel");

// Define the paint routine for the BlurPanel
BlurPanel.setPaintRoutine(function(g)
{
    // Start a new layer for the blur effect
    g.beginLayer(true);

    // Apply the blur effect
    g.boxBlur(33.0); // Adjust the blur amount as needed

    // End the layer, which applies the blur
    g.endLayer();
});

// Implement the onTimer callback for BlurPanel
BlurPanel.setTimerCallback(function()
{
    // Trigger a repaint on the BlurPanel to update the blur effect
    BlurPanel.repaint();
    BlurPanel1.repaint();
    BlurPanel2.repaint();
});

// Start the timer with a desired interval (in milliseconds)
BlurPanel.startTimer(30); // Adjust the interval as needed



const var BlurPanel1 = Content.getComponent("BlurPanel1");
BlurPanel1.setPaintRoutine(function(g)
{ 
    g.beginLayer(true);
    g.boxBlur(33.0);  /// 0 To 100
    g.endLayer();
});

const var BlurPanel2 = Content.getComponent("BlurPanel2");
BlurPanel2.setPaintRoutine(function(g)
{ 
    g.beginLayer(true);
    g.boxBlur(33.0);  ///  0 To 100
    g.endLayer();
});

This seems to work fine here, if anyone new to hise needs something like this.
Probably not the most efficient way though

[Matt_SF]

@ThinkTank why not repaint() directly into the knob's CB?

[ThinkTank]

@Matt_SF

I think there is about 12 knobs, and some other elements that is getting messed up.
So, this seems easier.