React Native: анимация сложенных представлений по отдельности (имитация смахивания по Tinder)Javascript

Форум по Javascript
Ответить
Anonymous
 React Native: анимация сложенных представлений по отдельности (имитация смахивания по Tinder)

Сообщение Anonymous »

В настоящее время у меня есть цикл, который генерирует несколько Animated.View друг над другом (как в ZStack). В моем коде все представления перемещаются вместе при одном пролистывании, а не одно за другим при отдельных пролистываниях. Я чувствую, что это связано с самим циклом, но я не совсем уверен, что это за решение.
Есть мысли?
{...} from '../../components/ui-components';
import { Swipe } from './swipe';

const SwipeMainPage = () => {
const dummyData = [
[…],
[…],
[…],
];

return (
const { onTouchStart, onTouchEnd, onTouchMove } = Swipe(
onSwipeLeft,
onSwipeRight,
onSwipeUp
);


{dummyData.map((data, index) => (



))}


);
};

export default SwipeMainPage;

import { windowHeight, windowWidth } from '../../components/ui-components';

//reference: https://stackoverflow.com/questions/458 ... act-native
export function Swipe(
swipeLeft?: any,
swipeRight?: any,
swipeUp?: any,
rangeOffset = 10
) {
let firstTouch = 0;

function onTouchStart(e: any) {
firstTouch = e.nativeEvent.pageX;
}

function onTouchEnd(e: any) {
const positionX = e.nativeEvent.pageX;
const range = windowWidth / rangeOffset;
if (positionX - firstTouch > range) {
swipeRight && swipeRight();
} else if (firstTouch - positionX > range) {
swipeLeft && swipeLeft();
}
}
function onTouchMove(e: any) {
const positionY = e.nativeEvent.pageY;
const range = windowHeight / 2;
if (positionY - firstTouch < range) {
swipeUp && swipeUp();
}
}
return { onTouchStart, onTouchEnd, onTouchMove };
}


Подробнее здесь: https://stackoverflow.com/questions/798 ... wipe-mimic
Ответить

Быстрый ответ

Изменение регистра текста: 
Смайлики
:) :( :oops: :roll: :wink: :muza: :clever: :sorry: :angel: :read: *x)
Ещё смайлики…
   
К этому ответу прикреплено по крайней мере одно вложение.

Если вы не хотите добавлять вложения, оставьте поля пустыми.

Максимально разрешённый размер вложения: 15 МБ.

Вернуться в «Javascript»