ميزات الجهاز الأصلية — React Native المتقدم

الميزات الأصلية في React Native

1. الكاميرا

npx expo install expo-camera expo-image-picker

import * as ImagePicker from 'expo-image-picker';
import { Camera } from 'expo-camera';

// اختيار صورة من المعرض
async function pickImage() {
  const result = await ImagePicker.launchImageLibraryAsync({
    mediaTypes: ImagePicker.MediaTypeOptions.Images,
    allowsEditing: true,
    aspect: [4, 3],
    quality: 0.8,
  });

  if (!result.canceled) {
    console.log(result.assets[0].uri);
  }
}

// التقاط صورة بالكاميرا
async function takePhoto() {
  const { status } = await Camera.requestCameraPermissionsAsync();
  
  if (status !== 'granted') {
    Alert.alert('يجب السماح بالكاميرا');
    return;
  }

  const result = await ImagePicker.launchCameraAsync({
    allowsEditing: true,
    aspect: [1, 1],
    quality: 1,
  });

  if (!result.canceled) {
    return result.assets[0].uri;
  }
}

// مكون الكاميرا المباشر
function CameraScreen() {
  const [facing, setFacing] = useState('back');
  const cameraRef = useRef(null);

  const takePicture = async () => {
    if (cameraRef.current) {
      const photo = await cameraRef.current.takePictureAsync();
      console.log(photo.uri);
    }
  };

  return (
    <Camera 
      ref={cameraRef}
      style={{ flex: 1 }} 
      facing={facing}
    >
      <TouchableOpacity onPress={takePicture}>
        <Text>📸</Text>
      </TouchableOpacity>
    </Camera>
  );
}

2. الموقع الجغرافي

npx expo install expo-location

import * as Location from 'expo-location';

async function getLocation() {
  const { status } = await Location.requestForegroundPermissionsAsync();
  
  if (status !== 'granted') {
    Alert.alert('يجب السماح بالموقع');
    return;
  }

  const location = await Location.getCurrentPositionAsync({
    accuracy: Location.Accuracy.High,
  });

  console.log(location.coords.latitude, location.coords.longitude);
  return location;
}

// تتبع الموقع
useEffect(() => {
  let subscription;

  const startTracking = async () => {
    subscription = await Location.watchPositionAsync(
      {
        accuracy: Location.Accuracy.High,
        timeInterval: 5000,
        distanceInterval: 10,
      },
      (location) => {
        console.log('New location:', location);
      }
    );
  };

  startTracking();

  return () => subscription?.remove();
}, []);

// تحويل الإحداثيات لعنوان
const address = await Location.reverseGeocodeAsync({
  latitude: 33.3,
  longitude: 44.4,
});
console.log(address[0].city, address[0].country);

3. الإشعارات

npx expo install expo-notifications

import * as Notifications from 'expo-notifications';

// إعداد الإشعارات
Notifications.setNotificationHandler({
  handleNotification: async () => ({
    shouldShowAlert: true,
    shouldPlaySound: true,
    shouldSetBadge: true,
  }),
});

// طلب الإذن
async function registerForPushNotifications() {
  const { status } = await Notifications.requestPermissionsAsync();
  
  if (status !== 'granted') {
    Alert.alert('يجب السماح بالإشعارات');
    return;
  }

  const token = await Notifications.getExpoPushTokenAsync();
  console.log('Push Token:', token.data);
  return token.data;
}

// إرسال إشعار محلي
async function sendLocalNotification() {
  await Notifications.scheduleNotificationAsync({
    content: {
      title: 'مرحباً!',
      body: 'هذا إشعار تجريبي',
      data: { screen: 'Home' },
    },
    trigger: { seconds: 2 },
  });
}

// الاستماع للإشعارات
useEffect(() => {
  const subscription = Notifications.addNotificationReceivedListener(
    (notification) => {
      console.log('Notification received:', notification);
    }
  );

  const responseSubscription = Notifications.addNotificationResponseReceivedListener(
    (response) => {
      const { screen } = response.notification.request.content.data;
      if (screen) navigation.navigate(screen);
    }
  );

  return () => {
    subscription.remove();
    responseSubscription.remove();
  };
}, []);

4. التخزين المحلي للملفات

npx expo install expo-file-system

import * as FileSystem from 'expo-file-system';

// قراءة ملف
const content = await FileSystem.readAsStringAsync(
  FileSystem.documentDirectory + 'data.json'
);

// كتابة ملف
await FileSystem.writeAsStringAsync(
  FileSystem.documentDirectory + 'data.json',
  JSON.stringify({ name: 'test' })
);

// تحميل ملف
const downloadResult = await FileSystem.downloadAsync(
  'https://example.com/image.jpg',
  FileSystem.documentDirectory + 'image.jpg'
);
console.log('Downloaded to:', downloadResult.uri);

// معلومات الملف
const info = await FileSystem.getInfoAsync(fileUri);
console.log('Size:', info.size);

5. المشاركة

npx expo install expo-sharing

import * as Sharing from 'expo-sharing';

async function shareFile(uri) {
  const isAvailable = await Sharing.isAvailableAsync();
  
  if (isAvailable) {
    await Sharing.shareAsync(uri, {
      mimeType: 'image/jpeg',
      dialogTitle: 'شارك الصورة',
    });
  }
}