Importar un archivo de Adobe Photoshop

Con la importación de archivos de Adobe Photoshop a un proyecto de Microsoft Expression Blend, puede transformar gráficos estáticos en una experiencia interactiva y visualmente atractiva.

Entender las opciones de capa disponibles en el cuadro de diálogo Importar archivo de Adobe Photoshop le ayudará a integrar los archivos de Photoshop en los proyectos de Expression Blend de manera más rápida y eficaz.

Para obtener más información acerca de las opciones de capa y las características admitidas, vea las secciones tituladas "Imagen de compatibilidad", "Opciones y herramientas de capas" y "Compatibilidad con características de Photoshop".

Para importar un archivo de Photoshop

  1. En el menú Archivo, haga clic en Importar archivo de Adobe Photoshop.

  2. En el cuadro de diálogo Importar archivo de Adobe Photoshop, busque el archivo que desea importar y haga clic en Abrir.

    En el cuadro de diálogo Importar archivo de Adobe Photoshop, se muestra una vista previa del archivo PSD en el lado izquierdo. A la derecha hay una lista de las capas individuales del archivo junto con información importante sobre cada capa, así como una imagen de compatibilidad.

    Cuadro de diálogo Importar archivo de Adobe Photoshop

  3. En el cuadro de diálogo Importar archivo de Adobe Photoshop, haga lo siguiente:

    • Seleccione las capas que desee importar. También puede seleccionar Imagen de compatibilidad para importar una sola imagen combinada.

      Para obtener más información acerca de la imagen de compatibilidad, vea la sección titulada "Imagen de compatibilidad".

    • Si aparece un icono InformaciónIcono de información junto a una capa, revise la información colocando el puntero sobre el icono InformaciónIcono de información y, a continuación, siga uno de los siguientes procedimientos:

      • Si desea importar la capa como contenido editable, no combine ni acople las capas. La opción Contenido modificable de Importar capa como está seleccionada de manera predeterminada.

        important noteImportante:

        Si importa una capa como contenido editable, puede haber diferencias visuales entre cómo se muestra la capa en Photoshop y cómo se muestra en Expression Blend. Para obtener más información, vea "Contenido modificable" en la sección titulada "Icono Información".

        [!NOTA]

        Debido a la limitación de compatibilidad con algunas características de Windows Phone, algunas opciones de capa se establecen como Mapa de bits plano de manera predeterminada al importar un archivo PSD a un proyecto de Windows Phone.

      • Si desea conservar el aspecto de la capa, combine o acople las capas.

        Para combinar las capas, seleccione las capas que desea combinar, haga clic con el botón secundario y, a continuación, seleccione Agrupar para combinar.

        Para acoplar las capas, seleccione Mapa de bits plano en Importar capa como.

        important noteImportante:

        Las capas combinadas o acopladas se importarán como una única imagen rasterizada. Las capas combinadas o acopladas no son editables en Expression Blend. Para obtener más información, vea "Mapas de bits acoplados" y "Combinar capas" en la sección titulada "Icono Información".

    • Obtenga una vista previa de la imagen en el panel izquierdo para asegurarse de que se muestra de la forma deseada.

  4. Haga clic en Aceptar.

Al documento se agrega un nuevo objeto Canvas con el mismo nombre que el archivo importado. En el panel Objetos y escala de tiempo, bajo el objeto Canvas (denominado Photoshop_Layout en este ejemplo), están todas las capas que se importan como objetos. Si no se ha especificado una carpeta, se creará una nueva carpeta (denominada Photoshop_Layout_Images en este ejemplo) en la carpeta raíz del panel Proyectos que contendrá todos los archivos PNG asociados.

Panel Proyectos de Importar archivo de Adobe Photoshop

Imagen de compatibilidad

La imagen de compatibilidad es una instantánea de todas las capas visibles en el archivo PSD original. La imagen de compatibilidad se crea cada vez que se guarda un archivo PSD en Photoshop con la opción Maximizar compatibilidad seleccionada. Un archivo de imagen acoplada, que incluye todas las capas visibles, se genera, se guarda y se incluye una referencia al mismo en el archivo PSD guardado de manera automática.

Puede seleccionar la Imagen de compatibilidad para importar rápida y fácilmente el archivo PSD como una única imagen combinada. Esta opción es especialmente útil si no necesita capas editables y puede trabajar con un único mapa de bits acoplado en el que basar su trabajo en Expression Blend.

Para obtener una vista previa de la capa de compatibilidad, sitúe el puntero sobre la miniatura de capa de compatibilidad en el panel derecho.

