New at https://t.co/FDcspSQshY 🚀
Finally, new drop. Spent some time matching a telegram pull I do every time I open settings.
📱 Telegram App
🎬 Profile Header Animation
⚛️ React Native + Expo
New skill: /animate-expo
All the animation knowledge, but for your native apps.
React Native and Expo: gestures, sheets, haptics, screen transitions, and more.
Made in collaboration with the @expo team.
https://t.co/zEnLEjkvIp
Upgraded my React Native animations project to the latest v0.86.2.
Repo 👉 https://t.co/4K9xWkBvxX
Also upgraded the dependencies to their latest versions and updated the implementations to use the latest APIs.
Here are some of the changes:
- gesture-handler v3: Migrated from deprecated builder-based methods to hook-based APIs.
- reanimated v4:
i. Replaced runOnJS with the corresponding API from the helper react-native-worklets package
ii. Improved implementations to fix reanimated's sharedValue.value usage while component is rendering warnings.
- Updated SafeAreaView imports to use react-native-safe-area-context.
- Replaced the removed StyleSheet.absoluteFillObject usage with StyleSheet.absoluteFill.
- Grid Magnification: Updated withSpring animation options based on the changes in Reanimated v4's spring behavior.
- Rope Physics: updated the rope path implementation to use Skia's new Path APIs
- Custom Caret: Fixed hidden TextInput behavior on iOS that was causing incorrect cursor positioning. Also added an alternative approach based on the Text component.
- Updated types, including supporting the new Strict TypeScript APIs for react-native.
- Removed some redundant styles and other code refactors
- Updated CI/CD workflows to use the latest action versions and approaches.
The so called big boys in 9ja tech are the ones employed in banks serving us delayed transactions
A green app came from outside the continent with their own engineers and showed us how it’s really done, that transactions do not have to take 5 hours
Yet these same people would be here on twitter talking down on upcoming devs
🆕 React Native Micro Skill release🚨: @expo Router App Store Card Transition.
Get the skill in link below 👇
This is combo of Expo Router Zoom transitions combined with the right card format plus a landing native screen that matches the effect. Also cards bg text matches image with blur-hash. (Text color switch depending on that color too). Thats it.
I call these "micro skills" and that's the point. This small skill artifacts is very simple in sight but still deep in its own way. It is thinking about how to make the effect powerful. What are the other elements to combine to make a a great UX show into existence.
Again micro skills are so powerful when they compound and are what will push you into creating amazing native feel experiences. Are you creating micro skills too? LMK in the comments below.
Introducing react native canvas kit, a batteries-included canvas library.
🔴 Shapes: Circles, Rectangles etc.
🫵Interactivity: event bubbling handled.
🤏Multi-touch gestures: pinch-to-scale etc.
💠Transformers.
🖌️Brushes: pen, pencil, marker etc.
⚡️Worklet driven.
Built on top of the amazing work of:
@wcandillon@expo@swmansion@lavrton 🫶
Check it out: https://t.co/DH2a7AjldI
Shared element transitions confuse a lot of devs so I rebuilt the App Store card expand as one single element you can read: tap to expand, drag down to send it back.
expo + reanimated + gesture handled
fully open source : https://t.co/akOmtdiODK