2016-12-19 1 views
1

Im Moment habe ich eine Animation, die einen Offset aktualisiert und am Ende abflacht, um für die nächste Animation zurückzusetzen. Ich höre nach Updates für diese Animation, um sie mit einer anderen zu koordinieren, aber sie wird nicht ausgelöst, wenn der Offset aktualisiert wird.Reactive Native Animated Listener wird nicht ausgelöst, wenn der Offset aktualisiert wird

imagePosition.addListener(this._animateOther) 

Ich würde erwarten _animateOther ausgelöst werden, wie mein Objekt bewegt.

Dies löst jedoch _animateOther nicht aus.

Nur wenn der Offset in den Wert zusammengeführt wird, löst er _animateOther aus.

this.state.imagePosition.flattenOffset() 

Ist das ein Fehler und gibt es eine Möglichkeit, Offset-Updates zu hören?

Antwort

0

Ihre _animateOther kann nur ausgelöst werden, wenn der Wert aktualisiert wird, nicht versetzt. Sie sollten versuchen setValue anstelle von SetOffset.

flattenOffset führt den Offsetwert in den Basiswert ein und setzt den Offset auf Null zurück. Der interne Code sieht wie folgt aus:

flattenOffset() { 
    this._value += this._offset; 
    this._offset = 0; 
} 

Es Animation Wert aktualisiert, dass, warum Ihr _animateOther ausgelöst wird.

+0

Aber der ganze Zweck von Offset ist, damit ich fortgesetzte Animationen machen kann. dh Benutzer zieht Quadrat von (0,0) bis (20, 5), hebt Finger, dann zieht Quadrat von (20, 5) -> (30,10) Wenn ich den Wert jedes Mal aktualisieren, wenn sie schwenken Das Quadrat endet bei (10,5), wenn es auf die nächste Pfanne zurückgesetzt wird. Wenn ich den Offset nur aktualisiere und am Ende abflache, lande ich bei der richtigen (30,10) Koordinate. –

+1

Der Trick ist, wenn Sie beginnen, Ihr Quadrat zu bewegen (onResponderGrant in View oder onPanResponderGrant in PanResponder), 'SetOffset' auf animierten Wert und' setValue' auf 0, den Wert jedes Mal aktualisieren, wenn Sie Ihren Finger bewegen (onResponderMove) und flattenOffset wenn Sie Finger heben (onResponderRelease). PanResponder verwenden? [Hier ein Beispiel] (https://gist.github.com/octopitus/edcf671ddea4f60b3794099bec304748) – Octopitus

Verwandte Themen