Para importar la imagen de compatibilidad

  • En el cuadro de diálogo Importar archivo de Adobe Photoshop, seleccione la casilla Imagen de compatibilidad. Haga clic en Aceptar.

[!NOTA]

Al importar la capa de compatibilidad, no se importa ninguna de las otras capas.

Opciones y herramientas de capas

Expression Blend mantiene los nombres de capa, ya que importa las capas como objetos individuales y contenedores de diseño para facilitar el trabajo con ellos. Al importar archivos de Photoshop, es posible ver las capas, cambiarles el nombre, y seleccionar las capas que desea importar.

Selección de capas

Para elegir las capas que desea importar, active o desactive la casilla que aparece a la izquierda de cada capa.

Si desea importar todas las capas, seleccione la casilla Activar todas las capas para importarlas de la parte superior del panel.

Para anular la selección de todas las capas, desactive la casilla Activar todas las capas para importarlas.

Para importar una o más capas individuales, active o desactive la casilla para cada capa en el panel derecho.

La vista previa del panel izquierdo se actualiza cuando se cambia la selección de la capa.

Nombres de capa

Los nombres de capa de Photoshop se conservan y se muestran a la derecha de la miniatura de cada capa. Para cambiar el nombre de una capa, haga clic con el botón secundario en la capa y, a continuación, haga clic en Cambiar nombre, o haga doble clic en el nombre de la capa y escriba directamente en el campo del nombre de capa.

Miniaturas

Para mostrar una versión ampliada de la capa de Photoshop, sitúe el puntero sobre la miniatura de una capa en el panel derecho.

Importar vista previa de miniatura de archivo de Adobe Photoshop

Estructura y grupos de capas

La estructura y los grupos de capas creados en Photoshop se conservan. Los grupos se identifican fácilmente por las flechas Expandir Hh134795.6375953d-074c-421a-bbb3-6f5055b67b64(es-es,Expression.40).png y Contraer Contraer. Para ver la estructura de capas, haga clic en Expandir. Para contraer el grupo, haga clic en Contraer.

Tipos de capas

Cada capa incluye un icono Tipo que identifica la capa como uno de los siguientes elementos: imagen, vector o texto. El tipo de capa se muestra cuando se coloca el puntero sobre el icono Tipo.

Importar capa de imagen de archivo de Adobe Photoshop

Los objetos vectoriales y de texto pueden importarse como contenido editable o como mapas de bits acoplados. Para cambiar las opciones de importación de objetos vectoriales y de texto, haga clic en la capa y, a continuación, haga clic en Contenido modificable o Mapa de bits plano en Importar capa como.

Para obtener más información acerca de la importación de objetos como contenido editable, vea "Contenido modificable" en la sección titulada "Icono Información".

Para obtener más información acerca de la importación de objetos como de mapas de bits acoplados, vea "Mapas de bits acoplados" en la sección titulada "Icono Información".

[!NOTA]

Las opciones de importación aparecen debajo de la imagen de compatibilidad cuando está seleccionada una capa con contenido que puede importarse como contenido editable o un mapa de bits acoplado.

Las capas de imagen también pueden importarse como contenido editable o mapas de bits acoplados.

Por ejemplo, una capa de imagen puede tener una máscara de opacidad, una máscara vectorial y un estilo de capa de sombra paralela. Cuando esta capa se importa como contenido editable a Expression Blend, el siguiente contenido se agrega al proyecto:

  • El archivo de imagen en formato PNG

  • La máscara de opacidad en formato PNG

  • Una propiedad Clip para la máscara vectorial

  • Un efecto DropShadowEffect para el estilo de capa Sombra paralela

Si la capa de imagen se importa como un mapa de bits acoplado, se crea una única imagen rasterizada de las capas y el PNG resultante se importa a Expression Blend.

Icono Información

Si aparece el icono InformaciónIcono de información, sitúe el puntero sobre el icono para mostrar más información. La información sobre herramientas ofrece información adicional acerca de las características que se utilizan en el archivo PSD, pero que no se admiten en Expression Blend.

Importar InformationTooltip de archivo de Adobe Photoshop

[!NOTA]

Si un grupo contiene una capa que a su vez contiene una característica no admitida en Expression Blend, el icono Información aparecerá en la capa contenedor de ese grupo. Para obtener más información, expanda la lista de grupo para ver las capas individuales que muestran iconos Información.

Contenido editable

Si importa una capa como contenido editable, puede haber diferencias visuales entre cómo se muestra la capa en Photoshop y cómo se muestra en Expression Blend. Para cambiar la apariencia del contenido en Expression Blend, deben modificarse las propiedades del objeto.

