Expo Docs MCP Server

--- title: LivePhoto description: A library that allows displaying Live Photos on iOS. sourceCodeUrl: https://github.com/expo/expo/tree/sdk-53/packages/expo-live-photo packageName: expo-live-photo platforms: ["ios"] --- ## Installation ## Usage Here's a simple example of `expo-live-photo` usage combined with `expo-image-picker`. ```tsx const viewRef = useRef<LivePhotoViewType>(null); const [livePhoto, setLivePhoto] = useState<LivePhotoAsset | null>(null); const pickImage = async () => { const result = await ImagePicker.launchImageLibraryAsync({ mediaTypes: ['livePhotos'], }); if (!result.canceled && result.assets[0].pairedVideoAsset?.uri) { setLivePhoto({ photoUri: result.assets[0].uri, pairedVideoUri: result.assets[0].pairedVideoAsset.uri, }); } else { console.error('Failed to pick a live photo'); } }; if (!LivePhotoView.isAvailable()) { return ( <View style={styles.container}> <Text>expo-live-photo is not available on this platform 😕</Text> </View> ); } return ( <View style={styles.container}> <LivePhotoView ref={viewRef} source={livePhoto} style={[styles.livePhotoView, { display: livePhoto ? 'flex' : 'none' }]} onLoadComplete={() => { console.log('Live photo loaded successfully!'); }} onLoadError={error => { console.error('Failed to load the live photo: ', error.message); }} /> <View style={livePhoto ? styles.pickImageCollapsed : styles.pickImageExpanded}> </View> <Button title="Start Playback Hint" onPress={() => viewRef.current?.startPlayback('hint')} /> <Button title="Start Playback" onPress={() => viewRef.current?.startPlayback('full')} /> <Button title="Stop Playback" onPress={() => viewRef.current?.stopPlayback()} /> </View> ); } const styles = StyleSheet.create({ container: { flex: 1, alignItems: 'center', paddingVertical: 20, paddingHorizontal: 40, }, livePhotoView: { alignSelf: 'stretch', height: 300, }, pickImageExpanded: { alignSelf: 'stretch', height: 300, justifyContent: 'center', }, pickImageCollapsed: { marginVertical: 10, }, button: { marginVertical: 10, }, }); ``` ## API ```js ```