Update mobileapp.txt

mobileapp.txt

@@ -0,0 +1,50 @@
+import React, { useState } from 'react';
+import { View, Image, TouchableOpacity, Text } from 'react-native';
+import ImagePicker from 'react-native-image-picker';
+import { ImageEditor } from 'react-native';
+
+const CropImage = () => {
+  const [croppedImage, setCroppedImage] = useState(null); // State to store the cropped image URI
+
+  const handleSelectImage = () => {
+    ImagePicker.showImagePicker({ mediaType: 'photo' }, (response) => {
+      if (!response.didCancel) {
+        const { uri } = response;
+        cropImage(uri);
+      }
+    });
+  };
+
+  const cropImage = (imageUri) => {
+    const cropData = {
+      offset: { x: 100, y: 100 }, // x, y coordinates to start cropping
+      size: { width: 200, height: 200 }, // width, height of the cropped area
+      displaySize: { width: 200, height: 200 }, // desired width, height of the cropped image
+      resizeMode: 'contain', // resizing mode
+    };
+
+    ImageEditor.cropImage(
+      imageUri,
+      cropData,
+      (croppedURI) => {
+        // Handle the cropped image URI
+        console.log('Cropped image URI:', croppedURI);
+        setCroppedImage({ uri: croppedURI });
+      },
+      (error) => {
+        console.error('Error cropping image:', error);
+      }
+    );
+  };
+
+  return (
+    <View>
+      <TouchableOpacity onPress={handleSelectImage}>
+        <Text>Select Image</Text>
+      </TouchableOpacity>
+      {croppedImage && <Image source={croppedImage} style={{ width: 200, height: 200 }} />}
+    </View>
+  );
+};
+
+export default CropImage;