react-native-mtp-camera

get live image from nikon or canon camera to mobile through usb (Android only)

Installation

1npm install @consolecodea/react-native-mtp-camera
2

Android Setup

Permissions

To integrate react-native-mtp-camera into your Android project, follow these steps to configure your Android manifest:

• Open Your Android Manifest File: Navigate to your Android project's android/app/src/main/AndroidManifest.xml file.
• Add Permissions: Ensure the following permissions are included within the tag:

1<uses-permission android:name="android.permission.INTERNET" />
2<uses-permission android:name="android.permission.POST_NOTIFICATIONS" />
3<uses-permission android:name="android.permission.FOREGROUND_SERVICE" />
4

These permissions are required for network communication, notifications, and running services in the foreground.

• Declare USB Host Feature: Add the USB host feature declaration. This is essential for communicating with USB devices:

1<uses-feature android:name="android.hardware.usb.host" android:required="true" />

• Configure MainActivity: Update your tag for the MainActivity to handle USB device attachments and set launch configuration:

1<activity
2    android:name=".MainActivity"
3    android:label="@string/app_name"
4    android:configChanges="keyboard|keyboardHidden|orientation|screenLayout|screenSize|smallestScreenSize|uiMode"
5    android:launchMode="singleTask"
6    android:windowSoftInputMode="adjustResize"
7    android:exported="true">
8
9    <!-- Main launcher intent filter -->
10    <intent-filter>
11        <action android:name="android.intent.action.MAIN" />
12        <category android:name="android.intent.category.LAUNCHER" />
13    </intent-filter>
14
15    <!-- Intent filter for USB device attached -->
16    <intent-filter>
17        <action android:name="android.hardware.usb.action.USB_DEVICE_ATTACHED" />
18    </intent-filter>
19
20    <!-- Metadata for USB device filter -->
21    <meta-data android:name="android.hardware.usb.action.USB_DEVICE_ATTACHED"
22        android:resource="@xml/device_filter" />
23</activity>

• Create a new file named device_filter.xml under android/app/src/main/res/xml/ (if it doesn't exist already), and paste the following content:

1<?xml version="1.0" encoding="utf-8"?>
2<resources>
3    <usb-device class="6" />
4</resources>

• Add ImageLoadingService: If your package includes a service (e.g., ImageLoadingService), declare it within the tag:

1<service
2    android:name="com.mtpcamera.ImageLoadingService"
3    android:foregroundServiceType="dataSync" />
4

Explanation:

• Permissions: Make sure to explain any critical permissions required by your package, such as INTERNET, POST_NOTIFICATIONS, and FOREGROUND_SERVICE. These are already included in your manifest.
• Manifest Updates: Provide a clear overview of how to integrate your package into an existing Android project, highlighting key aspects like MainActivity setup, USB device attachment handling, and the ImageLoadingService.

This updated README will help users understand how to configure their Android projects to work with your react-native-mtp-camera package effectively.

Usage

1import {
2  startService,
3  stopService,
4  cameraEventLister,
5  type cameraEventProps,
6} from '@consolecodea/react-native-mtp-camera';
7import { NativeEventEmitter } from 'react-native';
8const eventEmitter = new NativeEventEmitter();
9
10// Start the image loading service
11startService()
12  .then(() => {
13    console.log('Service started');
14  })
15  .catch((error) => {
16    console.error('Failed to start service:', error);
17  });
18
19// Stop the image loading service
20stopService()
21  .then(() => {
22    console.log('Service stopped');
23  })
24  .catch((error) => {
25    console.error('Failed to stop service:', error);
26  });
27
28// Listen for new images
29  eventEmitter.addListener(
30      cameraEventLister.onNewImage,
31      (event: cameraEventProps) => {
32        setImage(event.imagePath);
33      }
34    );
35
36
37// Remember to remove the listener when it's no longer needed
38 return () => {
39      eventEmitter.removeAllListeners(cameraEventLister.onNewImage);
40    };

Props

Method	Description
startService()	Starts the image loading service.
stopService()	Stops the image loading service.

Event Listeners

Listener	Description
cameraEventLister.onNewImage	Triggered when a new image is received.

Event Properties

Property	Description
cameraEventProps.imagePath	Image file uri.
cameraEventProps.imageBase64	Image base64.

Contributing

See the contributing guide to learn how to contribute to the repository and the development workflow.

License

MIT