文本框启用scaleY

Question

I'm creating a custom class that extends Textbox and It needs to have y scale enabled. It's y scale must have the same behavior as x scale to just change the element width/height not the fontSize.

But I have already checked the whole Textbox's code and can't find what to override to have this behavior.

Here is some code of what I'm doing:

https://fiddle.jshell.net/filiperoberto/zLz6cy2L/3/

Answer 1

I found a function at textbox_behavior.mixin.js in fabricjs that changes textbox scale behavior, I extended that function on my custom element to have the expected behavior.

*Still needs some work

(function(){
    var setObjectScaleOverridden = fabric.Canvas.prototype._setObjectScale;

    fabric.Canvas.prototype._setObjectScale = function(localMouse, transform,lockScalingX, lockScalingY, by, lockScalingFlip, _dim) {

        var t = transform.target;
        if (t instanceof fabric.FeedText) {
            var w = t.width * ((localMouse.x / transform.scaleX) / (t.width + t.strokeWidth));
            var h = t.height * ((localMouse.y / transform.scaleY) / (t.height + t.strokeWidth));
            if (w >= t.getMinWidth() && h >= t.minHeight) {
                t.set('width', w);
                t.set('height',h);
                return true;
            }
        }
        else {
            return setObjectScaleOverridden.call(fabric.Canvas.prototype, localMouse, transform,
                lockScalingX, lockScalingY, by, lockScalingFlip, _dim);
        }
    };
})();