Comunidad de diseño web y desarrollo en internet online

COMO ESCALAR UN CUADRO

Citar            
MensajeEscrito el 26 May 2009 10:26 pm
hola , quisiera hacer un cuadro que va creciendo segun se va recorriendo un scroll a lo alto y ancho( por columnas y modulos), por ejemplo si mi unidad o cuadro mas pequeño mide de alto 5 px x 10px de base, si alguien recorre el scroll hacia la derecha, el cuadro mida 5px X 20px y si lo recorre hacia arriba mida ahora 10px de alto x los 20 px...., es decir que vaya creciendo, pero no en porcentajes sino dependiendo de como se recorre el scroll hacia arriba y a la derecha....asi hasta llegar a un cuadro mas grande que mida 500 x 300 px (50 modulos x 6 columas)

Ojala puedan asesorarme, no tengo idea de como empezar...

saludos a todos

Por rocio8225

11 de clabLevel



 

msie
Citar            
MensajeEscrito el 27 May 2009 06:15 am
jeje, me emociono la pregunta y me puse a hacer experimentos, perdon por la tardanza
te explico

tengo esto en el escenario

limit.
-movieclip de 50x50 que dentro tiene dos movieclips
*scroll (es la bolita que sera arrastrada)
*background (inutil)

cuadro.
-sera el que se escale

lo que hize fue que se multiplique el valor de la posicion de scroll dentro de limit, por un valor que defines tu
asi se logra escalar tanto en X como en Y dependiendo de la posicion del scroll
el codigo es algo parecido a esto:

Código ActionScript :

//valor de escala EJ... 1:2
valor = 2;

//esta es la funcion que le dara la medida dependiendo de la posicion de scroll por el valor asignado
//el 5 que se suma al final viene a ser la medida minima de la figura 5x5
function escala (val) {
   cuadro._width = (val * limit.scroll._x)+5;
   cuadro._height = (-val * limit.scroll._y)+5;
}

//cuando se mueve el mouse, revisa si esta dentro de limit, si es asi mueve scroll
onMouseMove = function () {
   if(limit.hitTest(_xmouse,_ymouse)){
      limit.scroll.startDrag(this,1,0,50,-50,0);
      escala(valor);
   }
   else{
      limit.stopDrag();
   }
}


puedes ponerle valores diferentes a multiplicar en la funcion para que se escale de forma rectangular por ejemplo (cambiando val por un valor definido)

esto fue lo que logre yo
el cuadro de texto te deja cambiar la escala (1:1, 1:2, 1:3)




suerte

Por tribak

Claber

2448 de clabLevel

6 tutoriales

Genero:Masculino   Héroes

Fotógrafo o algo

firefox
Citar            
MensajeEscrito el 27 May 2009 05:46 pm
Tribak, eres un genio¡¡¡ de verdad muchas gracias por tu ayuda, ahora estoy tratando de que al darle clic en una zona del limite, se mantenga el cuadro y no se siga moviendo..y que en un cuadro de texto dinamico se establezcan las medidas del cuadro, que se seleccionó...pero ya con tu aporte me has ayudado demasiado¡¡

gracias de nuevo¡¡ :D

Por rocio8225

11 de clabLevel



 

msie
Citar            
MensajeEscrito el 27 May 2009 06:41 pm

Código ActionScript :

limit.scroll.onPress = function () {
   limit.scroll.startDrag(this,1,0,50,-50,0);
}
limit.scroll.onRelease = function () {
   limit.scroll.stopDrag();
}


onMouseMove = function () {
      escala(valor);
      w.text = cuadro._width;
      h.text = cuadro._height;
}

Por tribak

Claber

2448 de clabLevel

6 tutoriales

Genero:Masculino   Héroes

Fotógrafo o algo

firefox
Citar            
MensajeEscrito el 27 May 2009 11:25 pm
tribak, ya quedó bien gracias a tu ayuda...solo tengo una duda :oops: .. por ejemplo al elegir un cuadro con el scroll..si lo quiero de 20.5 x 10...al soltar el mouse...el valor en el texto dinamico se cambia a 20.6 x10 ...nunca se mantiene el valor que elijo cuando muevo el scroll, cambia unos decimales mas o menos...que estaré haciendo mal?

