Animated.ValueXY
Ta strona została przetłumaczona przez PageTurner AI (beta). Nie jest oficjalnie zatwierdzona przez projekt. Znalazłeś błąd? Zgłoś problem →
Wartość 2D do sterowania animacjami dwuwymiarowymi, takimi jak gesty przesuwania. Interfejs API niemal identyczny jak standardowego Animated.Value, ale z multipleksowaniem. Pod spodem zawiera dwie standardowe wartości Animated.Value.
Przykład
Dokumentacja
Metody
setValue()
setValue(value: {x: number; y: number});
Bezpośrednio ustawia wartość. Zatrzymuje to wszystkie aktualnie działające animacje tej wartości i aktualizuje wszystkie powiązane właściwości.
Parametry:
| Name | Type | Required | Description |
|---|---|---|---|
| value | {x: number; y: number} | Yes | Value |
setOffset()
setOffset(offset: {x: number; y: number});
Ustawia przesunięcie nakładane na bieżącą wartość - niezależnie od tego, czy została ustawiona przez setValue, animację czy Animated.event. Przydatne do kompensowania elementów takich jak punkt początkowy gestu przesunięcia.
Parametry:
| Name | Type | Required | Description |
|---|---|---|---|
| offset | {x: number; y: number} | Yes | Offset value |
flattenOffset()
flattenOffset();
Scala wartość przesunięcia z wartością bazową i resetuje przesunięcie do zera. Ostateczna wartość wyjściowa pozostaje bez zmian.
extractOffset()
extractOffset();
Ustawia wartość przesunięcia na wartość bazową i resetuje wartość bazową do zera. Ostateczna wartość wyjściowa pozostaje bez zmian.
addListener()
addListener(callback: (value: {x: number; y: number}) => void);
Dodaje asynchronicznego słuchacza (listener) do wartości, umożliwiając obserwowanie aktualizacji z animacji. Jest to przydatne, ponieważ nie ma możliwości synchronicznego odczytu wartości, która może być sterowana natywnie.
Zwraca ciąg znaków służący jako identyfikator słuchacza.
Parametry:
| Name | Type | Required | Description |
|---|---|---|---|
| callback | function | Yes | The callback function which will receive an object with a value key set to the new value. |
removeListener()
removeListener(id: string);
Wyrejestrowuje słuchacza. Parametr id musi odpowiadać identyfikatorowi zwróconemu wcześniej przez addListener().
Parametry:
| Name | Type | Required | Description |
|---|---|---|---|
| id | string | Yes | Id for the listener being removed. |
removeAllListeners()
removeAllListeners();
Usuwa wszystkich zarejestrowanych słuchaczy.
stopAnimation()
stopAnimation(callback?: (value: {x: number; y: number}) => void);
Zatrzymuje wszystkie działające animacje lub śledzenie. callback jest wywoływany z końcową wartością po zatrzymaniu animacji, co jest przydatne do aktualizacji stanu zgodnie z pozycją animacji w układzie.
Parametry:
| Name | Type | Required | Description |
|---|---|---|---|
| callback | function | No | A function that will receive the final value. |
resetAnimation()
resetAnimation(callback?: (value: {x: number; y: number}) => void);
Zatrzymuje wszystkie animacje i resetuje wartość do stanu początkowego.
Parametry:
| Name | Type | Required | Description |
|---|---|---|---|
| callback | function | No | A function that will receive the original value. |
getLayout()
getLayout(): {left: Animated.Value, top: Animated.Value};
Konwertuje {x, y} na {left, top} do użycia w stylach, np.
style={this.state.anim.getLayout()}
getTranslateTransform()
getTranslateTransform(): [
{translateX: Animated.Value},
{translateY: Animated.Value},
];
Konwertuje {x, y} na gotową transformację przesunięcia, np.
style={{
transform: this.state.anim.getTranslateTransform()
}}