Aplicar Efecto De Scroll Con Flash 8
Adobe Flash Tutorial. Programación de botones para un scroll básico. Talvez en alguna ocasión has tenido la necesidad de colocar un scroll a un campo de texto y es por eso que esta leyendo este tutorial jajaj J. Hay scroll los cuales contienen demasiado código action script, sin embargo esta explicación solamente cuenta con un solo símbolo de tipo botón, y este funciona para que el scroll funcione tanto hacia arriba (up) como hacia abajo (down). Cabe mencionar que todo el proceso se lleva acabo en la ecena para no hacer complicado el tuto. Sin más preámbulos que mencionar ¿comenzamos?
Good luck
1-. El primer paso para hacer el tutorial es hacer el documento (ctrl. + J) en el cual se va a trabajar.
a)-. El documento para este caso es de dimensiones 315 * 150 píxeles de ancho y alto.
b)-. Colocar como color de fondo #FFFFFF o el color que más sea de tu agrado.
c)-. La velocidad de fotogramas que usaras en esta ocasión será 12 fps.

2-. Crear el único y solitario símbolo (ctrl. + F8). Como el documento flash solamente cuenta con este símbolo colocar como nombre botón up dowm.
a)-. Seleccionar en Tipo la opción Botón.

3-. Una ves que estés ubicado en el símbolo botón up down diseñar un botón de dos estados (Reposo y Sobre).
a)-. El diseño del botón de preferencia que sea en forma de flecha ya que este te indicara si el scroll va hacia arriba o abajo.
b)-. Las dimensiones que te propongo son de 20.0 * 25.0 píxeles de ancho y alto.
c)-. Después de haber diseñado el botón colocarlo en coordenadas X = 0.0 y Y = 0.0.

4-. Para continuar con la realización del scroll, regresar a la Escena.
a)-. Arrastrar desde la Biblioteca el símbolo.
b)-. Presionar sobre la Herramienta Transformación libre (Q), seleccionar el símbolo y tomarlo por uno de los extremos de la esquina y rotarlo 180º.
c)-. Después de que lo hayas rotado 180º colocarlo en coordenadas X = 290.0 y Y = 10.5.

5-. Seleccionar el símbolo una ves que este rotado 180º y luego abrir el panel de Acciones – botón. Este script te permitirá desplazar el texto hacia arriba.
a)-. Introducir el siguiente código action script
on (press, keyPress “<Up>”) {
texto_scroll.scroll -= 5;
}

6-. Arrastrar nuevamente desde la biblioteca el símbolo, ya no se tiene que rotar el símbolo porque el diseño del paso # 3 esta en la posición que indica hacia abajo.
a)-. Colocar el símbolo en coordenadas X = 290.0 y Y = 115.5.

7-. Seleccionar el símbolo y luego abrir el panel de Acciones – botón. El siguiente script te permitirá desplazar el texto hacia abajo.
a)-. Introducir el siguiente código action script.
on (press, keyPress “<Down>”) {
texto_scroll.scroll += 5;
}

8-. Introducir un campo de Texto dinámico, colocar como nombre de instancia texto_scroll.
a)-. Las dimensiones del campo de texto son 283.9 * 150.8 píxeles de ancho y alto.
b)-. Colocar el campo de texto en coordenadas X = 0.0 y Y = 0.0.
c)-. En la opción Tipo de línea seleccionar Multilínea.
Nota como puedes apreciar en la imagen el campo de texto presenta un cuadro de color blanco y esto no permitirá que se introduzca el texto en forma correcta.

9-. Para que el truco del scroll funcione correctamente, tendrás que seleccionar el campo de texto por uno de sus extremos.
a)-. Si seleccionas correctamente el campo de texto aparecerá un submenú emergente, y en este menú seleccionar la opción Desplazamiento permitido.

10-. Si realizaste el paso anterior correctamente el cuadro que aparecía en la parte inferior derecha de color blanco, cambiara el color a negro tal y como se muestra en la imagen.
a)-. Por último procede a introducir el texto que quieras que aparezca en la web. El campo de texto no perderá las dimensiones por más texto que le introduzcas.
Con este paso doy por concluido el tutorial espero que sea de ayuda para tus propósitos.
well done

P.D. Presionar ctrl. + Enter para visualizar el trabajo realizado presionar las flechas para desplazar el texto tanto arriba como hacia abajo.
Hasta pronto
Comentarios
Qué opinas sobre este artículo ?, dejanos tu opinión . Tienes algo que agregar ? hazlo ahora.
Trackbacks & Pingbacks
Comentarios
Deja tu comentario
Las líneas y párrafos son automaticas, el e-mail no se despliega nunca, HTML permitido: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>


hola, antes que nada te felicito por tan buenos tutoriales, y bueno mi pregunta o mas bien mi duda es en uno de los tutoriales que sacaste tambien de efecto scroll, para ser mas especifico el de la galeria de fotos de modelos, y bueno me sale todo pero al momento de la visualización no me aparecen los botones de modelo 1 modelo 2 modelo 3 etc, todo me lo muestra bien ecepto eso, espero y me puedas responder te lo agradeceria muchisimo, le busque de mil maneras y comparaba mi archivo con el tuyo pero no no encontre la falla, espero me ayudes de favor.
De verdad que es muy sencillo, pero yo desearia poder hacer un roolover que activara un scroll que se detuviera en un rolout y no lo consigo podrias ayudarme?
Es muy sencillo cierto es…..pero yo desearia que rollover activara el scroll y se detuviera unicamente en rolout….y no lo consigo.podrias ayudarme?
GRACIAS
hola, he seguido este tutorial de manera que pudiese meter mi curriculum en un campo de texto dinamico y scrollable hasta ahi no hay problema incluso lo pude copiar y pegar directamente en formato word.
Mi problema es el siguiente, mi curriculum lleva una foto en la primera hoja, con mi cara no se como hacer para que esa foto se mueva a la vez que el texto y no se quede en el mismo lugar tapando el texto de mas abajo al scrollear hacia abajo.
He intentado darle un nombre de instancia y darle la misma orden que a texto_scroll. pero no funciona… al fin y al cabo no se trata de texto sino de un archivo jpg. ¿ Se te ocurre alguna solucion? Gracias de antemano, es estupendo lo que gente como yo aprende con gente como tu. Salu2.
MUchisimas gracias. Para CS3 hay que cambiar las comillas!!!!!!!!!
Super Facil… Gracias
gracias….
gracias tambien a leonardo…
por lo de las comillas…