¿Qué es el editor de imágenes de Visual Studio?
El editor de imágenes de Visual Studio es una herramienta que puede usar para ver y modificar los recursos de textura e imagen. En concreto, puede usar el editor de imágenes para trabajar con tipos de formato de imagen y textura enriquecidos que se usan en el desarrollo de aplicaciones de DirectX. El editor de imágenes incluye compatibilidad con formatos de archivo de imagen y codificaciones de color populares, características como los canales alfa y los mapas MIP, y muchos de los formatos de textura muy comprimidos y acelerados por hardware que son compatibles con DirectX.
Formatos compatibles
El Editor de imágenes admite estos formatos de imagen:
| Nombre de formato | Extensión de nombre de archivo |
|---|---|
| Portable Network Graphics (PNG) | .png |
| JPEG | .jpg, .jpeg, .jpe, .jfif |
| DirectDraw Surface | .dds |
| formato de intercambio de gráficos (GIF) | .gif |
| Bitmap | .bmp, .dib |
| Tagged Image File Format | .tif, .tiff |
| TGA (Targa) | .tga |
Introducción
En esta sección se describe cómo agregar una imagen al proyecto Visual Studio y configurarla de acuerdo con sus requisitos.
Agregar una imagen al proyecto
En el Explorador de soluciones, abra el menú contextual del proyecto al que quiere agregar la imagen y, después, elija Agregar>Nuevo elemento.
En el cuadro de diálogo Agregar nuevo elemento, en Instalado, seleccione Gráficos y, después, seleccione un formato de archivo apropiado para la imagen.
Nota
Si no ve la categoría Gráficos en el cuadro de diálogo Agregar nuevo elemento, es posible que deba instalar el componente Editores de imágenes y modelos 3D. Cierre el cuadro de diálogo y seleccione Herramientas>Obtener herramientas y características en la barra de menús, para abrir el Instalador de Visual Studio. Seleccione la pestaña Componentes individuales y, después, seleccione el componente Editores de imágenes y modelos 3D en la categoría Juegos y gráficos. Seleccione Modificar.
Para obtener información sobre cómo elegir un formato de archivo según sus requisitos, vea Choose the image format (Elegir el formato de archivo).
Especifique el Nombre del archivo de imagen y la Ubicación en la que quiera que se cree.
Elija el botón Agregar.
Elegir el formato de imagen
Según cómo piense utilizar la imagen, determinados formatos de archivo pueden ser más adecuados que otros. Por ejemplo, es posible que algunos formatos no admitan una característica que necesite como, por ejemplo, la transparencia o un formato de color concreto. Puede que algunos formatos no proporcionen una compresión adecuada para el tipo de contenido de imagen que ha planeado.
Con la información siguiente podrá elegir un formato de imagen que satisfaga sus necesidades:
Imagen de mapa de bits (.bmp)
Formato de la imagen de mapa de bits. Un formato de imagen sin comprimir que admite color de 24 bits. El formato de mapa de bits no admite transparencias.
Imagen GIF (.gif)
Formato de imagen de formato de intercambio de gráficos (GIF). Un formato de imagen con compresión LZW, y sin pérdida de datos, que admite hasta 256 colores. No es adecuado para fotografías e imágenes que tienen una gran cantidad de detalle de color, pero proporciona buenas razones de compresión para las imágenes con poco color que tienen un alto grado de coherencia de color.
Imagen JPG (.jpg)
Formato de imagen Joint Photographic Experts Group (JPEG). Un formato de imagen muy comprimido, con pérdida de datos, que admite color de 24 bits y es adecuado para la compresión de uso general de las imágenes que tienen un alto grado de coherencia de color.
Imagen PNG (.png)
Formato de imagen Portable Network Graphics (PNG). Un formato de imagen con compresión moderada, y sin pérdida de datos, que admite color de 24 bits y transparencia alfa. Es válido para imágenes naturales y artificiales, pero no proporciona índices de compresión tan buenos como los formatos con pérdida de información (JPG o GIF, por ejemplo).
Imagen TIFF (.tif)
Formato de imagen Tagged Image File Format (TIFF o TIF). Un formato de imagen flexible que admite varios esquemas de compresión.
Textura DDS (.dds)
Formato de textura de DirectDraw Surface (DDS). Un formato de textura muy comprimido y con pérdida de datos, que admite color de 24 bits y transparencia alfa. Los valores de las razones de compresión pueden ser tan altos como 8:1. Se basa en la compresión de textura S3, que se puede descomprimir en hardware gráfico.
Imagen TGA (.tga)
El formato de imagen Truevision Graphics Adapter (TGA) (también conocido como Targa). Un formato de imagen con compresión RLE, y sin pérdida de datos, que admite tanto imágenes con asignación de colores (paleta de colores) o con color directo de hasta 24 bits como transparencia alfa. No es adecuado para fotografías e imágenes que tienen una gran cantidad de detalle de color, pero proporciona buenas razones de compresión para las imágenes que tienen intervalos largos de colores idénticos.
Configurar la imagen
Antes de empezar a trabajar con la imagen que ha creado, puede cambiar su configuración predeterminada. Por ejemplo, puede cambiar sus dimensiones o el formato de color que utiliza. Para obtener información sobre cómo configurar estas y otras propiedades de imagen, consulte Propiedades de imagen.
Nota
Antes de guardar el trabajo, asegúrese de establecer la propiedad Formato de color si quiere utilizar un formato de color concreto. Si el formato de archivo admite la compresión, puede ajustar los valores de compresión al guardar el archivo por primera vez o cuando elija Guardar como.
Trabajo con el editor de imágenes para modificar texturas e imágenes
Los comandos que influyen en el estado del Editor de imágenes se encuentran en la barra de herramientas Modo Editor de imágenes junto con los comandos avanzados. La barra de herramientas se encuentra en el borde superior de la superficie de diseño del Editor de imágenes. Las herramientas de dibujo se encuentran en la barra de herramientas del Editor de imágenes a lo largo del borde izquierdo de la superficie de diseño del Editor de imágenes.
Barra de herramientas Modo Editor de imágenes
En esta tabla se describen los elementos de la barra de herramientas Modo Editor de imágenes y se muestran en el orden en que aparecen de izquierda a derecha:
| Elemento de la barra de herramientas | Description |
|---|---|
| Select | Permite seleccionar una región rectangular de una imagen. Después de seleccionar una región, la puede cortar, copiar, mover, escalar, girar, voltear o eliminar. Cuando hay una selección activa, las herramientas de dibujo solo afectan a la región seleccionada. |
| Selección irregular | Permite seleccionar una región irregular de una imagen. Después de seleccionar una región, la puede cortar, copiar, mover, escalar, girar, voltear o eliminar. Cuando hay una selección activa, las herramientas de dibujo solo afectan a la región seleccionada. |
| Selección de varita | Permite seleccionar una región de color similar de una imagen. La tolerancia, es decir, la diferencia máxima entre colores adyacentes donde se consideran similares, puede configurarse para incluir un intervalo mayor o menor de colores similares. Después de seleccionar una región, la puede cortar, copiar, mover, escalar, girar, voltear o eliminar. Cuando hay una selección activa, las herramientas de dibujo solo afectan a la región seleccionada. |
| Movimiento panorámico | Permite mover la imagen con relación al marco de la ventana. En el modo Movimiento panorámico, seleccione un punto de la imagen y, después, muévalo alrededor. Para activar temporalmente el modo Movimiento panorámico, mantenga presionada la tecla Ctrl. |
| Zoom | Permite presentar más o menos detalles de la imagen con relación al marco de la ventana. En el modo Zoom, seleccione un punto de la imagen y muévalo a la derecha o hacia abajo para acercar, o a la izquierda o hacia arriba para alejar. Para acercar o alejar, mantenga presionada la tecla Ctrl mientras usa la rueda del mouse o presiona el signo más ( + ) o el signo menos ( - ). |
| Ajustar el zoom al tamaño real | Muestra la imagen mediante una relación 1:1 entre los píxeles de la imagen y los píxeles de la pantalla. |
| Ajustar el zoom al tamaño completo | Muestra la imagen completa en el marco de la ventana. |
| Ajustar el zoom al ancho | Muestra el ancho completo en el marco de la ventana. |
| Grid | Habilita o deshabilita la cuadrícula que muestra los límites de píxeles. Es posible que la cuadrícula no aparezca hasta que haga zoom en la imagen. |
| Ver el nivel de MIP siguiente | Activa el siguiente nivel de MIP más grande en una cadena de asignación de MIP. El nivel de MIP activo se muestra en la superficie de diseño. Este elemento solo está disponible para las texturas que tienen niveles de MIP. |
| Ver el nivel de MIP anterior | Activa el siguiente nivel de MIP más pequeño en una cadena de asignación de MIP. El nivel de MIP activo se muestra en la superficie de diseño. Este elemento solo está disponible para las texturas que tienen niveles de MIP. |
| Canal rojo Canal verde Canal azul Canal alfa |
Habilita o deshabilita el canal de colores concreto. Nota: Al habilitar o deshabilitar sistemáticamente los canales de color, puede aislar los problemas que están relacionados con uno o varios de ellos. Por ejemplo, puede identificar una transparencia alfa incorrecta. |
| Información preliminar | Habilita o deshabilita la presentación del fondo a través de las partes transparentes de la imagen. Puede elegir entre estas opciones para configurar cómo se muestra el fondo: Tablero de ajedrez Utiliza un color verde junto con el color de fondo especificado para mostrar el fondo como un patrón de tablero. Puede usar esta opción para que las partes transparentes de la imagen sean más evidentes. Fondo blanco Utiliza el color blanco para mostrar el fondo. Fondo negro Utiliza el color negro para mostrar el fondo. Fondo animado Gira lentamente el patrón de tablero. Puede usar esta opción para que las partes transparentes de la imagen sean más evidentes. |
| Propiedades | Abre o cierra alternativamente la ventana Propiedades. |
| Avanzadas | Contiene comandos y opciones adicionales. Filtros Proporciona varios filtros de imágenes habituales: Blanco y negro, Desenfoque, Brillar, Oscurecer, Detección de bordes, Relieve, Invertir colores, Ripple, Tono sepia y Dar nitidez. Motores gráficos Representar con D3D11 Utiliza Direct3D 11 para representar la superficie de diseño del Editor de imágenes. Representar con D3D11WARP Utiliza Windows Advanced Rasterization Platform (WARP) de Direct3D 11 para representar la superficie de diseño del Editor de imágenes. Herramientas Voltear horizontalmente Transpone la imagen alrededor de su eje horizontal, o x. Voltear verticalmente Transpone la imagen alrededor de su eje vertical, o y. Generar MIP Genera los niveles de MIP para una imagen. Si ya existen niveles de MIP, se vuelven a crear desde el nivel de MIP más grande. Se perderán los cambios realizados en los niveles de MIP más pequeños. Para guardar los niveles de MIP que ha generado, debe usar el formato .dds para guardar la imagen. Ver Velocidad de fotogramas Cuando esta opción está habilitada, muestra la velocidad de fotogramas en la esquina superior derecha de la superficie de diseño. La velocidad de fotogramas es el número de fotogramas dibujados por segundo. Consejo: Puede hacer clic en el botón Avanzado para volver a ejecutar el último comando. |
Barra de herramientas del Editor de imágenes
En la tabla siguiente se describen los elementos de la barra de herramientas Editor de imágenes, en el orden en que aparecen de arriba abajo:
| Elemento de la barra de herramientas | Description |
|---|---|
| Lápiz | Utiliza la selección de color activa para dibujar el trazo de un alias. Puede establecer el color y el grosor del trazo en la ventana Propiedades. |
| Brush | Utiliza la selección de color activa para dibujar un trazo suavizado. Puede establecer el color y el grosor del trazo en la ventana Propiedades. |
| Aerógrafo | Utiliza la selección de color activa para dibujar un trazo suavizado que se combina con la imagen y se vuelve más saturado como una función de tiempo. Puede establecer el color y el grosor del trazo en la ventana Propiedades. |
| Cuentagotas | Establece la selección de color activo en el color del píxel seleccionado. |
| Fill | Utiliza la selección de color activa para rellenar una región de la imagen. La región afectada se define como el píxel en el que se aplica el relleno, junto con todos los píxeles que están conectados a ella mediante píxeles del mismo color y que es el mismo color en sí. Si el relleno se aplica en una selección activa, la selección restringe la región afectada. De forma predeterminada, la selección de color activa se combina con la región afectada de la imagen en función de su componente alfa. Para utilizar la selección de color activa para sobrescribir la región afectada, mantenga presionada la tecla Mayús al usar la herramienta de relleno. |
| Borrador | Establece los píxeles en el color totalmente transparente si la imagen admite un canal alfa. De lo contrario, el Borrador los establece en el color de fondo activo. |
| Línea, Rectángulo, Rectángulo redondeado, Elipse | Dibuja una forma en la imagen. Puede establecer el color y el grosor del esquema en la ventana Propiedades. Para dibujar una primitiva que tenga el mismo ancho y alto, mantenga presionada la tecla Mayús mientras dibuja. |
| Texto | Utiliza la selección de color de primer plano para dibujar texto. La selección de color de fondo determina el color de fondo. Para un fondo transparente, el valor alfa de la selección de color de fondo debe ser 0. Cuando la región de texto esté activa, puede establecer si el texto se dibuja con un trazo suavizado, así como el Valor, la Fuente y el Tamaño del texto, además del estilo (Negrita, Cursiva o Subrayado), en la ventana Propiedades. El contenido y la apariencia del texto finalizan cuando la región de texto ya no está activa. |
| Girar | Gira la imagen 90 grados en el sentido de las agujas del reloj. |
| Trim | Recorta la imagen al tamaño de la selección activa. |
Trabajar con niveles de MIP
Algunos formatos de imagen, como DirectDraw Surface (.dds), admiten niveles de MIP con nivel de detalle (LOD) del espacio de textura.
Trabajar con transparencia
Algunos formatos de imagen, como DirectDraw Surface (.dds), admiten la transparencia. La transparencia se puede utilizar de varias maneras, según la herramienta que use. Para especificar el nivel de transparencia de una selección de color, en la ventana Propiedades, establezca el componente A (alfa) de la selección de color.
En esta table se describen el modo en que diferentes tipos de herramientas controlan cómo se aplica la transparencia:
| Herramienta | Descripción |
|---|---|
| Lápiz, Pincel, Aerógrafo, Línea, Rectángulo, Rectángulo redondeado, Elipse, Texto | Para combinar la selección de color activa con la imagen, en la ventana Propiedades, expanda el grupo de propiedades Canales, establezca la casilla de verificación Dibujar en el canal Alfa y, a continuación, dibuje normalmente. Para dibujar con la selección de color activa y dejar el valor alfa de la imagen en su lugar, desactive la casilla de verificación Dibujar del canal Alfa y, después, dibuje normalmente. |
| Fill | Para combinar la selección de color activa con la imagen, elija el área que se deba rellenar. Para utilizar la selección de color activa, incluido el valor del canal alfa, para sobrescribir la imagen, mantenga presionada la tecla Mayús y, después, elija el área que se deba rellenar. |
Propiedades de la imagen
Puede utilizar la ventana Propiedades para especificar distintas propiedades de la imagen. Por ejemplo, puede establecer las propiedades de ancho y alto para cambiar el tamaño de la imagen.
En la tabla siguiente se describen las propiedades de la imagen:
| Propiedad | Description |
|---|---|
| Ancho | El ancho de la imagen. |
| Alto | El alto de la imagen. |
| Bits por píxel | El número de bits que representan a cada píxel. El valor de esta propiedad depende del Formato de color de la imagen. |
| Selección transparente | Se establece como true para combinar la capa de selección con la imagen principal, según el valor alfa de la capa de selección; en caso contrario, se establece como false. Este elemento solo está disponible para las imágenes que admiten el valor alfa. |
| Formato | Formato de color de la imagen. Puede especificar varios formatos de color, según el formato de la imagen. El formato de color define el número y el tipo de canales de color que se incluyen en la imagen, así como el tamaño y la codificación de varios canales. |
| Nivel de MIP | Nivel de MIP activo. Este elemento solo está disponible para las texturas que tienen niveles de MIP. |
| Recuento de niveles de MIP | Número total de niveles de MIP de la imagen. Este elemento solo está disponible para las texturas que tienen niveles de MIP. |
| Recuento de fotogramas | Número total de fotogramas de la imagen. Este elemento solo está disponible para las imágenes que admiten matrices de textura. |
| Fotograma | Fotograma actual. Solo se puede ver el primer fotograma; todos los otros fotogramas se pierden al guardar la imagen. |
| Número de segmentos de profundidad | Número total de segmentos de profundidad de la imagen. Este elemento solo está disponible para las imágenes que admiten texturas de volumen. |
| Segmento de profundidad | Segmento de profundidad actual. Solo se puede ver el primer segmento; todos los otros segmentos se pierden al guardar la imagen. |
Nota
Dado que la propiedad Girar se aplica a todas las herramientas y regiones seleccionadas, siempre aparece en la parte inferior de la ventana Propiedades junto con otras propiedades de la herramienta. Girar "x" grados siempre se muestra porque toda la imagen se selecciona implícitamente cuando no hay ninguna otra selección o herramienta activa. Para obtener más información sobre la propiedad Girar "x" grados, vea Propiedades de la herramienta.
Cambiar el tamaño de imágenes
Hay dos formas de cambiar el tamaño de una imagen. En ambos casos, el Editor de imágenes utiliza la interpolación bilineal para crear un nuevo muestreo de la imagen.
En la ventana Propiedades, especifique nuevos valores para las propiedades Ancho y Alto.
Seleccione toda la imagen y utilice los marcadores de borde para cambiar el tamaño de la imagen.
Regiones seleccionadas
Las selecciones en el Editor de imágenes definen las regiones de la imagen que están activas. Las regiones activas se ven afectadas por las herramientas y las transformaciones. Cuando hay una selección activa, las áreas que están fuera de la región seleccionada no se ven afectadas por la mayoría de herramientas y transformaciones. Si no hay ninguna selección activa, toda la imagen está activa.
La selección activa restringe o define la mayoría de las herramientas (Lápiz, Pincel, Aerógrafo, Relleno, Borrador y primitivas 2D) y transformaciones (Girar, Recortar, Invertir colores, Voltear horizontalmente y Voltear verticalmente). No obstante, algunas herramientas (Eyedropper y Text) y transformaciones (Generar Mips) no se ven afectadas por ninguna selección activa. Estas herramientas siempre se comportan como si toda la imagen fuera la selección activa.
Mientras está seleccionando una región, puede mantener presionada la tecla Mayús para realizar una selección proporcional (cuadrado). De lo contrario, la selección no está restringida.
Cambiar tamaño de selección
Después de seleccionar una región, puede cambiar su tamaño o el contenido de la imagen; para ello, cambie el tamaño del marcador de la selección. Al cambiar el tamaño de la región seleccionada, puede usar las siguientes teclas modificadoras para cambiar el comportamiento de la región seleccionada mientras cambia su tamaño:
Ctrl: Copia el contenido de la región seleccionada antes de que cambie de tamaño. La imagen original queda intacta, mientras que el tamaño de la copia se cambia.
Mayús: Cambia el tamaño de la región seleccionada en proporción a su tamaño original.
Alt: Cambia el tamaño de la región de la selección. Esto deja la imagen sin modificar.
En la tabla siguiente se describen las combinaciones válidas de teclas modificadoras que devuelven:
| Ctrl | Mayús | Alt | Description |
|---|---|---|---|
| Cambia el tamaño del contenido de la región seleccionada. | |||
| Shift | Cambia proporcionalmente el tamaño del contenido de la región seleccionada. | ||
| Alt | Cambia el tamaño de la región seleccionada. Esto define una nueva región de selección. | ||
| Shift | Alt | Cambia proporcionalmente el tamaño de la región seleccionada. Esto define una nueva región de selección. | |
| Ctrl | Copia y después cambia el tamaño del contenido de la región seleccionada. | ||
| Ctrl | Shift | Copia y después cambia proporcionalmente el tamaño del contenido de la región seleccionada. |
Propiedades de herramientas
Cuando está seleccionada una herramienta, puede utilizar la ventana Propiedades para especificar los detalles de cómo afecta a la imagen. Por ejemplo, puede establecer el grosor de la herramienta Lápiz o el color de la herramienta Pincel.
Puede establecer un color de primer plano y un color de fondo. Ambos admiten un canal alfa para proporcionar opacidad definida por el usuario. La configuración se aplica a todas las herramientas. Si utiliza un mouse, el botón izquierdo se corresponde con el color de primer plano, mientras que el botón derecho se corresponde con el color de fondo.
En la tabla siguiente se describen las propiedades de las herramientas:
| Herramienta | Propiedades |
|---|---|
| Todas las herramientas y selecciones | Girar "x" grados Define la cantidad, en grados, que la selección o el efecto de la herramienta gira en el sentido de las agujas del reloj. |
| Lápiz, Pincel, Aerógrafo, Borrador | Thickness Define el tamaño del área que se ve afectada por la herramienta. |
| Texto | Suavizado Dibuja texto con bordes suavizados. Esto proporciona al texto una apariencia más suave. Valor El texto que se debe dibujar. Fuente La fuente utilizada para dibujar el texto. Tamaño El tamaño del texto. Negrita Pone la fuente en negrita. Cursiva Pone la fuente en cursiva. Subrayado Pone la fuente subrayada. |
| Primitiva 2D | Suavizado Dibuja las primitivas que tienen bordes suavizados. Esto les proporciona una apariencia más suave. Thickness Define el grosor de la línea que constituye el límite de la primitiva. Radio X (Solo rectángulo redondeado) Define el radio de redondeo para los bordes superior e inferior de la primitiva. Radio Y (Solo rectángulo redondeado) Define el radio de redondeo para los bordes izquierdo y derecho de la primitiva. |
| Lápiz, Pincel, Aerógrafo, Primitiva 2D | Channels Habilita o deshabilita canales de color concretos para ver y dibujar. Si se establece Ver para un canal de color concreto, ese canal está visible en la imagen. De lo contrario, no está visible. Si se establece Dibujar para un canal de color concreto, ese canal se ve afectado por las operaciones de dibujo. De lo contrario, no se ve afectado. |
| Selección de varita, Relleno | Tolerancia Define la diferencia máxima entre colores adyacentes donde se consideran similares, de manera que menos o más colores similares se convierten en parte de la región afectada o seleccionada. De forma predeterminada, el valor es 32, lo que significa que los píxeles adyacentes con 32 tonalidades (más claras u oscuras) del color original se consideran parte de la región. |
Métodos abreviados de teclado
| Get-Help | Accesos directos del teclado |
|---|---|
| Cambiar al modo Seleccionar | S |
| Cambiar al modo Zoom | Z |
| Cambiar al modo Movimiento panorámico | K |
| Seleccionar todo | Ctrl+A |
| Eliminar la selección actual | Eliminar |
| Cancelar la selección actual | Esc (Escape) |
| Acercamiento | Ctrl+Rueda del mouse hacia delante Ctrl+RePág Signo más ( + ) |
| Alejamiento | Ctrl-Rueda del mouse hacia atrás Ctrl-AvPág Signo menos ( - ) |
| Aplicar a la imagen un movimiento panorámico hacia arriba | Rueda del mouse hacia atrás AvPág |
| Aplicar a la imagen un movimiento panorámico hacia abajo | Rueda del mouse hacia delante RePág |
| Aplicar a la imagen un movimiento panorámico hacia la izquierda | Mayús+Rueda del mouse hacia atrás Rueda del mouse a la izquierda Mayús+AvPág |
| Aplicar a la imagen un movimiento panorámico hacia la derecha | Mayús+Rueda del mouse hacia delante Rueda del mouse a la derecha Mayús+RePág |
| Ajustar el zoom al tamaño real | Ctrl+0 (cero) |
| Ajustar la imagen a la ventana | Ctrl+G, Ctrl+F |
| Ajustar la imagen al ancho de la ventana | Ctrl+G, Ctrl+I |
| Alternar la cuadrícula | Ctrl+G, Ctrl+G |
| Recortar la imagen a la selección actual | Ctrl+G, Ctrl+C |
| Ver el nivel de MIP siguiente (mayor nivel de detalle) | Ctrl+G, Ctrl+6 |
| Ver el nivel de MIP anterior (menor nivel de detalle) | Ctrl+G, Ctrl+7 |
| Alternar el canal de color rojo | Ctrl+G, Ctrl+1 |
| Alternar el canal de color verde | Ctrl+G, Ctrl+2 |
| Alternar el canal de color azul | Ctrl+G, Ctrl+3 |
| Alternar el canal alfa (transparencia) | Ctrl+G, Ctrl+4 |
| Alternar el patrón de tablero alfa | Ctrl+G, Ctrl+B |
| Cambiar a la herramienta Selección irregular | L |
| Cambiar a la herramienta Selección de varita | M |
| Cambiar a la herramienta Lápiz | P |
| Cambiar a la herramienta Pincel | B |
| Cambiar a la herramienta Relleno | F |
| Cambiar a la herramienta Borrador | E |
| Cambiar a la herramienta Texto | T |
| Cambiar a la herramienta Selección de color (cuentagotas) | I |
| Mover la selección activa y su contenido | Teclas de dirección |
| Cambiar el tamaño de la selección activa y de su contenido | Ctrl+Teclas de dirección |
| Mover la selección activa, pero no su contenido | Mayús+Teclas de dirección |
| Cambiar el tamaño de la selección activa, pero no de su contenido | Mayús+Ctrl+Teclas de dirección |
| Confirmar la capa actual | Return |
| Disminuir el grosor de la herramienta | [ |
| Aumentar el grosor de la herramienta | ] |
Ejemplos del Editor de imágenes
En los ejemplos de esta sección se muestra cómo usar el editor de imágenes para crear una textura básica y cómo generar y modificar niveles de MIP.
Crear una textura básica
Puede usar el Editor de imágenes para crear y modificar imágenes y texturas para su juego o aplicación. Por ejemplo, puede establecer el tamaño de la textura y los colores del primer plano y del fondo, usar el canal alfa (transparencia) y las herramientas Rellenar y Elipse, y establecer propiedades de herramientas.
En los siguientes pasos de este ejemplo se muestra cómo crear una textura que represente el blanco de una "diana". Cuando haya terminado, la textura debe tener una apariencia similar a la de la imagen siguiente. Para mostrar mejor la transparencia de la textura, se ha configurado el editor de imágenes para que use un patrón de color verde a cuadros para mostrarla.
Antes de empezar, asegúrese de que se muestra la ventana Propiedades. Se usa la ventana Propiedades para establecer el tamaño de la imagen, cambiar las propiedades de las herramientas y especificar colores mientras trabaja.
Crear una textura de destino de "diana"
Cree una textura con la que va a trabajar. Para información sobre cómo agregar una textura al proyecto, consulte Editor de imágenes.
Establezca el tamaño de imagen en 512 x 512 píxeles. En la ventana Propiedades, establezca los valores de las propiedades Ancho y Alto en
512.En la barra de herramientas del Editor de imágenes, elija la herramienta Relleno. La ventana Propiedades muestra ahora las propiedades de la herramienta Relleno junto con las propiedades de la imagen.
Establezca el color de primer plano en negro totalmente transparente. En la ventana Propiedades, en el grupo de propiedades Colores, seleccione Primer plano. Establezca los valores de las propiedades R, G, B y A junto al selector de colores en
0.En la barra de herramientas del Editor de imágenes, seleccione la herramienta Relleno y, después, mantenga presionada la tecla Mayús y elija cualquier punto de la imagen. Al usar la tecla Mayús, el valor alfa del color de relleno reemplaza el color de la imagen. De lo contrario, se usa el valor alfa para mezclar el color de relleno junto con el color de la imagen.
Importante
Este paso, junto con la selección de color en el paso anterior, garantiza que la imagen base está preparada para la textura de destino de "diana" que se va a dibujar. Cuando la imagen se rellena con negro transparente, y dado que el borde del destino es negro, no habrá ningún artefacto de suavizado alrededor del destino.
En la barra de herramientas del Editor de imágenes, elija la herramienta Elipse.
Establezca el color de primer plano en negro totalmente opaco. Establezca los valores de las propiedades R, G y B en
0y el valor de la propiedad A en255.Establezca el color de fondo en blanco totalmente opaco. En la ventana Propiedades, en el grupo de propiedades Colores, seleccione Fondo. Establezca los valores de las propiedades R, G, B y A en
255.Establezca el ancho del contorno de la elipse. En la ventana Propiedades, en el grupo de propiedades Apariencia, establezca el valor de la propiedad Ancho en
8.Asegúrese de que esté habilitado el suavizado de contorno. En la ventana Propiedades, en el grupo de propiedades Apariencia, asegúrese de que esté habilitada la propiedad Suavizado de contorno.
Con la herramienta Elipse, dibuje un círculo desde la coordenada de píxel
(3, 3)a la coordenada de píxel(508, 508). Para dibujar el círculo más fácilmente, puede presionar y mantener presionada la tecla Mayús mientras dibuja.Nota
Las coordenadas de píxel de la ubicación actual del puntero se muestran en la barra de estado de Visual Studio.
Cambie el color de fondo. Establezca R en
44, G en165, B en211y A en255.Dibuje otro círculo desde la coordenada de píxel
(64, 64)a la coordenada de píxel(448, 448).Cambie el color de fondo a blanco totalmente opaco. Establezca R, G, B y A en
255.Dibuje otro círculo desde la coordenada de píxel
(128, 128)a la coordenada de píxel(384, 384).Cambie el color de fondo. Establezca R en
255, G y B en64y A en255.Dibuje otro círculo desde la coordenada de píxel
(192, 192)a la coordenada de píxel(320, 320).
La textura de destino de "diana" está completa. Aquí está la imagen final, mostrada con transparencia.
Después, puede generar niveles de MIP para esta textura. Para obtener información sobre cómo hacerlo, consulte la siguiente sección.
Crear y modificar niveles de MIP
En este documento se muestra cómo usar el Editor de imágenes para generar y modificar niveles de MIP con nivel de detalle (LoD) del espacio de textura.
Generar niveles de MIP
La generación de mapas MIP es una técnica que se usa para aumentar la velocidad de representación y reducir los artefactos del efecto escalonado en objetos con textura, para lo que se calculan previamente y se almacenan varias copias de una textura de diferentes tamaños. Cada copia, conocida como nivel de MIP, tiene la mitad del ancho y del alto de la copia anterior. Cuando una textura se representa en la superficie de un objeto, se elige automáticamente el nivel de MIP que se corresponde mejor con el área del espacio de pantalla de la superficie con textura. Esto significa que el hardware gráfico no tiene que filtrar las texturas demasiado grandes para mantener una calidad visual coherente. Aunque el costo de memoria de almacenar los niveles de MIP es aproximadamente un 33 % más alto que el de la textura original por sí sola, las mejoras del rendimiento y de la calidad de imagen lo justifican.
Para generar niveles de MIP
Comience con una textura básica. Para obtener mejores resultados, especifique una textura que tenga un ancho y un alto que sean la potencia de dos del tamaño, por ejemplo, 256, 512, 1024, etc.
Genere los niveles de MIP. En la barra de herramientas del modo Editor de imágenes, elija Avanzado>Herramientas>Generar Mips.
Observe que los botones para ir al nivel de MIP siguiente e ir al nivel de MIP anterior aparecen ahora en la barra de herramientas del modo Editor de imágenes. Si se muestra la ventana Propiedades, observe también que las propiedades de solo lectura Nivel de Mip y Número de niveles de MIP aparecen ahora en las propiedades de la imagen.
Modificar niveles de MIP
Para lograr efectos especiales o aumentar la calidad de la imagen a niveles de detalle específicos, puede modificar cada nivel de MIP individualmente. Por ejemplo, puede asignar a un objeto con textura una apariencia diferente a distancia (cuanto mayor sea la distancia, menores serán los niveles de MIP), o puede asegurarse de que las texturas que contienen texto o símbolos sigan siendo legibles incluso en niveles de MIP más pequeños.
Para modificar un nivel de MIP individual
Seleccione el nivel de MIP que quiere modificar. En la barra de herramientas del modo Editor de imágenes, use los botones para ir al nivel de MIP siguiente e ir al nivel de MIP anterior para moverse entre los niveles.
Una vez que haya seleccionado el nivel de MIP que quiere modificar, puede usar las herramientas de dibujo para modificarlo sin cambiar el contenido de otros niveles de MIP. Las herramientas de dibujo están disponibles en la barra de herramientas del Editor de imágenes. Después de seleccionar una herramienta, puede cambiar sus propiedades en la ventana Propiedades.
Nota:
Si no necesita modificar el contenido de los niveles de MIP individuales (como haría para lograr determinados efectos), se recomienda que genere los mapas MIP desde la textura de origen en tiempo de compilación. Esto ayuda a garantizar que los niveles de MIP permanezcan sincronizados con la textura de origen, ya que las modificaciones realizadas en un nivel de MIP no se propagan automáticamente a otros niveles.
Contenido relacionado
Consulte la página sobre exportación de texturas para obtener información sobre cómo usar la canalización de contenido de imágenes para exportar texturas que contienen mapas MIP, alfas premultiplicados, etc.
Comentarios
Próximamente: A lo largo de 2024 iremos eliminando gradualmente GitHub Issues como mecanismo de comentarios sobre el contenido y lo sustituiremos por un nuevo sistema de comentarios. Para más información, vea: https://aka.ms/ContentUserFeedback.
Enviar y ver comentarios de