某些 Creative Cloud 应用程序、服务和功能在中国不可用。
Cuando crea un diseño de XD, a veces una mesa de trabajo no es lo suficientemente larga para adaptarse al contenido. Al alargar una mesa de trabajo y elegir opciones basadas en sus necesidades de diseño, puede desplazar verticalmente una mesa de trabajo para adaptarse a diferentes tamaños de dispositivos.
El desplazamiento vertical ayuda a simular efectos de desplazamiento al diseñar listas desplegables o sitios web. Sin embargo, puede utilizar grupos de desplazamiento para agregar un nuevo nivel de interacción al diseñar interfaces, mapas y galerías de imágenes horizontales de varios paneles.
-
En el modo Diseño, seleccione las siguientes opciones en el Inspector de propiedades:
- Desplazamiento: seleccione Vertical o Ninguno.
- Fijar posición al desplazarse: seleccione esta opción para fijar los elementos de diseño en una posición fija y así evitar el desplazamiento con el contenido.
- Altura de ventana gráfica: especifique la altura de la ventana gráfica a través de la cual puede ver la mesa de trabajo.
Puede aplicar un efecto de desplazamiento vertical para mover el contenido de la mesa de trabajo hacia arriba y hacia abajo.
Desplazamiento vertical en una mesa de trabajo -
En el modo Prototipo, seleccione las siguientes opciones en el Inspector de propiedades:
- Preservar posición de desplazamiento: realiza la transición a la siguiente mesa de trabajo a la vez que mantiene la posición de la mesa de trabajo anterior. Vea esta publicación de Twitter para obtener más detalles.
- Fijar posición al desplazarse: fija los elementos de diseño en una posición fija para evitar el desplazamiento con el contenido.
Preservar posición de desplazamiento
Fijar posición al desplazarse
. Arrastre la ventana de vista previa para ver el desplazamiento vertical.¿Desea trabajar con mesas de trabajo predefinidas para crear una lista vertical desplegable y desplazable?
- Use la herramienta Seleccionar para hacer clic en el nombre de la mesa de trabajo o arrastrar por las mesas de trabajo. También puede hacer clic en el nombre de una mesa de trabajo en el panel Capas para seleccionarla en la ventana Documento.
- Para alargar la mesa de trabajo seleccionada, arrastre hacia abajo el punto inferior de la mesa de trabajo. Una línea de puntos indica la altura original de la mesa de trabajo.
- Puede obtener una vista previa del desplazamiento en una mesa de trabajo directamente en XD, usando la opción Vista previa de escritorio.
Descargue los archivos de muestra y pruébelos o vea este vídeo para obtener más información.
Tiempo de visualización: 1 minuto.
A medida que va creando sus diseños para escritorio o dispositivos móviles, ¿le gustaría ver partes del sitio web solo cuando se desplazan y fijar los elementos de diseño sin que floten? Vea este vídeo para obtener más información sobre mesas de trabajo con desplazamiento y elementos fijados.
Tiempo de visualización: 1 minuto.
También puede consultar la comunidad de XD para obtener más tutoriales y archivos de muestra.
Para crear efectos de desplazamiento horizontal en los diseños, use grupos de desplazamiento. Los grupos de desplazamiento le permiten crear prototipos de ventanas de contenido que se pueden desplazar horizontalmente, verticalmente o en ambas direcciones.
“Los encabezados permanentes y otros elementos fijos son como las señales de la carretera: los usamos para garantizar que continuamos aportando información relevante a la sección correspondiente o ayudando a los clientes en su viaje a través de llamadas a la acción”. Palabras de Oliver Lindberg. Consulte el blog sobre prácticas recomendadas para el diseño de encabezados permanentes y otros elementos fijos.