Comunidad de diseño web y desarrollo en internet online

Cargar y colocar "parte" de imagen

Citar            
MensajeEscrito el 30 Nov 2009 05:44 pm
Saludos maestros del flash, de antemano quiero agradecerles por la ayuda brindada, el asunto es el siguiente.
Estoy haciendo un jueguito del 15, es una especie de rompecabeza donde se deslizan fichas tratando de ordenarlas, el juego en si ya lo he conseguido, de manera artesanal me imagino porque no domino mucho action script, pero aca es donde viene el problema, hasta ahora lo he hecho con numeros, pero quiero que sea una imagen la que aparesca en este puzzle, cosa bastante sencilla, el detalle es que quiero cargar la imagen externamente, para asi poder cambiarla facilmente cuando uno desee, debido a que son 15 clips de pelicula, en cada uno debere cargar solo parte de una imagen externa para luego colocarla en el lugar indicado, espero haberme explicado correctamente, muchisimas gracias nuevamente, espero que tengan un buen dia.
_saludos

Por ariesdaniel

7 de clabLevel



Genero:Masculino  

firefox
Citar            
MensajeEscrito el 30 Nov 2009 08:29 pm
Pues no es muy difícil, lo que buscas tendrías que hacer con un doble bucle for (Height x Width) y alli cargar la imagen 15 veces, enmascararla usando setMask y luego reposicionar el clip según la posición de la grilla.

Si quieres intenta armar el código y te vamos ayudando.

Saludos, Hernán . -

Por Hernán

BOFH

6148 de clabLevel

19 tutoriales
23 articulos

Genero:Masculino   REC Desarrollador de GAIA

Marketing & IT

firefox
Citar            
MensajeEscrito el 01 Dic 2009 04:21 pm
Muchas gracias hernan por tu respuesta, si pudieras dejarme un pequeño ejemplito del codigo te lo agradeceria enormemente, cosa que asi lo estudio, experimento y quiza lo resuelva, gracias nuevamente.
_saludos

Por ariesdaniel

7 de clabLevel



Genero:Masculino  

msie
Citar            
MensajeEscrito el 01 Dic 2009 05:29 pm
Te puedo dejar algunas pistas si quieres para que lo puedas resolver.

Primero, un bluce doble:

Código ActionScript :

for(var i=0;i<5;i++){
    for(var j=0;j<3;j++){
        trace(i*j);
    }
}


Como verás gracias al bucle podremos determinar la posición y además saltar el carro para una grilla de por ejemplo 5 x 3. Lo otro es más simple, puedes ir creando tus MC de Mascara y luego posicionar en el eje (0,0) la imagen y luego desplazar con un offset según la posición.

Fijate de avanzar algo por tu cuenta y lo vamos viendo ;)

Saludos, Hernán . -

Por Hernán

BOFH

6148 de clabLevel

19 tutoriales
23 articulos

Genero:Masculino   REC Desarrollador de GAIA

Marketing & IT

firefox
Citar            
MensajeEscrito el 02 Dic 2009 03:36 pm
Muy buena gracias, creo que ya lo tengo resuelto, lo unico que no entiendo es como funciona el famoso setMask, lo he toqueteado un poco, inluso he visto el help en ingles pero no descubro como hacerlo funcionar, sera lo ultimo que me falta, gracias por la ayuda.
_saludos

Por ariesdaniel

7 de clabLevel



Genero:Masculino  

msie
Citar            
MensajeEscrito el 02 Dic 2009 10:10 pm
Y en realidad el verdadero problema es con el que empeze, el juego en si ya lo termine, el problema aque tengo es crear el codigo para cargar una imagen externa y luego enmascarla para solo usar parte de ella.
Por lo que se para poder cargar una pelicula y luego posicionarla, se utiliza primero el createmovieclipempty y luego el loadmovie, despues para enmascararla se usa el setMask, usando antes el attachmovie, he probado de todo, por eso como ultimo recurso les pido un ejemplo del codigo.
Resumiendo solo necesito saber como cargar una imagen, posicionarla y luego enmascararla.
_saludos

Por ariesdaniel

7 de clabLevel



Genero:Masculino  

msie
Citar            
MensajeEscrito el 02 Dic 2009 11:06 pm
ariesdaniel, no uses loadMovie y attachMovie :S

Aquí te dejo un código practico para entender el uso de setMask:

Código ActionScript :

// Defino algunas variables simples 
var init_lvl:Number = 30; 
var init_position:Number = 100; 
var espacio_entre_mc:Number = 15; 
// Creo el movieClip que duplicaré y luego enmascararé (Para que sea más práctico creo el MC de 0, para que no tengan que andar creando nada, solo copiar y pegar el código AS para ver como funciona) 
this.createEmptyMovieClip("target_mc",10); 
target_mc.beginFill(0xFF0000); 
target_mc.lineTo(0,50); 
target_mc.lineTo(50,50); 
target_mc.lineTo(50,0); 
target_mc.lineTo(0,0); 
//Creo la mascara que usaré, irregular para que se vea mejor el efecto  
this.createEmptyMovieClip("target_mask",20); 
target_mask.beginFill(0x000); 
target_mask.lineStyle(1,0xFF0000); 
target_mask.lineTo(0,200); 
target_mask.lineTo(200,150); 
target_mask.lineTo(200,0); 
// Posiciono en el centro de mi escenario la mascara 
target_mask._x = Stage.width/2-target_mask._width/2; 
target_mask._y = Stage.height/2-target_mask._height/2; 
//Duplico en "diagonal" mis MovieClips 
for (var i = 0; i<15; i++) { 
   // Duplicados de los MC 
   mc = target_mc.duplicateMovieClip("mc_duplicated_"+i, init_lvl+(i), {_x:init_position+(i*espacio_entre_mc), _y:init_position+(i*espacio_entre_mc)}); 
   // Duplicados de las Mascaras 
   mask_mc = target_mask.duplicateMovieClip("mc_mask_duplicated_"+i, init_lvl*2+(i)); 
   // El SetMask en sí mismo 
   mc.setMask(mask_mc); 
} 
// Dejo la mascara en un alpha bajo para ver el area de delimitación 
target_mask._alpha = 10; 
// Remuevo mi MovieClip de referencia 
removeMovieClip(target_mc);


Saludos, Hernán . -

Por Hernán

BOFH

6148 de clabLevel

19 tutoriales
23 articulos

Genero:Masculino   REC Desarrollador de GAIA

Marketing & IT

firefox
Citar            
MensajeEscrito el 03 Dic 2009 05:09 pm
Muchas gracias Hernán, sino fuera por ti ya me estaria cortando las venas, :cry: en verdad muchas gracias, el código que dejaste se ve muy interesante, de hecho andare un tiempo investigandolo, :shock: pero sí debo usar "loadmovie", pues como habia dicho antes, "necesito cargar una imagen externa", ^^ la unica forma de ver solo parte de la imagen cargada es usando el setMask, me habian dicho que debia crear en la biblioteca la mascara y llamarla con attachmovie, que al parecer es el problema porque haga lo que haga no se llega a ver nada con dicho comando, :twisted: ahora algo interesante en tu codigo es que me parece puedes crear un rectangulo, :? es lo que voy a intentar ahora, de esa forma ya no tendria que usar el attachmovie, espero me resulte esta vez, si puedo seguir molestando y antes de eso vuelvo a agradecer el esfuerzo brindado al ayudarme, :cool: me serviria de mucho un ejemplo sencillo de como utilizar el loadmovie para cargar una imagen y como usar el setmask para ver solo parte de dicha imagen, Hernán mi correo y msn es [email protected] y mi fuerte va por la edicion de video y 3d, 3dmax, after effects, premiere, realflow, etc, si puedo ayudarte en algun momento en esos campos, sere feliz, :lol: muchisimas gracias por la atencion prestada.
_saludos

Por ariesdaniel

7 de clabLevel



Genero:Masculino  

msie
Citar            
MensajeEscrito el 03 Dic 2009 10:23 pm
Bueno aqui con la novedad de que no resulto y la verdad, no se porque, segun lo que he leido deberia funcionar, estoy a punto de perder las esperanzas, les dejo el codigo que he creado hasta el momento esperando puedan decirme en donde fallo.

Código :

clip_mc = this.createEmptyMovieClip("clip", 1);
clip_mc._x = 100;
clip_mc._y = 100;
clip_mc.loadMovie("image.jpg");
mascara_mc = this.createEmptyMovieClip("mascara", 2);
mascara_mc.beginFill(0xFF0000);
mascara_mc.moveTo(100, 100);
mascara_mc.lineTo(100, 200);
mascara_mc.lineTo(200, 200);
mascara_mc.lineTo(200, 100);
mascara_mc.lineTo(100, 100);
mascara_mc.endFill();
clip_mc.setMask(mascara_mc);


como veran creo 2 clip vacios, en el primero llamo a la imagen externa, cosa obligatoria en mi proyecto, en la segunda creo un rectangulo de color rojito y finalmente doy el famoso setMask, pero nada de nada, no funciona, heeeelp plz.
_saludos

Por ariesdaniel

7 de clabLevel



Genero:Masculino  

msie
Citar            
MensajeEscrito el 04 Dic 2009 01:48 am
Porque tienes que cargar primero la imagen (No te preocupes, a mi me tomo como 5 minutos hasta que me dí cuenta de esto jaja, antes estaba puteando al Flash de porque no jajaja).

Código ActionScript :

clip_mc = this.createEmptyMovieClip("clip", 1);
clip_mc._x = 100;
clip_mc._y = 100;
clip_mc.loadMovie("image.jpg");
mascara_mc = this.createEmptyMovieClip("mascara", 2);
mascara_mc.beginFill(0xFF0000);
mascara_mc.moveTo(100,100);
mascara_mc.lineTo(100,200);
mascara_mc.lineTo(200,200);
mascara_mc.lineTo(200,100);
mascara_mc.lineTo(100,100);
mascara_mc.endFill();

function checkPreload(MC:MovieClip, MASK:MovieClip):Void {
   if (MC.getBytesLoaded()/MC.getBytesTotal()) {
      clearInterval(id);
      MC.setMask(MASK);
   }
}

id = setInterval(checkPreload, 0, clip, mascara);


Saludos, Hernán . -

Por Hernán

BOFH

6148 de clabLevel

19 tutoriales
23 articulos

Genero:Masculino   REC Desarrollador de GAIA

Marketing & IT

firefox
Citar            
MensajeEscrito el 07 Dic 2009 03:48 pm
Pues funciono finalmente, muchisimas gracias, sobre todo a Hernán que sin su ayuda nunca hubiera podido solucionar este problema, gracias.
_saludos

Por ariesdaniel

7 de clabLevel



Genero:Masculino  

msie

 

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