En la tabla siguiente se incluyen los elementos de Photoshop que son editables en Expression Blend. Utilice la columna Descripción para buscar las propiedades del objeto a fin de modificarlas en Expression Blend.

Elemento de Photoshop

Elemento de Expression Blend (XAML)

Descripción

Capa de texto

TextBlock

Una capa de texto de Photoshop se importa como un objeto TextBlock  Hh134795.343296b4-5c7d-4145-84cc-91b08ba67a1b(es-es,Expression.40).png con las propiedades Text de Photoshop originales asignadas a las propiedades Text de Expression Blend. Las propiedades Text se encuentran en la categoría Texto del panel Propiedades.

NoteNota:
Para obtener más información sobre cómo trabajar con objetos TextBlock en proyectos WPF y Silverlight, vea Agregar un objeto al flujo de texto.

Capa de forma

Path

Una capa de forma de Photoshop se importa como un objeto Path con las propiedades de máscara vectorial originales asignadas a las propiedades Data de Expression Blend. Las propiedades Data se encuentran en el campo Data de la categoría Apariencia del panel Propiedades.

Relleno de color sólido

Path

Un relleno de color sólido de Photoshop se importa como un objeto Path con la propiedad Fill original asignada a las propiedades Color y OpacityMask de Expression Blend aplicadas a un Pincel de color sólido Hh134795.3a66ec96-47bb-47fc-8876-6b9456feec3a(es-es,Expression.40).png. Las propiedades de Solid color brush se encuentran en la categoría Pinceles del panel Propiedades.

Relleno de degradado lineal

Path

Un relleno de degradado lineal de Photoshop se importa como un objeto Path con la propiedad Fill original asignada a las propiedades del pincel de Degradado linealHh134795.bd5eefed-9628-4363-be5d-29bfb5962175(es-es,Expression.40).png de Expression Blend aplicadas a un Pincel de degradadoHh134795.91fb0c61-7b3b-4ae7-8a59-760e625e3bd7(es-es,Expression.40).png. Las propiedades del pincel de Degradado lineal se encuentran en la categoría Pinceles del panel Propiedades.

Relleno de degradado radial

Path

Un relleno de degradado radial de Photoshop se importa como un objeto Path con la propiedad Fill original asignada a las propiedades del pincel de Degradado radialHh134795.4279aa9a-15c2-4435-9937-6848afc38618(es-es,Expression.40).png de Expression Blend aplicadas a un Pincel de degradadoHh134795.91fb0c61-7b3b-4ae7-8a59-760e625e3bd7(es-es,Expression.40).png. Las propiedades del pincel de Degradado radial se encuentran en la categoría Pinceles del panel Propiedades.

Relleno de motivo o relleno de degradado no admitido (diamante, ángulo, reflejado)

Path

Un relleno de motivo o un relleno de degradado no admitido de Photoshop se importa como un objeto Path con la propiedad Fill original asignada a las propiedades Fill de Expression Blend aplicadas a un pincel ImageBrush. Las propiedades de ImageBrush se encuentran en la categoría Pinceles del panel Propiedades.

Agrupar

Canvas

Un grupo de Photoshop se importa como un objeto Canvas  Hh134795.95e40288-f7a6-4ddc-9d6a-68d0aa46d621(es-es,Expression.40).png con las capas individuales importadas como elementos secundarios del elemento Canvas .

Capa de imagen

Image

Una capa de Photoshop se importa como un objeto Image . Además, se agrega al proyecto un archivo PNG. El archivo PNG es el origen del objeto Image . Cada capa se importa como un objeto Image con un archivo PNG correspondiente.

Estilo de capa de sombra paralela

DropShadowEffect

Al importar un estilo de capa de sombra paralela, se aplica un efecto DropShadowEffect al objeto importado. Para editar el efecto de sombra paralela, seleccione el efecto DropShadowEffect aplicado en el panel Objetos y escala de tiempo y edite las propiedades directamente en el panel Propiedades.

NoteNota:
DropShadowEffect no se admite en proyectos de Windows Phone.

Máscara de capa

OpacityMask aplicado a un ImageBrush

Una máscara de capa de Photoshop se importa como una máscara OpacityMask aplicada a un pincel ImageBrush . Las propiedades de OpacityMask se encuentran en la categoría Pinceles del panel Propiedades. Además, se agrega al proyecto un archivo PNG. El archivo PNG es el origen del elemento ImageBrush .

NoteNota:
Las máscaras de capa son compatibles con los proyectos de Windows Phone, pero no se recomienda usarlas.

