Draggare movieClip con pulsante

[scoppato]

Ciao a tutti.
Stò sbattendo da qualche giorno la testa, sun un problema classico.
Spesso le cose più semplici diventano complicate.
Mi spiego:

Sullo stage ho un pulsante draggabile solo orizzontalmente, il suo spostamento è limitato tra due coordinate X, quindi può muoversi orizzontalmente lungo una linea che ha una ben precisa lunghezza.
Il movimento di questo pulsante, quando viene draggato, deve far muovere una immagine (più lunga del percorso che percorre il pulsante) questa immagine viene mascherata. Quindi il principio è semplice: faccio muovere il mc che contiene l'img. utilizzando una maschera che mi fa vedere solo una parte dell'immagine.
La maschera ha delle dimensioni ben precise.
La mia difficoltà è relazionare il movimento del pulsante draggabile al movimento dell'immagine.
In pratica dovrei mettere in relazione lo spazio percorribile dal pulsante con la lunghezza dell'immagine.
Non riesco a trovare un algoritmo che faccia al caso mio. Ne ho trovati tanti su questo forum, ma non riesco ad applicarli.
Qualcuno ha una dritta o qualcosa su cui studiare, non pretendo la soluzione pronta... altrimenti c'è poco divertimento

[KillerWorm]

Ciao..

Si tratta di una semplice proporzione.

L1 sta ad L2 come X1 sta ad X2

...ovvero

L1/L2 = X1/X2

Supponendo che:

• L1 è il valore della corsa lungo la quale si muove il cursore
• L2 è la corsa che dovrà effettuare l'immagine durante il suo spostamento, cioè la differenza tra la lunghezza dell'immagine e la lunghezza della maschera
• X1 è la posizione del cursore rispetto alla sua corsa
• X2 sarà la posizione che assumerà l'immagine in funzione dello spostamento del cursore

Per calcolare X2 avremo quindi:

X2 = X1*L2/L1

Ovviamente, nel valore delle x, dovrai tenere in considerazione la posizione relativa che avrà il cursore rispetto all'inizio della sua corsa e quella che avrà l'immagine rispetto al limite iniziale della maschera.

Mettendo in pratica..

Crea i 4 elementi
- cursore
- guida del cursore
- clip immagine
- maschera

Tutti gli elementi dovranno avere il punto di registrazione rispetto al loro angolo superiore-sinistro, tranne il cursore che mettiamo lo abbia al centro.

Disponi gli elementi sullo stage della _root e nominali in questo modo:
- cursore
- guida
- immagine
- maschera

Ed infine inserisci questo script su un frame:

cursore.onPress = function() {
    with (_root.guida) {
        this.startDrag(false, _x, _y, _x+_width, _y);
    }
};
cursore.onRelease = cursore.onReleaseOutside=function () {
    stopDrag();
};
immagine.onMouseMove = function() {
    updateAfterEvent();
    with (_root) {
        var l1 = guida._width;
        var l2 = immagine._width-maschera._width;
        var x1 = cursore._x-guida._x;
        var x2 = maschera._x-(l2/l1*x1);
        immagine._x = x2;
    }
}; 

Spostando il cursore si sposterà anche l'immagine, nel senso opposto, per tutta l'area visibile della maschera

Se vuoi far muovere l'immagine nello stesso senso del cursore dovrai modificare il calcolo di x2 in questo modo:

var x2 = maschera._x-l2+(l2/l1*x1); 

Prova e fammi sapere se è quello che ti serve.

[scoppato]

Grazie KillerWorm!
Ho già provato a utilizzare la tua spiegazione e va benissimo.
Sei stato molto gentile nel fornirmi questa dettagliata spiegazione.
A buon rendere!!!!

[KillerWorm]

No problem