All bites
The whole library, newest first. Filter by what you are here for, or pick a topic if you already know.
8664 bites
Page 9
Building a custom native module
Write native classes in Kotlin/Java and Swift/Objective-C, expose methods via the module macros, register the module, and import via NativeModules with promises or events.
Managing camera lifecycle in Vision Camera
Bind the isActive prop to screen focus via useIsFocused and to app state, so the camera stops when blurred or backgrounded.
Background GPS tracking challenges and approaches
Request always-allow permission, declare background modes, use a native background task or geofencing API rather than JS timers, manage battery and OS throttling.
Push notification data flow with APNs and FCM
Device registers and gets a token, server sends to FCM, FCM routes to APNs for iOS and directly for Android, the OS delivers to the app.
Getting a one-time GPS location
Ensure permission, then call a getCurrentPosition wrapped in a promise (or Expo Location.getCurrentPositionAsync) with await inside try/catch, reading coords.latitude and longitude.
Requesting runtime permissions on iOS and Android
Declare permissions in Info.plist and AndroidManifest, then check status and request at runtime just before use, handling granted, denied, and blocked.
Persisting key-value preferences across launches
AsyncStorage for simple non-sensitive key-value, MMKV for speed, SecureStore or Keychain for secrets.
Shared element transitions with Reanimated
Wrap both views in Animated.View with the same sharedTransitionTag, use a native-stack navigator so Reanimated interpolates between source and target.
What is a worklet in Reanimated
A worklet is a JS function marked to run on the UI thread runtime with a captured snapshot of its scope, enabling synchronous per-frame work.
Animated.event for scroll-driven parallax
Animated.event maps an event path to an Animated.Value, wire it to onScroll with useNativeDriver, then interpolate the value for header transform.
Shared values and useAnimatedStyle in Reanimated
UseSharedValue holds a mutable .value readable on both threads, useAnimatedStyle derives styles as a worklet, mutate .value with withTiming or withSpring.
Animated API versus Reanimated architecture
Animated declares animations that the native driver runs, but logic and gestures cross the bridge; Reanimated runs worklets directly on the UI thread.
Animated.sequence versus Animated.parallel
Sequence runs animations one after another in order, parallel starts them at the same time.
Build a mount fade-in with Animated API
Create an Animated.Value(0) in a ref, drive it with Animated.timing inside useEffect, bind it to opacity on Animated.View.
useNativeDriver in the Animated API
Native driver runs animations on the UI thread so they stay smooth even if JS is busy, but only supports non-layout props like transform and opacity.
Responsive layout across form factors
Drive layout from dimensions and breakpoints via useWindowDimensions, react to orientation changes, avoid hardcoded OS checks.
Designing a native map UI component
Wrap each platform's native view, expose props mapped to native setters and events as bubbling callbacks, unify behind one JS API.
Conditional logic with Platform.Version
Platform.Version is a number on Android (API level) and a string on iOS; gate features by version to use new APIs only where supported.
Platform files versus Platform.OS checks
Use platform files for large divergence and platform-only deps, use Platform.OS for small inline tweaks.
Cross-platform shadow with Platform API
IOS uses shadowColor/Offset/Opacity/Radius, Android uses elevation; merge both via Platform.select inside a style.