如果使用中间顶部,中间左侧等控制点,则可以缩放该轴中的对象。但是如果你使用角落,那么对象总是统一缩放。有没有办法在角点控制点上禁用均匀/比例缩放?
答案 0 :(得分:12)
解决方案是在uniScaleTransform
实例上将true
设置为fabric.Canvas
。它是absolutely not obvious from the Fabric.js documentation,只在对象转换部分的Introduction, Part 4中提及一次
自1.0版以来,Fabric 中还有许多其他与转换相关的属性。其中之一是“uniScaleTransform”。它默认为
false
,可用于启用对象的非均匀缩放;换句话说,它允许在通过角落拖动时更改对象的比例。
您可以在实例化期间设置标志:
var fabric = new fabric.Canvas(canvasEl, {
// ...
uniScaleTransform: true
});
或稍后更改:
fabric.uniScaleTransform = true;
lockUniScaling
since fabric.js v1.1.9
的对象会忽略该标记。
相关的源代码:
_onScale: function(e, transform, x, y) {
// rotate object only if shift key is not pressed
// and if it is not a group we are transforming
if ((e.shiftKey || this.uniScaleTransform) && !transform.target.get('lockUniScaling')) {
transform.currentAction = 'scale';
this._scaleObject(x, y);
}
else {
// Switch from a normal resize to proportional
if (!transform.reset && transform.currentAction === 'scale') {
this._resetCurrentTransform(e, transform.target);
}
transform.currentAction = 'scaleEqually';
this._scaleObject(x, y, 'equally');
}
},