diff --git a/apps/common-app/src/examples/DynamicStylesExample.tsx b/apps/common-app/src/examples/DynamicStylesExample.tsx deleted file mode 100644 index fa538f49c19..00000000000 --- a/apps/common-app/src/examples/DynamicStylesExample.tsx +++ /dev/null @@ -1,216 +0,0 @@ -import { Text, StyleSheet, View, Button } from 'react-native'; - -import React from 'react'; - -import Animated, { - useAnimatedStyle, - useSharedValue, - withTiming, -} from 'react-native-reanimated'; - -export default function DynamicStylesExample() { - const [extraStyle, setExtraStyle] = React.useState(false); - const [rerender, setRerender] = React.useState(false); - - const widthShared = useSharedValue(80); - const backgroundColorShared = useSharedValue('rgb(255,127,63)'); - - const animatedWidthStyle = useAnimatedStyle(() => ({ - width: widthShared.value, - })); - const animatedBackgroundColorStyle = useAnimatedStyle(() => { - return { - backgroundColor: backgroundColorShared.value, - }; - }); - - function handleChangeProps() { - setExtraStyle((extraStyle) => !extraStyle); - } - - function handleAnimate() { - widthShared.value = withTiming((Math.random() * 160) / 2 + 40, { - duration: 1000, - }); - - const r = Math.random() * 256; - const g = Math.random() * 256; - const b = Math.random() * 256; - - backgroundColorShared.value = withTiming(`rgb(${r},${g},${b})`, { - duration: 1500, - }); - } - - function handleForceRerender() { - setRerender(!rerender); - } - - return ( - - State: {String(rerender)} - - - InlineStyles - - Same length array - - - Different length array - - Same length extra plain style array - - - Different length extra plain style array - - - - Two animated styles independent of state - - - - - useAnimatedStyle - - Same length array - - Different length array - - Same length extra plain style array - - - Different length extra plain style array - - - - Two animated styles independent of state - - - - - - - {extraStyle ? '' : 'no '}extra animated style - -