moti: Some bug reports
I tried to create a snack but It gave errors about reanimated 2 when I added moti.
import {AnimatePresence} from "moti";
import React, {useState} from "react";
import {Button, Text, TouchableOpacity} from "react-native";
const test = () => {
const [presence, toggle] = React.useReducer((s) => !s, true)
return (
<>
<AnimatePresence>
{presence && (
<MotiView
from={{
translateY: -50,
rotateX: "-90deg",
}}
animate={{
translateY: 0,
rotateX: "0deg",
}}
exit={{
rotateX: "90deg",
translateY: -50,
}}
transition={{
type: "timing",
duration: 2000,
}}
>
<Text style={{fontSize: 50, color: "red"}}>213</Text>
</MotiView>
)}
</AnimatePresence>
<Button title="press-me" onPress={toggle} />
</>
)
}
export default test;
using these :
"moti": "^0.10.1-alpha.1",
"react-native-reanimated": "~2.1.0",
...
expo sdk 41
If I remove translate here the rotate works and if I remove rotate the translate works, but they don’t both work at the same time and I get a glitch effect instead.
About this issue
- Original URL
- State: closed
- Created 3 years ago
- Reactions: 1
- Comments: 15 (7 by maintainers)
Commits related to this issue
- fix: transform errors from #85, #83, #76, #65 — committed to nandorojo/moti by nandorojo 3 years ago
Fixed in
0.12.0
Closing for #76
I’ll track this at #76, thanks for letting me know