Por rocio8225

11 de clabLevel



 

msie
Citar            
MensajeEscrito el 27 May 2009 11:52 pm
ahi si no tengo idea :P

en mi ejemplo solo ponia valores enteros por lo que nunca lo probe D:!

dejame ver si puedo reproducir tu problema para ver alguna solucion

Por tribak

Claber

2448 de clabLevel

6 tutoriales

Genero:Masculino   Héroes

Fotógrafo o algo

firefox
Citar            
MensajeEscrito el 28 May 2009 12:30 am
Mira este es el codigo que me pasaste adaptando los valores que necesito, a la mejor asi te es mas facil encontrar mi error...

Código :

//valor de escala EJ... 1:2 
valor = 1; 

function escala (val) {  
   cuadro._width = int(val* limit.scroll._x); 
   cuadro._height = int(-val* limit.scroll._y); 
} 

  limit.scroll.onPress = function () {    
  limit.scroll.startDrag(this,40,0,320,-520);
  escala(valor); 
    } 
    limit.scroll.onRelease = function () {    
  limit.scroll.stopDrag(); 
  } 
  onMouseMove = function () {    
  if(limit.hitTest(_xmouse,_ymouse)){       
  limit.scroll.startDrag(this,40,0,320,-520);       
  escala(valor);    
  } 
onMouseMove = function () {
   escala(valor);       
   w.text = int(cuadro._width/40);       
   h.text = Number(cuadro._height/10); 
   };
   }

Por rocio8225

11 de clabLevel



 

msie
Citar            
MensajeEscrito el 28 May 2009 02:50 am
se que sonare torpe, pero me podrias explicar mejor que es lo que intentas hacer?

me revolvi viendo tu codigo y siento que hay cosas que no van, pero no se que es lo que quieres hacer
segun entiendo quieres escalar un rectangulo de 4x1

Por tribak

Claber

2448 de clabLevel

6 tutoriales

Genero:Masculino   Héroes

Fotógrafo o algo

firefox
Citar            
MensajeEscrito el 28 May 2009 02:58 pm
Hola tribak, el cuadro que tengo mide 520alto x 320base, y necesito que en los valores de X en el texto dinamico cuente de 1 a 8 ...por eso en el codigo de hasta abajo dividí los 320/40 y lo valores de Y cuenten de 1 a 52, y por eso la division de 520/10 (ahi le puse el number porq es donde necesito los decimales) ...

Lo que quiero es escalar un cuadro de 10alto x40base que seria mi unidad y con el scroll arrastrarlo...asi hasta llegar a los 520x320 que en los valores del texto dinamico seria 52x8... esto porque necesito tener una plana o cuadro que de alto simule centimetros y de ancho columnas...y que el usuario elija la medida del cuadro que desee x ejem...un cuadro de 21.7cm x 3 columnas... para despues multiplicarlos(esto todavia no lo hago)...

El problema que ahora tengo es que cuando voy arrastrando el scroll y en el texto dinamico va mostrando las medidas, quiero que se detenga en ese 21.7 x 3... y al mover el mouse fuera del scroll, me cambia el valor en el txt dinamico a 21.8 x3 ...a veces suma o resta un decimal...y no entiendo porque...la importancia de esto es que si el usuario elige una cantidad precisa....nunca pueda multiplicarlos porq le va a cambiar los valores que elija...y no es lo mismo multiplicar 21.7x3 que 21.8x3


Tribak..no se si te confundí, o si aclare tu duda y asi puedas ver que toy haciendo mal, Del codigo, la verdad como no entiendo mucho del AS, lo adapte segun iba comprendiendo lo qu e me dijiste y hasta que obtuve lo que necesitaba...

ojala puedas ayudarme :oops:

Por rocio8225

11 de clabLevel



 

