angular - Ako zabrániť škálovaniu textu pri zmene veľkosti textového poľa pomocou fabricjs
Som nováčikom vo FabricJs a moja obava sa týka zmeny veľkosti textového poľa - mám nasledujúce riešenie, ktoré umožňuje meniť veľkosť textového poľa vertikálne aj horizontálne, ale nie súčasne. Snažil som sa nájsť riešenie, ktoré umožní oboje naraz bez zmeny veľkosti textu. Môžete mi prosím pomôcť nájsť riešenie?
Tu je odkaz na môj príklad v jsfiddle: http://jsfiddle.net/vstefani/s7yfu93w/27/
var canvas = new fabric.Canvas('canvas');
canvas.setWidth(500);
canvas.setHeight(500);
var myText = new fabric.Textbox("Some text", {
width: 100,
height: 100,
top: 100,
left: 100,
fontSize: 20,
textAlign: 'center',
fontFamily: 'Arial',
padding: 2,
});
canvas.add(myText);
let lastHeight: number;
const updateTextSize = () => {
const controlPoint = myText.__corner;
if (controlPoint && controlPoint !== 'mr' && controlPoint !== 'ml') {
lastHeight = myText.height * myText.scaleY;
}
myText.set({
height: lastHeight || myText.height,
scaleY: 1,
});
};
myText.on('scaling', updateTextSize);
myText.on('editing:entered', updateTextSize);
myText.on('text:changed', updateTextSize);
Odpoveď č. 1
Zdá sa, že body ovládania 'mr' a 'ml' nie sú spúšťané udalosťou 'scaling', ale udalosťou 'resizing'.
Riešením (ktoré funguje pre mňa) je pridať :
textbox.on('resizing', updateTextSize);
