SharedTransitionTag 不起作用 - React Native、Reanimated 3、Expo 51

Question

当尝试在 Reanimated 3 中使用 React Native SharedTransitionTag 对屏幕之间的共享元素转换进行动画处理时，我得到了非常奇怪的行为，而不是预期的动画。对我来说，没有动画，当我返回时，图像消失在顶部。

我正在我的 iPhone 上的 Expo Go 上进行测试。我尝试过 Expo Router 和 React-Navigation NativeStack 并得到相同的结果。我还下载了某人的课程材料的源代码，它可以工作，但是当我自己运行它时，它不起作用。我唯一改变的就是将他的 Expo Go 版本从 49 提高到 51。

有人遇到过类似问题或对如何解决此问题有任何建议吗？我怀疑问题出在某些依赖项上。

这是我的代码： 屏幕1

import Animated from "react-native-reanimated";

export default function Test() {
    const router = useRouter();
    return (
        <View>
            <Text>Test</Text>
            <Animated.Image
                source={require('./../../assets/ovelser/1-deadlift.png')}
                style={{height: 200, width: 200}}
                sharedTransitionTag="plis"
                />
            <Pressable
                onPress={() => router.push("/testend/1")}
                style={{backgroundColor: 'red', padding: 10, borderRadius: 5, marginTop: 10}}
                >
                <Text>Test</Text>
            </Pressable>
        </View>
    );
}

屏幕2

export default function Testend() {
    return (
        <View>
            <Text>Test</Text>
            <Animated.Image
                source={require('./../../assets/ovelser/1-deadlift.png')}
                style={{height: 400, width: 400, top: 500}}
                sharedTransitionTag="plis"
                />
        </View>
    );
}

依赖关系：

"dependencies": {
    "expo": "~51.0.20",
    "expo-constants": "~16.0.2",
    "expo-linking": "~6.3.1",
    "expo-router": "~3.5.18",
    "expo-status-bar": "~1.12.1",
    "frontend": "file:",
    "react": "18.2.0",
    "react-native": "^0.74.3",
    "react-native-countdown-circle-timer": "^3.2.1",
    "react-native-gesture-handler": "~2.16.1",
    "react-native-pager-view": "^6.3.0",
    "react-native-paper": "^5.12.3",
    "react-native-reanimated": "~3.10.1",
    "react-native-safe-area-context": "^4.10.1",
    "react-native-screens": "3.31.1",
    "react-native-shared-element": "^0.8.9"
  },

如果有人有其他可行的方法。我研究了“react-navigation-shared-element”，但也未能使其正常工作，该包在 2022 年被废弃，所以我认为是因为这个。

Answer 1

还有解决办法吗？我遇到了同样的问题，并且已经多次回到这个线程，现在希望其他人知道为什么会发生这种情况。