Establecer colores, pinceles y máscaras

El cambio de la apariencia visual de un objeto es una tarea fundamental en Microsoft Expression Blend. Mediante las propiedades de Apariencia y Pinceles del panel Propiedades puede cambiar el color del trazo, el color del relleno, la opacidad y la visibilidad de un objeto seleccionado. Según el tipo de objeto que seleccione en el proyecto de Expression Blend, las propiedades de las categorías Apariencia y Pinceles se ajustan dinámicamente al contenido del objeto para reflejar los atributos visuales correspondientes.

Propiedades comunes de apariencia

Una gran parte de los cambios de apariencia de un objeto tiene que ver con la aplicación de pinceles a propiedades concretas. En la siguiente tabla se describen estas propiedades.

Propiedad	Descripción
Fill	Establece el pincel que se aplica al interior de una forma o trazado.
Stroke	Establece el pincel que se aplica al contorno (borde) de una forma o trazado.
Background	Establece el pincel que se aplica al fondo de un objeto. Esta propiedad se suele aplicar al fondo de los controles que muestran texto, como el control Button o TextBlock.
Foreground	Establece el pincel que se aplica al primer plano de un objeto. Esta propiedad se suele aplicar al texto que se muestra en controles como Button o TextBlock.
BorderBrush	Establece el pincel que se aplica al borde de determinados controles.
Opacity	Establece la opacidad de todo el objeto.
Visibility	Determina si un objeto está visible u oculto en tiempo de ejecución. Los objetos secundarios también pueden verse afectados por la visibilidad del elemento primario.
OpacityMask	Establece un pincel cuyo color se omite y cuya opacidad se transfiere al objeto con máscara. Donde la máscara de opacidad sea opaca, el objeto con máscara será opaco; donde la máscara de opacidad sea transparente, el objeto con máscara será transparente.

Pinceles

Los pinceles se usan para establecer la apariencia visual de un objeto en la mesa de trabajo. Por ejemplo, puede usar un pincel azul sólido para el relleno de un rectángulo (como en la primera imagen a continuación). Los pinceles se incluyen con diversas formas, desde pinceles de color sólido simple o pinceles de degradado hasta pinceles de diseño en mosaico más complejos. En la tabla siguiente se describen los pinceles disponibles en Expression Blend. Además, puede usar Sin pincel para quitar todo el color de la propiedad seleccionada. Por ejemplo, para crear un contorno de un rectángulo, puede establecer el Relleno del rectángulo en Sin pincel y establecer el Trazo en un Pincel de color sólido.

Pincel	Apariencia			Descripción
Pincel de color sólido				Compuesto por un solo color.
Pincel de degradado lineal				Compuesto por una degradación de color lineal.
Pincel de degradado radial				Compuesto por una degradación de color radial.
Pincel de imagen				Creado a partir de una imagen. De izquierda a derecha, como se muestra aquí: el pincel de imagen inicial, el pincel de imagen en mosaico y el pincel de imagen volteado.
Pincel con dibujo				Creado a partir de un dibujo vectorial. De izquierda a derecha, como se muestra aquí: el pincel con dibujo inicial, el pincel con dibujo en mosaico y el pincel con dibujo volteado.
Pincel visual				Creado a partir de un control, por ejemplo, un botón. De izquierda a derecha, como se muestra aquí: el botón inicial y el pincel con el Modo de mosaico establecido en Mosaico. Tenga en cuenta que los pinceles visuales pueden reducir el rendimiento de la aplicación que se está ejecutando debido a la complejidad del control que se usa para crear dichos pinceles.

Recursos del pincel

Después de crear un pincel en un objeto, puede convertir el pincel en un recurso que puede aplicar más tarde a otros objetos.

Los recursos del pincel no se restringen a las propiedades de color o de un solo pincel. Puede crear un recurso del pincel mediante el uso de varios objetos en la mesa de trabajo. Puede incluso crear un pincel denominado VisualBrush, que actualiza su apariencia en tiempo de ejecución si los objetos a partir de los cuales se creó cambian en tiempo de ejecución.

Puede crear diccionarios de recursos para los pinceles para poder volver a usarlos en el proyecto o incluso en otros proyectos.

Para obtener más información, vea Crear un recurso de pincel o de color y Convertir objetos en un recurso de pincel reutilizable.

Para obtener información acerca de los recursos, vea Crear recursos reutilizables.

Color y espacios de colores

