optimatica-meters-react-native
React Native компонент MeterPhotoAnalyzer для iOS и Android. Поддерживает несколько фото за один раз (до 10): мультивыбор из галереи (selectionLimit: 0) и дозапись снимков с камеры.
Установка
bash
npm install optimatica-meters-react-native optimatica-meters react-native-image-pickerPeer dependencies:
react>= 18react-native>= 0.72react-native-image-picker>= 7
Настройте нативные permissions для камеры и галереи согласно документации image-picker.
Использование
tsx
import { MeterPhotoAnalyzer } from 'optimatica-meters-react-native'
export function MeterScreen() {
return (
<MeterPhotoAnalyzer
apiKey="eyJhbGci..."
onSuccess={(result) => {
console.log(result.meter.serialNumber)
}}
/>
)
}Props
| Prop | Тип | По умолчанию | Описание |
|---|---|---|---|
apiKey | string | — | API-ключ (JWT) |
showApiKeyInput | boolean | auto | Поле ввода ключа |
showRawJson | boolean | false | Показать сырой JSON-ответ |
disabled | boolean | false | Отключить UI |
theme | 'light' | 'dark' | 'auto' | 'auto' | Цветовая тема. auto следует системной теме устройства |
Callbacks
| Callback | Payload |
|---|---|
onAnalyzeStart | ReactNativeImageAsset (по разу на каждое отправленное фото) |
onSuccess | { success: true, meter } (по разу на каждый распознанный счётчик) |
onError | string |
onComplete | (response, error) — response есть только при единственном фото |
onResults | AnalyzeMeterResponse[] — массив результатов по всем фото |
Камера и галерея
Компонент использует:
launchCamera()— съёмкаlaunchImageLibrary()— выбор из галереи
Изображение отправляется через FormData с { uri, name, type } — см. optimatica-meters.
Hook
tsx
import { useMeterAnalyze } from 'optimatica-meters-react-native'
const { isLoading, response, responses, error, analyze, analyzeMany, reset } =
useMeterAnalyze()analyzeMany([asset1, asset2]) отправляет несколько фото за один запрос; responses — массив результатов по всем фото.
Стили
Встроенный StyleSheet — отдельный CSS не требуется.