¿Quieres registrarte?

TextField que se adapte al tamaño de la ventana con scroll

Por: Zguillez
18 de Octubre del 2006
7273 de clabLevel
Otros artículos de Zguillez
15,738 visitas

Acabo de sacar un código para controlar que un campo de texto liquido se adapte al tamaño de la ventana y en caso de no visualizarse entero aparezca de forma automatica los botones de scroll.

Aqui les enseño el ejemplo.

Reduzcan el alto de la ventana para ver el efecto...

Y este es el código. Para ver el efecto, copialo y pegalo en el primer keyframe de tu pelicula.

Código :

function creaTexto() {
   //
   posx = 20;
   posy = 20 - (Stage.height - 400) / 2;
   alto = Stage.height - 40;
   ancho = 300;
   //
   this.createTextField("my_txt", 1, posx, posy, ancho, alto);
   my_txt.border = false;
   my_txt.multiline = true;
   my_txt.wordWrap = true;
   var my_fmt:TextFormat = new TextFormat();
   my_fmt.color = 0x000000;
   //texto falso...
   my_txt.text = "Ser una estrella de rock es difícil... no, empezaré de nuevo. Las últimas conferencias de Flex en Parquesoft (De las que hablaré pronto) y otros viajes aparte han hecho que olvide hablarles de algunas cosas que pasan en nuestra comunidad Flashera y que vale la pena resaltar. La primera de ellas es la fundación de GarageFlash, el nuevo Flash User Group peruano que nos sorprende con conferencias bimensuales de temas relacionados con el medio. En su primera edición estará Oscar Trelles con 'Flash: Guía Practica de Supervivencia, Ilustrada'; luego vendrá Giancarlo Vargas de Bluemetal (Amigo incondicional de Cristalab) con 'Proceso Creativo y técnico para alcanzar los objetivos de un proyecto'. Suenan bastante divertidas, así que si eres de Perú, no olvides registrarte. Suerte a la gente de GarageFlash, que por cierto, fue fundada por Eldervaz, un compañero del foro (Que escapó de Clab con heridas casi mortales ¡Te encontraremos donde te escondas!)";
   my_txt.text += my_txt.text;
   //...
   my_txt.setTextFormat(my_fmt);
   if (my_txt.maxscroll > 1) {
      creaScroll();
   }
}
function creaScroll() {
   this.attachMovie("b_scroll", "b_scroll1", this.getNextHighestDepth());
   this.attachMovie("b_scroll", "b_scroll2", this.getNextHighestDepth());
   this.attachMovie("b_roll", "b_roll", this.getNextHighestDepth());
   b_scroll1._x = b_scroll2._x = b_roll._x = my_txt._x + my_txt._width + 10;
   b_scroll1._y = my_txt._y;
   b_scroll2._y = my_txt._y + my_txt._height - b_scroll2._height;
   b_roll._y = b_scroll1._y + b_roll._height;
   //
   b_scroll1.onRelease = function() {
      my_txt.scroll--;
      controlaScoll();
   };
   b_scroll2.onRelease = function() {
      my_txt.scroll++;
      controlaScoll();
   };
}
function controlaScoll() {
   lineas = my_txt.maxscroll;
   trace(lineas);
   dist = (b_scroll2._y - b_scroll2._height) - (b_scroll1._y + b_scroll1._height);
   dist1 = dist / (lineas - 1);
   b_roll._y = b_scroll1._y + b_scroll1._height + dist1 * (my_txt.scroll - 1);
}
//-----------------------------------
Stage.scaleMode = "noScale";
var listener:Object = new Object();
listener.onResize = function() {
   xscroll = my_txt.scroll;
   removeMovieClip(my_txt);
   removeMovieClip(b_scroll1);
   removeMovieClip(b_scroll2);
   removeMovieClip(b_roll);
   creaTexto();
   my_txt.scroll = xscroll;
   controlaScoll();
};
Stage.addListener(listener);
//-----------------------------------
creaTexto();
stop();



