💫 Update: Ex - AnimatableCustomFilterViewTest01Screen

dominicstop · Dec 30, 2024 · f029762 · f029762
1 parent 9f08828
commit f029762
Showing 1 changed file with 16 additions and 1 deletion.
diff --git a/example/src/examples/AnimatableCustomFilterViewTest01Screen.tsx b/example/src/examples/AnimatableCustomFilterViewTest01Screen.tsx
@@ -2,6 +2,7 @@ import * as React from 'react';
 import { StyleSheet, View, Animated, Easing, Dimensions } from 'react-native';
 
 import { AnimatableCustomFilterView, IdentityBackgroundFilterConfigListPreset, IdentityForegroundFilterConfigListPreset, type LayerFilterConfig } from 'react-native-ios-visual-effect-view';
+import { CounterDisplay } from '../components/CounterDisplay';
 const WINDOW_SIZE = Dimensions.get('window');
 
 // 1 = black, 0 = transparent
@@ -97,7 +98,16 @@ export function AnimatableCustomFilterViewTest01Screen() {
             }
           ]
         }}
-      />
+        animationConfig={{
+          mode: 'presetCurve',
+          duration: 1,
+          curve: 'linear',
+        }}
+      >
+        <View style={styles.effectContent}>
+          <CounterDisplay/>
+        </View>
+      </AnimatableCustomFilterView>
     </View>
   );
 }
@@ -119,4 +129,9 @@ const styles = StyleSheet.create({
     left: 0,
     right: 0,
   },
+  effectContent: {
+    flex: 1,
+    alignItems: 'center',
+    justifyContent: 'center',
+  },
 });