Material necesario para empezar a trabajar:

       Macromedia Flash MX
      
    
         Autora del tutorial: Lilian´s Design
     


Realización:

En este ejercicio estudiaremos:

  • El uso de los paneles: Alinear.

Nota: Este tutorial y sucesivos estarán actualizados a la versión Flash MX 2004. Es conveniente que mantengas abierto el programa y realices las prácticas al tiempo que estudias la materia.

 

En Flash tenemos a nuestra disposición varios grupos de paneles para facilitarnos nuestro trabajo. Vamos a centrar nuestra atención en el grupo de paneles de diseño. Estos, los podremos ver en la barra de menú Ventana - Paneles de diseño, y en el desplegable elegiremos cualquiera de ellos. Comenzaremos pues con el panel Alinear y su atajo de teclado es Control + K.


Este panel sirve para alinear un grupo de elementos en el escenario. También puede distribuir equitativamente un grupo de objetos o forzar a que dichos objetos sean del mismo tamaño o ajustar el espaciado.

Vamos a jugar un poco con todos estos botones :) Trazaremos un conjunto de rectángulos de varios tamaños tal como se ve en la figura inferior:

Para aplicar un alineamiento previamente hemos de seleccionar todos los objetos, para ello clic en la herramienta de Selección y los marcamos todos. Luego haremos clic en el primer icono, Alinear a la izquierda y podremos comprobar cómo los bordes izquierdos de todos los rectángulos se alinearán.

En este otro icono veremos que se alinean horizontalmente con respecto al centro de cada rectángulo, es decir, todos sus centros se alinean.

Con este otro botón se alinearán con respecto a su borde derecho.

La siguiente hilera de botones hace exactamente lo mismo solo que verticalmente, como vemos en la figura lateral todos los rectángulos se han alineado con respecto al borde superior. El siguiente icono lo hará con respecto al centro verticalmente, y el tercer icono se alineará con respecto al borde inferior.

Reordenamos nuevamente los objetos:

Aplicamos la opción distribuir borde superior y como podemos ver en la imagen superior, aparentemente no parece que haya habido cambios ya que todas las figuras son de diferente tamaño, pero si nos fijamos bien, todos los bordes superiores están separados por la misma distancia.

Si aplicamos la opción distribuir verticalmente con respecto al centro, todos los centros estarán separados por la misma distancia.

Con la opción distribuir borde inferior, todos los bordes inferiores estarán separados por la misma distancia. La siguiente hilera es exactamente igual solo que para alineaciones horizontales. Es importante saber que Flash tomará como referencia los objetos ubicados más hacia afuera para alinear. En este último caso, tomaría como referencia el rectángulo superior y el inferior, y esos dos no se moverían del sitio, solo los dos del medio se redistribuirían.

El siguiente grupo de tres, coincidir tamaño, es útil por ejemplo cuando diseñamos botones. Con estas opciones podemos hacer coincidir el tamaño de los botones, tanto en anchura, altura como ambas opciones a la vez, anchura y altura.

El siguiente grupo de dos botones son un poco similares a los que hemos visto anteriormente de Alinear, la única diferencia es que los espaciados entre objetos serán todos exactamente iguales ya sea en vertical o en horizontal.

El último botón que nos queda a la derecha del todo es para alinear en función del escenario. Mejor lo veremos con un ejercicio práctico.

Ejercicios propuestos:

  • Trazar 4 rectángulos verticales

  • hacer que coincidan el tamaño tanto en ancho como en alto

  • Asegurarse de que está deseleccionado el botón Distribuir en Escenario.

  • Seleccionar todos los objetos

  • Activar el botón Distribuir en Escenario

  • Distribuir los objetos con respecto al borde superior.

  • Para mostrar el ejercicio realizado, hacerlo con una captura de pantalla.