TextBox宽度动态调整结构js

Question

我想根据用户输入的最长行动态地修改为文本框宽度。我初始化了我的画布的宽度=宽度，但是一旦用户退出编辑，宽度必须缩短为写入文本框的用户文本中最长行的宽度。

obj.on(("editing:exited"),function() { 
    can.setActiveObject(textBox); 
    var largest = Math.max.apply(Math, can.getActiveObject().__lineWidths); 
    can.getActiveObject().set("width",largest); 

}) 

问题是，每次我退出编辑时，宽度都会减小，顶端行会移到下面。我只是不知道发生了什么。请尽早提供帮助。提前致谢。请同时上传演示，以便我看到代码的效果。

更新1：如果我更改线路

can.getActiveObject().set("width",largest); 

到

can.getActiveObject().set("width",(largest + 1)); 

它可以根据需要。我不知道为什么会发生这种情况。

Answer 1

我已经通过一些编码自己找到了这个问题的答案。

https://jsfiddle.net/xpntggdo/8/

所有那些谁可能面临类似的问题，这里是小提琴，这里是代码。

textBox.on(("changed"),function(){ 
     var actualWidth = textBox.scaleX * textBox.width; 
     var largest = canvas.getActiveObject().__lineWidths[0]; 
     var tryWidth = (largest + 15) * textBox.scaleX; 
     canvas.getActiveObject().set("width",tryWidth); 
     if((textBox.left + actualWidth) >= canvas.width - 10) 
     { 
      textBox.set("width", canvas.width - left - 10) 
     } 
      canvas.renderAll(); 

    }); 

    textBox.on(("modified"),function(){ 
     left = textBox.left; 
     canvas.renderAll(); 

    });