Máscara vectorial en capa de imagen o texto

Propiedad Clip de un objeto Image o TextBlock

Una máscara vectorial de Photoshop en una capa de imagen o texto se importa como una propiedad Clip aplicada a un objeto Image o TextBlock . Las propiedades de Clip se encuentran en la categoría Varios del panel Propiedades.

NoteNota:
La propiedad Clip tiene una compatibilidad limitada en los proyectos de Windows Phone.

Para importar una capa como contenido editable

  • Si desea importar la capa como contenido editable, no combine ni acople las capas. La opción Contenido modificable de Importar capa como está seleccionada de manera predeterminada.

    [!NOTA]

    Debido a la limitación de compatibilidad con algunas características de Windows Phone, algunas opciones de capa se establecen como Mapa de bits plano de manera predeterminada durante la importación al trabajar en un proyecto de Windows Phone.

Mapas de bits acoplados

Importar una capa como mapa de bits acoplado crea una imagen rasterizada (en formato PNG) de esa capa. Acoplar el mapa de bits rasteriza todos los estilos de capa asociados a esa capa. El archivo PNG se utiliza como origen del objeto Image .

Para importar una capa como mapa de bits acoplado

  • Seleccione la capa que desea importar como mapa de bits acoplado y, a continuación, seleccione Mapa de bits plano en Importar capa como en la parte inferior del cuadro de diálogo Importar archivo de Adobe Photoshop.

Combinar capas

Importar dos o más capas combinadas crea una única imagen rasterizada en formato PNG. El archivo PNG se utiliza como origen del objeto Image .

Para combinar capas

  • Para seleccionar las capas recomendadas, mantenga presionada la tecla CTRL y haga clic en las capas recomendadas. Haga clic con el botón secundario en la selección y, a continuación, haga clic en Agrupar para combinar.

[!NOTA]

Para deshacer la combinación, seleccione las capas combinadas y haga clic en Desagrupar capas.

Estilos de capa

Si se ha aplicado un estilo de capa a una capa, aparece el icono Efecto de capa Icono de efectos junto a la capa. Para importar un estilo de capa, se puede seleccionar la opción de importación Mapa de bits plano o combinar la capa con otras capas.

Para obtener más información acerca de cómo acoplar o combinar capas, vea la sección titulada "Icono Información".

Importar capa de efectos de archivo de Adobe Photoshop

tip noteSugerencia:

Sitúe el puntero sobre el icono InformaciónIcono de información para mostrar instrucciones sobre cómo importar estilos de capa.

Máscaras

Las máscaras vectoriales y de capa se muestran como una miniatura independiente en la capa asociada. Las máscaras tanto de capa como vectoriales se importan cuando se selecciona la capa asociada.

Las máscaras de capa se importan como máscaras de opacidad y se encuentran en la categoría Pinceles del panel Propiedades.

Las máscaras vectoriales se importan como trazados o se aplican como trazados de recorte al objeto importado. Por ejemplo, un relleno sólido con una máscara vectorial se importará como un objeto vectorial mediante el relleno y la geometría de la máscara. Una imagen con una máscara vectorial se importará como un objeto de imagen con una máscara de recorte mediante la geometría de la máscara vectorial.

Importar máscara vectorial de archivo de Adobe Photoshop

Para obtener más información acerca de la importación máscaras vectoriales y de capa, vea "Contenido modificable" en la sección titulada "Icono Información".

Si se ha aplicado una máscara de recorte a una capa, el icono Máscara de recorte aparece junto a la capa. Para importar una máscara de recorte, seleccione todas las capas de la máscara de recorte y la capa a la que apuntan y combínelas.

Importar máscara de recorte de archivo de Adobe Photoshop

Para obtener más información acerca de cómo combinar capas, vea la sección titulada "Icono Información".

Sitúe el puntero sobre el icono InformaciónIcono de información para mostrar instrucciones sobre cómo importar máscaras de recorte.

Compatibilidad de características de Photoshop en Expression Blend

Se admiten las siguientes características de Photoshop en Expression Blend. Donde se indique, las características pueden editarse en Expression Blend.

Estilos de texto

Los estilos de texto de Photoshop se asignan a las propiedades Text aplicadas a un objeto TextBox en Expression Blend.

Los siguientes estilos de texto se importan desde Photoshop y son editables en Expression Blend:

  • FontFamily

  • FontSize

  • Foreground

  • Underline

  • Subscript (sólo WPF)

  • Superscript (sólo WPF)

  • StrikeThrough (sólo WPF)

  • FauxBold

  • FauxItalic

  • Text

  • AllCaps

  • Alinear texto a la izquierda

  • Centrar texto

  • Alinear texto a la derecha

  • AuthoHyphenate (sólo WPF)

  • RenderTransform (sólo escalar)

