Matrix Modulation Feedback

Christoph Hart

Orvillain

I'm trying to do this:

inline function setupModulationControlPanelLAF(numDraggers)
    {
        Console.print("rescaling triggers the setupModulationControlPanelLAF, and UI_SCALE is: " + SharedData.UI_SCALE);
        local wPct = 100.0 / numDraggers;
        local fontPx = Math.round(12 * SharedData.UI_SCALE);
        Console.print("fontpx is: " + fontPx);
        local laf = Content.createLocalLookAndFeel();
        laf.setInlineStyleSheet("
            
        #controller
        {
            display:flex;
            flex-wrap:nowrap;
            align-items:center;
            width:100%;
            padding:0;
            gap: 2px;
            border-radius:0;
            background:#333;
            overflow:hidden;
        }
        
        .control-button
        {
            display:none;
        }

        .dragger
        {
            display:block;
            flex:0 0 " + wPct + "%;
            width:" + wPct + "%;
            height:100%;
            min-width:0;
            box-sizing:border-box;
            white-space:nowrap;
            overflow:hidden;
            text-overflow:ellipsis;
            text-align:center;
            background-color:rgba(76, 76, 76, 1);
            opacity: 0.8;
            font-size:" + fontPx + "px;
        }

        .dragger::before
        {
            content: '';	
            background-color: white;
            background-image: var(--dragPath);
            width: 24px;
            margin: 2px;
        }

        .dragger:checked
        {
            background-color:rgba(255, 0, 0, 1);
            opacity: 1.0;
        }

        ");

        local tile = Content.getComponent("ft_modcontroller");
        tile.setLocalLookAndFeel(laf);
    }

This function is called at init, but is also called when I rescale my UI (which is all code that definitely works) ... but my font doesn't resize.

The flex and width of the draggers does seem to update. So I think I'm doing the right technique???

Orvillain

Or maybe I'm better off making custom panels with callbacks, and doing all of the scaling stuff I want to do inside regular LAF, rather than css ??

Orvillain

@Orvillain I solved my issue by making my font size a percentage of the dragger, but it was a bit weird. Everything I tried simply would not update the font size. Even doing a setStylePropertyblahblahblah call on the LAF object didn't work.

Christoph Hart

@Orvillain wait, how do you rescale your UI? Settings.setZoomFactor() should scale all fonts correctly.

Orvillain

@Christoph-Hart said in Matrix Modulation Feedback:

@Orvillain wait, how do you rescale your UI? Settings.setZoomFactor() should scale all fonts correctly.

No I'm not doing that. I have a custom scaling namespace that does a bunch of math, but ultimately what it does is update the properties of any UI widge - so x, y, w, h, fontSize, etc etc.

This kind of thing:

    inline function rescaleAll()
    {
        // Order of operations:
        // Resize interface
        // Re-apply panel bounds
        // Re-apply control bounds
        // Re-apply control style props (font, radii, etc.)
        // Reposition zoom handle

        // Resize the window
        Content.makeFrontInterface(SharedData.getScaledWidth(), SharedData.getScaledHeight());

        // Panels first (so parents are sized before children)
        for (i = 0; i < _layout.length; i++)
            _applyScaledBounds(_layout[i]);

        // Controls: bounds then props
        for (i = 0; i < _controls.length; i++)
        {
            _applyScaledBounds(_controls[i]);
            _applyScaledProps(_controls[i]);
        }

        LogicalZoom.onRescaled();
    }

Effectively, I'm scaling everything manually. Not using the automatic zoom factor way to do it. I don't have a reason other than coder ego!!

And this all works fine, but setting the font-size property in the modulation controller didn't seem to update in any of the ways I tried.

Christoph Hart

@Orvillain now you have another reason. Also all dialogs / other inbuilt components will not scale correctly like this.

Orvillain

@Christoph-Hart said in Matrix Modulation Feedback:

@Orvillain now you have another reason. Also all dialogs / other inbuilt components will not scale correctly like this.

Ah cool beans. Yeah that was trivial to implement in my existing code, and actually makes the whole thing a lot simpler. Sorry, I thought the whole thing was originally a bug to do with the matrix mod controller and how it processed css - hence tagging onto this thread!

The only slight loss is, my approach was working inside HISE directly, without having to compile the plugin in order to double check zoom/rescale performance.

Christoph Hart

@Orvillain You can still check this within HISE - basically the zoom factor in the interface designer does exactly that and if you want to check the actual behaviour with the zoom setting set by the user you can use a second floating tile window that you add a "Main Interface" to - this respects the zoom setting (unlike the popup interface that appears when you click on the house button).

Orvillain

@Christoph-Hart Good to know, cheers!!

DanH

@Christoph-Hart What are the modulationDrag states please?

DanH

@Christoph-Hart I have some Macro knobs on the UI. I'm hoping to be able to modulate them with other modulators, however currentIy I can assign a Macro to itself

DanH

@Christoph-Hart last one for now

If a modulator has a connection is there a method to display this in css / laf?

Screenshot 2025-09-11 at 11.17.00.png

ustk

@DanH You just add it in the Global Mod Container

Screenshot 2025-09-11 at 13.16.08.png

ustk

@DanH said in Matrix Modulation Feedback:

@Christoph-Hart What are the modulationDrag states please?

0 -> nothing happens
1 -> itemDragEnter
2 -> itemDragExit

DanH

@ustk yes exactly, but we don't want Macro 1 assigned to Macro 1 do we?!

So perhaps there's a way to remove the Modulator from the list if you're trying to connect it to itself.

ustk

@DanH No, why would you lol. There are not in the target list if you don't assign a matrixTargetId
The way I understand it is that you don't want them to be "modulatable", you just assign a macro + another modulation to the parameters, and it has the same effect

DanH

@ustk Modulating a Macro can be useful though... :)

ustk

@DanH I agree with this, but then it is a design choice. I prefer to see macro as a modulator than "something else" aside the modulation part. It seems easier for me to understand and use, but my practice of modulation and macro is very limited...

I'd just say that in a plugin, I prefer to keep related things in one place so it better fits my vision to have marco like modulator

Perhaps it is possible to have two sets of modulators, so one can modulate another? I don't know...

Christoph Hart

@ustk you can modulate a modulator by assigning a matrixTargetId to the UI knob of any modulator parameter.

Matrix Modulation Feedback

35

2.0k

12.7k

110.1k