defaultTexts y defaultImages – Angular

Los componentes que genera WCF tienen como fuente componentes diseñados en Figma o código creado en HTML. En cualquiera de los dos, los componentes tienen textos, imágenes, placeholders y vínculos que permiten visualizarlos y utilizarlos.

Naturalmente, la finalidad de un componente es cambiar dinámicamente los valores de estos atributos, en función del contexto, las interacciones del usuario y otros elementos relevantes. Para ello, WCF transforma automáticamente en la generación del componente estos atributos en Inputs, de modo de que tengan el comportamiento esperado.

A cada un de estos Inputs le asigna como valor por omisión el que tenía en el diseño, haciendo que al desplegar (rendering) el componente se vea exactamente igual que en el origen, sea este Figma o HTML. Así se ven por ejemplo cuando se utiliza la app-demo.

Este comportamiento, muy útil a la hora de pasar el diseño a código ejecutable, se vuelve molesto en producción, ya que los componentes de despliegan con textos e imágenes que muchas veces no tienen nada que ver con lo que realmente hay que desplegar. Por ejemplo, es usual en diseño incluir un número de tipo 999.999.999 para llenar un espacio, pero no tiene sentido que al desplegarse el usuario lo reciba así.

A esto se suma que muchas veces los textos e imágenes provienen de servicios en línea que tienen tiempos de respuesta mayores a los del despliegue, por lo que la pantalla queda un tiempo suficiente con los textos que no corresponden como para generar un efecto bastante desagradable.

Para resolver este problema, se incluyen en todos los componentes dos Inputs: uno para deshabilitar los textos por omisión y otro para las imágenes por omisión, denominados defaultTexts y defaultImages respectivamente.

Cuando defaultTexts no tiene el valor “on”, el texto se reemplaza por un espacio y por CSS se le da el tamaño que tenía el texto original, con la intención de que el componente no cambie de tamaño cuando reciba el valor correspondiente. Lo mismo sucede para defaultImages: se asigna una imagen vectorial transparente y se le da el tamaño original.

El valor por omisión de defaultTexts y defaultImages es “off”, y este valor se transmite a todos los subcomponentes, tanto en la inicialización como en ejecución. El valor se puede alterar tanto incluyendo el atributo en el tag del componente como utilizando el servicio WcfSubcomps.


Comments

Leave a Reply

Your email address will not be published. Required fields are marked *

8 + 3 =