Expression Blend incluye un editor de colores en Pinceles, en el panel Propiedades. El editor de colores también aparece si modifica un recurso del pincel en el panel Recursos. El editor de colores tiene los cuatro espacios de colores siguientes, así como un modo hexadecimal (#AARRGGBB):

• RGB   rojo (0-255), verde (0-255), azul (0-255).

• HLS   matiz (rueda de colores de 360 grados), claridad (del 0 al 100 por ciento), saturación (del 0 al 100 por ciento).

• HSB   matiz (rueda de colores de 360 grados), saturación (del 0 al 100 por ciento), luminosidad (del 0 al 100 por ciento).

• CMYK   cian (del 0 al 100 por ciento), magenta (del 0 al 100 por ciento), amarillo (del 0 al 100 por ciento), negro (del 0 al 100 por ciento).

Para cambiar entre los espacios de colores, haga clic en una de las letras subrayadas en el espacio de colores actual para ver un menú emergente de los espacios de colores alternativos.

Herramientas Cuentagotas y Cubo de pintura

Expression Blend proporciona dos herramientas diseñadas especialmente para copiar y aplicar atributos entre los objetos. Las siguientes propiedades se copian o aplican durante las acciones Cuentagotas y Cubo de pintura:

• Pinceles   Foreground, Background, Border Brush, Fill, Stroke y Opacity Mask

• Apariencia   Opacity, Stroke Thickness, Stroke Miter Limit, Stroke Start Line Cap, Stroke End Line Cap, Stroke Line Join y Stroke Dash Cap

• Texto   Font Family, Font Size, Font Weight, Font Style, Text Decorations, Line Height, Text Indent y Text Alignment

	Herramienta Cuentagotas	Copia la apariencia de otro objeto en el objeto u objetos seleccionados actualmente.
	Herramienta Cubo de pintura	Copia la apariencia del objeto u objetos seleccionados actualmente en otro objeto.

Para obtener más información acerca las herramientas Cuentagotas y Cubo de pintura, vea Copiar o aplicar atributos a un objeto.

Un Cuentagotas de color  aparece también en la esquina inferior derecha del Editor de colores cuando se modifica un Pincel de color sólido  o un delimitador de degradado en un Pincel de degradado . Con este cuentagotas seleccionado, puede seleccionar una muestra de color de cualquier parte del escritorio y aplicarla al pincel seleccionado. Puede presionar la tecla ESC en cualquier momento para cancelar el cuentagotas.

Degradados

Los degradados permiten aplicar una combinación graduada de colores a un objeto para crear una degradación de color suave y proporcionar al objeto mayor profundidad. Quizás desee usar ese objeto como un fondo en el que la parte izquierda del objeto contenga un color sólido que se atenúe de forma gradual hasta el blanco en la parte derecha. Esto permite crear dos áreas distintas en un objeto que, de lo contrario, sería plano.

Haga clic en Pincel de degradadolineal y Degradado radial en Pinceles en el panel Propiedades, para cambiar entre los dos tipos de pinceles de degradado.

Puede usar los dos tipos de pinceles de degradado para crear rellenos degradados, trazos degradados, texto con un degradado para la propiedad Foreground o fondos degradados para cualquier elemento que tenga una propiedad Background. Al aplicar un degradado a una propiedad de apariencia, verá que en el control deslizante de degradado aparecen pequeños iconos , denominados delimitadores. Puede cambiar el color de cada delimitador de degradado y agregar tantos delimitadores como desee al control deslizante de degradado si hace clic en dicho control deslizante. También puede quitar fácilmente delimitadores que ya no necesite. Para ello, debe arrastrarlos fuera de la parte inferior del control deslizante de degradado (arrastrar los delimitadores fuera de los laterales o del borde superior del control deslizante no los quita).

También puede establecer algunas opciones cuando use un pincel de degradado. Haga clic en Opciones avanzadas de la propiedad , en Pinceles, en el panel Propiedades, para establecer la propiedad SpreadMethod en una de las opciones siguientes:

• Relleno   Extiende los colores de los delimitadores de degradado de los extremos a los bordes del objeto.

• Reflejar   Crea un reflejo del relleno de degradado.

• Repetir   Repite el relleno de degradado.

Estas opciones funcionan en los pinceles de degradado lineales y radiales cuando se usa Transformación del pincel para modificar el pincel. Para obtener más información, vea la sección "Herramienta Transformación del pincel" a continuación.

Herramienta Transformación del pincel

Para transformar el relleno, el trazo, la máscara de opacidad u otro pincel que se aplique a un objeto, seleccione la propiedad de pincel en el panel Propiedades y, a continuación, seleccione Transformación del pincel en el panel Herramientas. De este modo aparecerá una flecha de transformación del pincel en la mesa de trabajo que puede modificar con el puntero del mouse. Si está usando un pincel de degradado, los puntos finales de la flecha de transformación se corresponden con los delimitadores de degradado de cualquier extremo de la barra cromática. Puede cambiar el comportamiento de la herramienta de transformación del pincel de las maneras siguientes:

• Mantenga presionada la tecla MAYÚS al arrastrar un extremo para restringir el movimiento a lo largo de la línea recta entre los extremos.

• Mantenga presionada la tecla MAYÚS al mover la flecha completa para restringir el movimiento al plano X o Y.

• Mantenga presionada la tecla MAYÚS al girar un extremo para ajustar cada 15 grados.

• Mantenga presionada la tecla ALT al arrastrar un extremo para mover ambos extremos al mismo tiempo manteniendo la posición del punto central.

Las siguientes imágenes muestran la apariencia de un objeto rectángulo después de aplicar diversas transformaciones al pincel de degradado de la propiedad Fill.

Transformaciones aplicadas al pincel de degradado lineal de un rectángulo

Transformaciones aplicadas al pincel de degradado radial de un rectángulo

También puede establecer el método de extensión de un pincel de degradado al hacer clic en Opciones avanzadas de la propiedad  situado en Pinceles en el panel Propiedades y, a continuación, establezca la propiedad SpreadMethod. En la imagen anterior aparece seleccionada la opción Relleno. Si seleccionó la opción Reflect o Repeat y, a continuación, hizo que la flecha de transformación fuese más corta que el objeto, verá un efecto ondulado.

Puede transformar tipos de pincel distintos de los pinceles de degradado. Para obtener más información acerca de las transformaciones del pincel, vea Transformar un pincel de degradado o de diseño en mosaico.

Recorte

Cuando transforme un pincel, a veces se recortarán partes del objeto (es decir, desaparecerán partes fuera del rectángulo de selección). Puede corregir problemas de recortes de las siguientes maneras:

• Desactive la casilla de la propiedad ClipToBounds en Apariencia, en el panel Propiedades.

• Use las propiedades de la categoría LayoutTransform en lugar de RenderTransform en Transformación, en el panel Propiedades. Esto resulta especialmente útil al transformar un pincel visual.

Trazos

Los trazos son los bordes de los objetos. Puede cambiar el pincel aplicado (sólido, de degradado o de diseño en mosaico), la opacidad, el ancho y el límite angular del trazo de un objeto, así como los estilos de unión de esquina y extremo. El trazo de un objeto siempre se aplica sobre un relleno, incluso aunque no se haya aplicado ningún relleno a ese objeto. Para realizar cualquier cambio en el trazo de un objeto, es necesario que Trazo esté seleccionado en la lista de Pinceles, en el panel Propiedades.

• **Ancho del trazo  ** El ancho de un trazo de un objeto se mide en píxeles (o en unidades independientes del dispositivo, que son aproximadamente 1/96 de pulgada) y puede tener un valor comprendido entre 0 y la mitad del ancho o del alto de la forma. En general, una vez que el grosor del trazo alcanza la mitad del ancho y del alto de la forma, el trazo cubre todo el relleno. Puede establecer el valor del ancho del trazo mediante la propiedad StrokeThickness en Apariencia, en el panel Propiedades.

• **Uniones de esquina  ** En objetos que tienen esquinas en ángulo, como los rectángulos, puede cambiar la apariencia del trazo en cada vértice mediante la aplicación de uno de los tres estilos de unión de esquina: Unión angular, Unión redondeada y Unión biselada. Puede establecer el estilo de unión de esquina mediante la propiedad StrokeLineJoin en Apariencia, en el panel Propiedades.

  

• **Límite angular  ** El límite angular controla la longitud máxima que puede alcanzar el vértice de una unión angular antes de que se cuadre automáticamente en una unión biselada. Puede establecer el límite angular mediante la propiedad StrokeMiterLimit en Apariencia, en el panel Propiedades. En la siguiente imagen se muestran tres ángulos con el valor 40 en StrokeThickness y con el valor 1 en StrokeMiterLimit, 2,2 y 4 . El tamaño del ángulo y el grosor del trazo determinan el efecto visual del límite angular.

  

• **Extremos  ** Para trazados que contienen extremos no conectados, como las líneas, puede cambiar la apariencia del trazo en cada extremo mediante la aplicación de uno de los cuatro estilos de extremo: Extremo plano , Extremo redondeado , Extremo cuadrado y Extremo triangular . Puede establecer el estilo de extremo mediante las propiedades StrokeEndLineCap o StrokeStartLineCap en Apariencia, en el panel Propiedades.

  

Opacidad y visibilidad

Cuando se reduce la opacidad de un objeto, se aumenta su transparencia para poder ver otros objetos situados detrás. La opacidad se controla mediante un canal alfa que almacena toda la información de transparencia de un objeto, degradado o máscara de opacidad. En la siguiente tabla, se describen tres posibles métodos que se pueden seleccionar para cambiar la opacidad del objeto.

Método	Resultados
Opacidad   Cambia la transparencia del objeto completo, incluidos todos los atributos visuales del objeto. En la imagen situada a la derecha se muestra el valor de opacidad establecido en el 60 por ciento.
Transparencia   Establece el valor alfa (A) de un atributo de pincel individual de un objeto, como el relleno o el trazo, en ligeramente transparente sin tener que cambiar todos los atributos de un solo objeto. En la imagen situada a la derecha se muestra que sólo el relleno de la elipse es más transparente, ya que el valor alfa del relleno está establecido en el 50 por ciento. El trazo de la elipse permanece en el 100 por ciento.
Visibilidad   Permite ocultar o mostrar un objeto en diferentes momentos. Esto es especialmente eficaz en la animación, cuando no se desea quitar un objeto completamente de la mesa de trabajo. En la imagen situada a la derecha, el objeto izquierdo que tiene un relleno azul y un trazo negro grueso y que forma parte de las dos imágenes precedentes de esta tabla ahora está establecido como Hidden.

Vea también

Conceptos

Aplicar efectos