El enmascarado se utiliza para ocultar partes de una capa, generalmente un video o una imagen.
Las máscaras son especialmente útiles para dar marcos o formas personalizados a imágenes cargadas dinámicamente, como avatares de usuarios o publicaciones multimedia, donde no tienes la posibilidad de editar esas imágenes. También es muy útil dar a sus propias imágenes un aspecto personalizado, sin tener que editar las imágenes originales.
Encontrará la configuración de enmascarado en la propiedad Appearance de varios Building Blocks:
Máscara de área
Solo disponible para contenedores, este tipo de máscara ocultará todas las partes de todos los descendientes de contenedores que desborden los límites del contenedor en sí.
Máscara de área: desactivada
Máscara de área: activada
Máscara de gradiente
Este tipo de máscara utiliza un gradiente como capa de máscara.
A diferencia de los gradientes de fondo, el control de gradiente de la máscara no le permitirá cambiar los colores, sino solo la opacidad de cada paso del gradiente. Esto se debe a que los colores no hacen ninguna diferencia: lo importante es siempre la opacidad.
Máscara de gradiente aplicada a un elemento image
Máscara de imagen
Este tipo de máscara utiliza una imagen como capa de máscara. Más específicamente: utiliza el canal alfa de la imagen.
La imagen de la máscara funcionará siempre que tenga áreas transparentes. Los píxeles opacos de la imagen se convertirán en las partes visibles de su elemento y los píxeles transparentes se ocultarán.
Puede configurar lo mismo con respecto a la imagen de máscara que con las imágenes de fondo: modo de cobertura, mosaico y posición.
Máscara de imagen aplicada a un elemento image
Casos de Uso
Máscara de área
Máscara de área
En este ejemplo, agregamos una máscara a un contenedor y usamos la máscara para ocultar partes del fondo.
Puedes editar una máscara de área para restar de la región enmascarada.
También puedes definir la forma de su máscara cambiando las propiedades del contenedor, como ancho, alto, bordes, etc.
Máscara de gradiente
Máscara de gradiente
En este ejemplo, usamos una máscara de gradiente para ayudar a mezclar una imagen con otra.
La profundidad y la opacidad de la fusión se pueden ajustar así como el modo de fusión de la capa.
Máscara de imagen
Máscara de imagen
Los logotipos típicos tienen un relleno sólido y estático y se crean para colocarse encima del metraje.
En el ejemplo abajo, las máscaras de imagen le permiten reproducir imágenes dentro del contorno de su logotipo.
También puedes crear una máscara de imagen de forma que altere o interactúe con un clip existente en sus Gráficas para poner el nombre de un concursante, anfitrión, entre otros, como en este caso de uso.