Textbox enable scaleY

时间:2016-07-11 20:12:25

标签: javascript fabricjs

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/

1 个答案:

答案 0 :(得分:0)

我在fabricjs的textbox_behavior.mixin.js中找到了一个更改文本框比例行为的函数,我在自定义元素上扩展了该函数以获得预期的行为。

*仍需要一些工作

(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);
        }
    };
})();