En este artículo, vamos a ver cómo bloquear el volteo escalando un Itext de lienzo usando lockScalingFlip Property FabricJS. Para que no se pueda invertir tirando del ancho hacia el lado negativo. El lienzo Itext significa que Itext es móvil y se puede estirar según los requisitos. Además, el Itext se puede personalizar en lo que respecta al color del trazo inicial, la altura, el ancho, el color de relleno o el ancho del trazo.
Para hacerlo posible, vamos a utilizar una biblioteca de JavaScript llamada FabricJS. Después de importar la biblioteca usando CDN, crearemos un bloque de lienzo en la etiqueta del cuerpo que contendrá nuestro Itext. Después de esto, inicializaremos las instancias de Canvas e Itext proporcionadas por FabricJS y bloquearemos el volteo escalando el Itext usando la propiedad lockScalingFlip y representaremos el Itext en el Canvas como se muestra en el siguiente ejemplo.
Sintaxis :
fabric.Itext(Itext, {
lockScalingFlip: boolean
});
Parámetros : esta función toma un solo parámetro como se mencionó anteriormente y se describe a continuación.
- lockScalingFlip: Es un valor booleano que especifica si bloquear o no el flipping escalando.
Ejemplo : este ejemplo usa Fabric.JS para establecer la propiedad lockScalingFlip del lienzo Itext como se muestra en el siguiente ejemplo.
HTML
<!DOCTYPE html>
<html>
<head>
<!-- FabricJS CDN -->
<script src=
"https://cdnjs.cloudflare.com/ajax/libs/fabric.js/3.6.2/fabric.min.js">
</script>
</head>
<body>
<div style="text-align: center;width: 400px;">
<h1 style="color: green;">
GeeksforGeeks
</h1>
<b>
Fabric.js | Itext lockScalingFlip Property
</b>
</div>
<div style="text-align: center;">
<canvas id="canvas" width="400" height="200"
style="border:1px solid green;">
</canvas>
</div>
<script>
var canvas = new fabric.Canvas("canvas");
var geek = new fabric.IText('GeeksforGeeks', {
lockScalingFlip : true
});
console.log(geek.willDrawShadow())
canvas.add(geek);
canvas.centerObject(geek);
</script>
</body>
</html>
Producción:
Publicación traducida automáticamente
Artículo escrito por dheerchanana08 y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA