Ciao, vorrei realizzare una galleria a scorrimento automatico in base allo spostamento del mouse, tipo questa (solo come effetto) ESEMPIO, le foto da caricare vorrei prenderle da un file xml e dallo stesso, anche il link di destinazione al click della foto..
come poter fare?
Incredibile, quanto a volte ci si impegola in qualcosa che sembra impossibile..
e poi si scopre che quel che si dava per scontato, perchè banale, ne fosse la soluzione..
Io mi muoverei per "scaglioni" e intanto deciderei se realizzare il tutto con approccio OOP o scrivendo tutto sulla timeline e disegnandomi gli elementi nell'IDE per poi duplicarli da libreria ecc...
Comunque il primo passo per la creazione della galleria xml è appunto creare una struttura xml in grado di "soddisfare" le esigenze della galleria, quindi un link all'immagine, un titolo e una descrizione.
A questo punto avremo le basi per effettuare il parsing su flash, utilizzando la classe XML come vettore per creare un array di oggetti che contengano i nostri dati.
L'ultima cosa da fare è quella di gestire il movimento, nel caso indicato pare che venga utilizzata una tween solo quando viene mosso il mouse (MouseEvent.MOUSE_MOVE) e non dovrebbe essere troppo complicata da fare, ma è l'ultima cosa da considerare, prima tutto il resto.
Un piccolo esempio solo per il movimento:
Provalo in un file vuoto e vedrai che il movimento ottenuto è esattamente quello che cerchi.Codice PHP:function drawShape (w:Number=0.0, h:Number=0.0):Sprite {
var s:Sprite = new Sprite();
s.graphics.beginFill(Math.random()*0xFFFFFF);
s.graphics.drawRect(0, 0, w, h);
s.graphics.endFill();
return s;
}
stage.align = "TL";
stage.frameRate = 30;
stage.quality = "BEST";
stage.scaleMode = "noScale";
stage.showDefaultContextMenu = false;
var a:Array = [];
var b:Sprite = addChild(new Sprite()) as Sprite;
b.y = 100;
for (var i:uint=0; i<10; i++) {
a.push(b.addChild(drawShape(250, 250)));
a[i].x = i*260;
}
stage.addEventListener(MouseEvent.MOUSE_MOVE, mouseMove);
function mouseMove (evt:MouseEvent=null):void {
b.x = ((mouseX * (b.width-stage.stageWidth)) / stage.stageWidth) * -1;
evt.updateAfterEvent();
}
Ciao, grazie per lo spunto, ora ho un dubbio.. ho trovato uno script che mi genera una base (da personalizzare) di galleria come serve a me, quindi che mi carica delle foto tramite xml e me le mette una in fianco all'altra.
Problema: nel file di esempio che ho trovato, il codice per la galleria risiede nella DocumentClass e sullo stage non c'è nulla mentre a me serve che la galleria risieda in un MC già sullo stage in quanto il sito è già composto da altri oggetti sullo stage..
Questo il codice caricato dalla DocumentClass, come convertirlo in codice sulla timeline del mc che voglio??
Codice PHP:package classes {
import flash.display.MovieClip;
import flash.display.Sprite;
import flash.display.DisplayObject;
import flash.display.Loader;
import flash.net.URLLoader;
import flash.net.URLRequest;
import flash.events.Event;
import flash.events.MouseEvent;
import fl.motion.easing.Exponential;
import fl.motion.easing.Back;
import gs.TweenMax;
public class Main extends MovieClip {
private var __images:XML;
private var __cont:uint;
private var __y:uint;
private var __x:uint;
public function Main () {
this.x = this.y = 20;
initStage();
loadXML();
initFooter();
}
private function initStage() {
stage.scaleMode = "noScale";
stage.align = "TOP_LEFT";
}
public function loadXML() {
var loader:URLLoader = new URLLoader();
loader.addEventListener(Event.COMPLETE, function(event:Event){
__images = new XML(event.target.data);
showImagen();
});
loader.load(new URLRequest("images.xml"));
}
private function showImagen () {
if (__cont < __images.image.length()) {
var loader:Loader = new Loader();
var request:URLRequest = new URLRequest(__images.@tnPath+__images.image[__cont].@source);
loader.load(request);
loader.contentLoaderInfo.addEventListener(Event.INIT, loaderHandler);
__cont++;
}
}
private function loaderHandler(event:Event) {
var holder:Sprite = new Sprite;
holder.addChild(event.currentTarget.content);
if (__cont > 1) {
holder.x = this.width + 0;
}
addChild(holder);
//TWEEN MAX
holder.alpha = .5;
TweenMax.to(holder, 1, {colorMatrixFilter:{saturation:0}});
TweenMax.from(holder, 1, {alpha:0, y:"300", ease:Back.easeOut, overwrite:false, onComplete:function () {
var mouseTween:TweenMax;
holder.addEventListener(MouseEvent.MOUSE_OVER, function (event:MouseEvent) {
TweenMax.removeTween(mouseTween);
mouseTween = TweenMax.to(event.currentTarget, .5, {alpha:1, y:20, colorMatrixFilter:{saturation:1}, ease:Exponential.easeOut, overwrite:false});
});
holder.addEventListener(MouseEvent.MOUSE_OUT, function (event:MouseEvent) {
TweenMax.removeTween(mouseTween);
mouseTween = TweenMax.to(event.currentTarget, .5, {alpha:.5, y:0, colorMatrixFilter:{saturation:0}, ease:Exponential.easeOut, overwrite:false});
});
}});
showImagen();
}
private function initFooter () {
var footer:Footer = new Footer();
footer.y = 200;
TweenMax.from(footer, .5, {y:"300", alpha:0, delay:2, ease:Exponential.easeOut});
addChild(footer);
}
}
}
Incredibile, quanto a volte ci si impegola in qualcosa che sembra impossibile..
e poi si scopre che quel che si dava per scontato, perchè banale, ne fosse la soluzione..
..dunque sono arrivato ad un punto dove non riesco più ad andare avanti.
Ho preso la classe qui sotto e la ho associata ad un mc nella libreria, così ora funziona dentro al movieclip, come volevo, come associare però ora l'effetto movimento?
Questo mc sarà mascherato da un mc di dimensione L800 x A100 e vorrei che l'effetto movimento fosse delimitato solo a quel mc e non allo stage..Codice PHP:package classes{
import flash.display.MovieClip;
import flash.display.Sprite;
import flash.display.DisplayObject;
import flash.display.Loader;
import flash.net.URLLoader;
import flash.net.URLRequest;
import flash.events.Event;
import flash.events.MouseEvent;
import fl.motion.easing.Exponential;
import fl.motion.easing.Back;
import gs.TweenMax;
public class Main extends MovieClip {
private var __images:XML;
private var __cont:uint;
private var __y:uint;
private var __x:uint;
public function Main() {
loadXML();
}
public function loadXML() {
var loader:URLLoader = new URLLoader();
loader.addEventListener(Event.COMPLETE, function(event:Event){;
__images = new XML(event.target.data);
showImagen();
});
loader.load(new URLRequest("images.xml"));
}
private function showImagen() {
if (__cont<__images.image.length()) {
var loader:Loader = new Loader();
var request:URLRequest=new URLRequest(__images.@tnPath+__images.image[__cont].@source);
loader.load(request);
loader.contentLoaderInfo.addEventListener(Event.INIT, loaderHandler);
__cont++;
}
}
private function loaderHandler(event:Event) {
var holder:Sprite=new Sprite ;
holder.addChild(event.currentTarget.content);
holder.alpha=0;
TweenMax.to(holder, 1 ,{alpha:0.5});
if (__cont>1) {
holder.x=this.width+10;
}
addChild(holder);
//TWEEN MAX
var mouseTween:TweenMax;
holder.buttonMode=true;
holder.addEventListener(MouseEvent.MOUSE_UP, function (event:MouseEvent){;
//ExternalInterface.call(evt.target.holder);
trace(holder.name);
});
holder.addEventListener(MouseEvent.MOUSE_OVER, function (event:MouseEvent) {;
TweenMax.removeTween(mouseTween);
mouseTween = TweenMax.to(event.currentTarget, .5, {alpha:1, ease:Exponential.easeOut, overwrite:false});
});
holder.addEventListener(MouseEvent.MOUSE_OUT, function (event:MouseEvent) {;
TweenMax.removeTween(mouseTween);
mouseTween = TweenMax.to(event.currentTarget, .5, {alpha:0.5, ease:Exponential.easeOut, overwrite:false});
});
showImagen();
}
}
}
tra l'altro il movimento dovrebbe essere dinamico, in base alla quantità di foto caricate quindi della dimensione finale del mc da spostare..
Come fare?
Incredibile, quanto a volte ci si impegola in qualcosa che sembra impossibile..
e poi si scopre che quel che si dava per scontato, perchè banale, ne fosse la soluzione..
Aspetta, fai un passo indietro e consideriamo la document class iniziale. La document class non è altro che una classe che estende Sprite o MovieClip e di conseguenza si tratta di un elemento che può essere aggiunto con "addChild" ad un qualsiasi movieclip sullo stage, quindi mettendo che tu abbia sullo stage un clip dedicato che si chiama "galleria", nel codice dello stage dovrai solo aggiungere quando serve: galleria.addChild(new Main())
Ciao, ora è più chiaro, quindi ciò che metto nella DocumentClass posso richiamarlo quando voglio, pensavo si eseguisse solo in automatico... però ho una serie di dubbi..
1) mettiamo che un filmato ha una document class, che mi fa il preload, come posso fare e fargli fare altre cose sempre dalla document class?
2)se il filmato loading ha una document class, posso caricare al suo interno un filmato con un'altra document class associata?
3)se uso la document class, lo stage deve essere per forza vuoto? non posso creare delle animazioni o che altro, già presenti sullo stage?
4)ora che in teoria (dopo le risposte a quanto sopra) avrò capito meglio la documentclass, come poter associare il movimento al codice sopra postato?
Buona giornata.
Incredibile, quanto a volte ci si impegola in qualcosa che sembra impossibile..
e poi si scopre che quel che si dava per scontato, perchè banale, ne fosse la soluzione..
1) Basta che gliele scrivi nella document class, dove e quando vuoi che accadano
2) Certo che sì, ogni filmato può contenere la sua document class personale, una volta compilato non potrà esserci interferenza se le cose si tengono separate
3) Non dev'essere vuoto, puoi disegnarci quello che vuoi e puoi anche scrivere del codice se non ricordo male, senza problemi
4) cos'è il movimento? quello che ti ho scritto sopra?
Ciao, si esatto il movimento che mi avevi scritto sopra...
nel tuo codice vengono generati n box e da li presa la larghezza del mc, ed il movimento (slide) fa riferimento a tutto lo stage.
Io vorrei far si che il movimento, sia eseguito solo se passo sul mc che mi contiene la galleria, il quale sarà mascherato.
Quello che non riesco a fare, è associare il movimento al codice che ho postato per caricare le immagini da xml...
Incredibile, quanto a volte ci si impegola in qualcosa che sembra impossibile..
e poi si scopre che quel che si dava per scontato, perchè banale, ne fosse la soluzione..
E' più complicato, specie perchè il fatto di generare una maschera in cui verificare il movimento del mouse sulla galleria, preclude la possibilità di gestire le azioni su ogni singolo clip.
Poi bisognerebbe vederlo su quel codice e ci vuole un po' per leggerlo e comprenderne la dinamica.
Permessi di invio
Rispondi quotando