Para obtener más información sobre el contenido editable en Expression Blend, vea "Contenido modificable" en la sección titulada "Icono Información".

Modos de fusión

Para mantener el aspecto de los modos de fusión, combine las capas relacionadas. Cuando se combinan las capas relacionadas, la fusión se aplica a la imagen rasterizada que se importa para ese grupo.

Para obtener más información acerca de cómo combinar capas, vea "Combinar capas" en la sección titulada "Icono Información" anteriormente en este tema.

Capas de ajuste

Las siguientes capas de ajuste se importan desde Photoshop:

  • Brillo/Contraste

  • Blanco y negro

  • Mezclador de canales

  • Balance de color

  • Curvas

  • Exposición

  • Invertir

  • Niveles

  • Posterizar

  • Filtro de fotografía

  • Umbral

  • Mapa de degradado

  • Tono/Saturación

  • Corrección selectiva

  • Intensidad

Para mantener el aspecto de las capas de ajuste admitidas, combine las capas relacionadas. Cuando se combinan las capas relacionadas, la capa de ajuste se aplica a la imagen rasterizada que se importa para ese grupo.

tip noteSugerencia:

Puede mostrar una versión ampliada de la imagen original con la capa de ajuste aplicada si coloca el puntero sobre la miniatura. Para obtener una vista previa de la imagen tal como se importará a Expression Blend, seleccione o anule la selección de las capas con las capas de ajuste asociadas aplicadas y, a continuación, visualice la imagen en el cuadro de diálogo Importar archivo de Adobe Photoshop.

Para obtener más información acerca de cómo combinar capas, vea "Combinar capas" en la sección titulada "Icono Información", anteriormente en este artículo.

Estilos de capa

Expression Blend admite la importación y la edición del estilo de capa de sombra paralela.

Al importar un estilo de capa de sombra paralela, se aplica un efecto DropShadowEffect al objeto importado. Para editar el efecto de sombra paralela, seleccione el efecto DropShadowEffect aplicado en el panel Objetos y escala de tiempo y edite las propiedades directamente en el panel Propiedades.

[!NOTA]

Cuando un estilo de capa de sombra paralela se importa como contenido editable, la interpretación puede no coincidir con la presentación visual en Photoshop. Cuando se acopla o se combina un estilo de capa de sombra paralela, la interpretación coincide con la presentación en Photoshop, pero deja de ser editable.

Para obtener más información sobre el estilo de capa de sombra paralela en Expression Blend, vea "Contenido modificable" en la sección titulada "Icono Información", anteriormente en este documento.

Para mantener el aspecto de los estilos de capa admitidos pero no editables, combine las capas relacionadas. Cuando se combinan las capas relacionadas, los estilos de capa se aplican a la imagen rasterizada que se importa para ese grupo.

Expression Blend admite los siguientes tipos de capa, pero no son editables:

  • Sombra interior

  • Resplandor exterior

  • Resplandor interior

  • Bisel y relieve

  • Satinado

  • Superposición de colores

  • Superposición de degradado

Para obtener más información acerca de cómo combinar capas, vea "Combinar capas" en la sección titulada "Icono Información", anteriormente en este artículo.

No se admiten los siguientes estilos de capa:

  • Superposición de motivo

  • Trazo

Degradados

Expression Blend admite la importación y modificación de degradados lineales y radiales. Todos los demás tipos de degradado se rasterizan en la importación y no son editables en Expression Blend. Los delimitadores de color se importan como pinceles de degradado para la propiedad Fill del objeto resultante en Expression Blend, y los delimitadores de opacidad se importan como pinceles de degradado para la propiedad OpacityMask.

[!NOTA]

Cuando un degradado lineal o radial se importa como contenido editable, la interpretación puede no coincidir con la presentación visual en Photoshop. Cuando se acopla o se combina un degradado lineal o radial, la interpretación coincide con la presentación en Photoshop, pero deja de ser editable.

Motivos

Un motivo se importa como un objeto Path con la propiedad Fill original asignada a las propiedades Fill de Expression Blend aplicadas a un pincel ImageBrush .

Para obtener más información acerca de los motivos, vea "Contenido modificable" en la sección titulada "Icono Información".

Vea también

Conceptos

Insertar imágenes y material gráfico
Importar un archivo de Adobe Photoshop

Otros recursos

Dibujar objetos

Copyright © 2011 de Microsoft Corporation. Reservados todos los derechos.