msie
Citar            
MensajeEscrito el 28 May 2009 07:40 pm
Segun comprendi, esto es lo que necesitas
cuando se movia un poquito, era por el onMouseMove... error mio

Código ActionScript :

function escala(valx, valy) {
   cuadro._width = int(valx*limit.scroll._x);
   cuadro._height = Number(-valy*limit.scroll._y);
}

onEnterFrame = function () {
   escala(8,52);
   w.text = int(cuadro._width/40);
   h.text = Number(cuadro._height/10);
};
limit.scroll.onPress = function() {
   limit.scroll.startDrag(this,false,0,40,-10,0);
};
limit.scroll.onRelease = function() {
   limit.scroll.stopDrag();
};


aqui tienes un ejemplo de como queda
[flash width=320 height=520]http://files.tribak.org/escalador2.swf[/flash]

Por tribak

Claber

2448 de clabLevel

6 tutoriales

Genero:Masculino   Héroes

Fotógrafo o algo

firefox
Citar            
MensajeEscrito el 29 May 2009 02:33 pm
ya quedó bien¡¡ :D :D
Oye TRibak muchas graciass me ayudaste muchisimo....

Por rocio8225

11 de clabLevel



 

msie
Citar            
MensajeEscrito el 03 Jun 2009 12:10 am
hola tribak :oops: tengo muchas dudas, necesito que al mover el scroll , cuando se elijan los valores que equivalen a la mitad y 1/4 o todo el cuadro, aparezca, un texto dependiendo "media plana" "1/4 plana" "plana".

tengo este codigo pero no funciona, tambien ya lo intenté con hitTest, ya estuve buscando y lo unico que encontre es que cuando pase por las coordenadas que se le asignan ..con el "trace" salga una ventana que diga "1/4 de plana" pero creo que tampoco va por ahí porque quiero que se vea en pantalla, mira:

Código :

if(limit.scroll._x == 160){
msn_txt = "1/4 de plana"
} else {
msn_txt = ""
}
if(limit.scroll._y == -260){
msn_txt = "1/4 de plana"
} else {
msn_txt = ""
}


esa es una duda, tambien quiero hacer ahora lo contrario, es decir que el usuario designe los valores y el cuadro se escale a esa medida , ya cree dos campos de entrada de texto y los valide para que solo se puedan ingresar numeros y no letras y estos dos valores se multipliquen..pero eso de escalar no me sale :(

y la ultima duda... es posible hacer que en un campo de texto solo se puedan escribir los valores del 1 al 8? (por eso de las columnas) , pensaba hacerlo con un combobox..pero tampoco quiero complicarme tanto..

espero que puedas ayudarme, te lo agradecería mucho

saludos

Por rocio8225

11 de clabLevel



 

msie
Citar            
MensajeEscrito el 03 Jun 2009 04:20 am
donde esta el onEnterFrame

mete estas lineas de codigo

Código ActionScript :

if(w.text == 2 && h.text == 13){
   estado_txt.text = "1/4";
}
else {
   estado_txt.text = "";
}


necesitas el cuadro de texto dinamico estado_txt

Por tribak

Claber

2448 de clabLevel

6 tutoriales

Genero:Masculino   Héroes

Fotógrafo o algo

firefox
Citar            
MensajeEscrito el 03 Jun 2009 04:23 am
ahhh no lei completo el post

lo de el 1-8 se hace con restrict

algo asi

cuadro_txt.restrict = "1-8";

ahorita veo como hacer que escriba la cantidad y escale el cuadro...

Por tribak

Claber

2448 de clabLevel

6 tutoriales

Genero:Masculino   Héroes

Fotógrafo o algo

firefox
Citar            
MensajeEscrito el 05 Jun 2009 03:40 pm
gracias de nuevo por tu ayuda Tribak¡

Por rocio8225

11 de clabLevel



 

msie

 

Cristalab BabyBlue v4 + V4 © 2011 Cristalab
Powered by ClabEngines v4, HTML5, love and ponies.