Перейти к содержимому

Expo Live Activities Tutorial: Lock Screen + Dynamic Island in React Native (No Swift)

SeniorMobileDev

0:00 / 0:00

Expo Live Activities Tutorial: Lock Screen + Dynamic Island in React Native (No Swift)

390 просмотров · 3 нед. назад
SeniorMobileDev
89 подписчиков
390 просмотров · 3 нед. назад
#expo #reactnative #liveactivities #dynamicisland #iosdevelopment Build an iOS Live Activity in React Native with Expo — a voice-recorder timer on the Lock Screen and in the Dynamic Island, with Pause / Resume / Stop buttons. No Swift, no Xcode target: just TypeScript with the new expo-widgets library (alpha). Source code: https://github.com/seniormobiledev/ex... In this video: • What a Live Activity is, and the 4 places it shows up (banner, compact, minimal, expanded) • How expo-widgets works: the 'widget' directive + a separate JS runtime that renders SwiftUI • Install + app.json config (and the bundleIdentifier you must not forget) • Design decision: let iOS count the timer with timerInterval + pauseTime instead of updating every second • Code walkthrough: props, layout slots, buttons, start / update / end • ⚠️ Trap I found while testing: for a Live Activity, event.source is the activity ID — not its name • Real demo on the iOS Simulator ⏱️ Chapters 0:00 Live Activity demo 0:15 Intro: expo-widgets 0:29 What is a Live Activity? 1:00 How expo-widgets works 1:36 Installation & app.json 2:09 Design decision: who counts the timer? 2:40 Code: props (why numbers, not Dates) 3:00 Code: the 'widget' directive 3:27 Code: layout slots 3:54 Code: how buttons work 4:13 App side: start, update, end + the source-ID trap 4:58 Result on the iOS Simulator 5:17 Recap & gotchas 🧰 Commands npx expo install expo-widgets @expo/ui npx expo install expo-audio -- --legacy-peer-deps npx expo run:ios 📚 Links Expo blog: https://expo.dev/blog/home-screen-wid... expo-widgets docs: https://docs.expo.dev/versions/latest... Expo UI Text (timerInterval): https://docs.expo.dev/versions/latest... Tested with Expo SDK 57, expo-widgets 57.0.x, Xcode 26.5, iOS 26.5 Simulator.