APIs de Plataforma
React Native proporciona acceso a APIs nativas del dispositivo. Con Expo, muchas APIs estan disponibles inmediatamente. Con CLI, puedes necesitar configuracion adicional.
Camara
// Con Expo
import { Camera } from 'expo-camera';
import { useState, useRef } from 'react';
function CamaraApp() {
const [permiso, solicitarPermiso] = Camera.useCameraPermissions();
const camaraRef = useRef(null);
if (!permiso) return <View />;
if (!permiso.granted) {
return (
<View>
<Text>Necesitamos acceso a la camara</Text>
<Button title="Dar permiso" onPress={solicitarPermiso} />
</View>
);
}
const tomarFoto = async () => {
const foto = await camaraRef.current.takePictureAsync();
console.log(foto.uri);
};
return (
<Camera ref={camaraRef} style={{ flex: 1 }}>
<TouchableOpacity onPress={tomarFoto}>
<Text>Capturar</Text>
</TouchableOpacity>
</Camera>
);
}
Ubicacion
import * as Location from 'expo-location';
async function obtenerUbicacion() {
// Solicitar permiso
const { status } = await Location.requestForegroundPermissionsAsync();
if (status !== 'granted') {
Alert.alert('Permiso denegado');
return;
}
// Obtener ubicacion actual
const ubicacion = await Location.getCurrentPositionAsync({});
console.log(ubicacion.coords.latitude, ubicacion.coords.longitude);
return ubicacion;
}
// Seguimiento continuo
function usarSeguimiento() {
useEffect(() => {
const suscripcion = Location.watchPositionAsync(
{
accuracy: Location.Accuracy.High,
distanceInterval: 10, // metros
},
(ubicacion) => {
console.log('Nueva ubicacion:', ubicacion);
}
);
return () => suscripcion.remove();
}, []);
}
Notificaciones Push
import * as Notifications from 'expo-notifications';
// Configurar manejador
Notifications.setNotificationHandler({
handleNotification: async () => ({
shouldShowAlert: true,
shouldPlaySound: true,
shouldSetBadge: false,
}),
});
// Registrar para notificaciones
async function registrarParaNotificaciones() {
const { status } = await Notifications.requestPermissionsAsync();
if (status !== 'granted') {
Alert.alert('Permiso denegado');
return;
}
const token = await Notifications.getExpoPushTokenAsync();
console.log('Token:', token.data);
return token.data;
}
// Programar notificacion local
async function programarNotificacion() {
await Notifications.scheduleNotificationAsync({
content: {
title: 'Recordatorio',
body: 'No olvides revisar la app!',
},
trigger: { seconds: 60 },
});
}
Selector de Imagenes
import * as ImagePicker from 'expo-image-picker';
async function seleccionarImagen() {
// Solicitar permiso
const { status } = await ImagePicker.requestMediaLibraryPermissionsAsync();
if (status !== 'granted') {
Alert.alert('Necesitamos acceso a tus fotos');
return;
}
// Abrir selector
const resultado = await ImagePicker.launchImageLibraryAsync({
mediaTypes: ImagePicker.MediaTypeOptions.Images,
allowsEditing: true,
aspect: [4, 3],
quality: 0.8,
});
if (!resultado.canceled) {
return resultado.assets[0].uri;
}
}
Compartir
import { Share } from 'react-native';
async function compartirContenido() {
try {
const resultado = await Share.share({
message: 'Mira esta app increible!',
url: 'https://miapp.com', // Solo iOS
title: 'Mi App',
});
if (resultado.action === Share.sharedAction) {
console.log('Compartido exitosamente');
}
} catch (error) {
Alert.alert('Error al compartir');
}
}
Vibracion y Haptics
import { Vibration } from 'react-native';
import * as Haptics from 'expo-haptics';
// Vibracion simple
Vibration.vibrate();
// Patron de vibracion
Vibration.vibrate([500, 200, 500]); // vibra, pausa, vibra
// Haptics (feedback tactil)
Haptics.impactAsync(Haptics.ImpactFeedbackStyle.Medium);
Haptics.notificationAsync(Haptics.NotificationFeedbackType.Success);
Haptics.selectionAsync();
APIs Disponibles con Expo
expo-camera- Acceso a camaraexpo-location- GPS y ubicacionexpo-notifications- Push y localesexpo-image-picker- Selector de fotosexpo-file-system- Archivosexpo-av- Audio y videoexpo-sensors- Acelerometro, giroscopio