Este código es solo un esbozo... pero es un comienzo

Espero les sirva de algo ;)

Enviar a twitter Enviar a facebook


También te interesa


Etiquetas actionscript

Comentarios | Enviar un comentario
mira aca hay uno parecido
http://www.after-hours.org/blog/2005/actionscript/browserScroll/
Por: ramiro_olver@

ramiro_olver@ :

mira aca hay uno parecido
http://www.after-hours.org/blog/2005/actionscript/browserScroll/

Interesante el efecto de ese scroll.
Pero este no es exactamente lo mismo... este es unicamente para mostrar un scroll en un textfield cuando por el tamaño de la ventana impida visualizar todo el texto.. no incluye el resto de la pelicula.
Es util para cuando cambiamos el tamaño de la tipografia pero por tema de diseño queremos mantener el tamaño del bloque de texto, entonces aparece automaticamente el scroll...
Por: Zguillez
Añadí unos botones para ampliar y reducir el texto del textField y verán como automáticamente aparecen los scrolls :wink:
Por: Zguillez
Seria mas c00l si al scroll se le pudiera dar click y arrastrar hacia arriba o abajo moviendo el contenido. Buen tip.
Por: NEO_JP
Si, si, claro, esa es la idea... esta es solo una primara version del codigo, aun lo tengo que mejorar.
Por: Zguillez

Zguillez :

Si, si, claro, esa es la idea... esta es solo una primara version del codigo, aun lo tengo que mejorar.

Sí, seguro que llegas a algún sitio interesante... a los componentes de Flex por ejemplo XD XD XD
Está muy bien ^^ ... podrías hacer que también funcionase horizotalmente (cuando haces la ventana demasiado estrecha aunque sólo sea por joder XD ) y una barra de scroll proporcionada al contenido visible (aunque esto ahora mismo no se me ocurre cómo podría ser...)
Por: Zah
[quote="zah"]

Zguillez :

... podrías hacer que también funcionase horizotalmente (cuando haces la ventana demasiado estrecha aunque sólo sea por joder XD ) y una barra de scroll proporcionada al contenido visible (aunque esto ahora mismo no se me ocurre cómo podría ser...)

¿quieres un scroll horizontal? pues aqui lo tienes con scroll horizontal.

Lo solucioné colocando el field dentro de un MovieClip con una mascara:

Código :

this.createEmptyMovieClip("clip_texto", this.getNextHighestDepth());
clip_texto.createTextField("txt", 1, posx, posy, ancho, alto);


Con el onResize controlo en tamaño de la mascara y con otra función controlo la posicion _x del field dentro de la mascara:

Aqui dejo el codigo completo. Todo el va en el mismo fotograma.
Por: Zguillez
quiero mirar calle 13
Por: joe willy_blog
:cool: Esta bien padre.

Gracias :D
Por: Pley
Sera una mala práctica de diseño crear un tabla con scroll dentro de una ventana con scroll?
Por: Edgar Equihua_blog
HOLA CHICOS COMO ESTAS OYAN TENGO UNPROBLE YA QUE QUIERO AMPLIAR EL ESPACION DE textfield PERO NO PUEDO PUEDEN AYUDARME PORFIS
Por: ISABELA-blog
quisiera el codigo completo, justo lo estoy necesitando pero no funkan los link ni tampoco el del ejemplo,porfavor alquien podria ayudarme. gracias
Por: xanita
muy chulo todo y estaría mejor si los links funcionaran ;)
Por: Bennu
Deja un comentario
IMPORTANTE

Recuerda ser respetuoso, no insultes a otras personas, ni uses palabrotas, hay una persona al otro lado de la pantalla.

Habla bien, NO ESCRIBAS EN MAYUSCULA TODO, no escribas como en un SMS, evita cosas como "ke", "x q" y demás abreviaciones.

Aquí funcionan las etiquetas de los foros, puedes usar [b] para negrita, [img] para las imágenes, [url] para los enlaces, etc.

Si tienes preguntas técnicas, envíalas mejor al foro.