# react-native-simple-camera

> A Camera component for React Native. Also reads barcodes. Based on react-native-camera.

Latest version **0.1.1** (published 2018-03-12) · 0 weekly downloads

## Install

```sh
npm install react-native-simple-camera
pnpm add react-native-simple-camera
yarn add react-native-simple-camera
bun add react-native-simple-camera
```

## Health

**Score 10/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support; low quality score; large bundle; pre 1.0.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.1.1 |
| Published | 2018-03-12 |
| First published | 2018-03-05 |
| Weekly downloads | 0 |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 2 |
| Unpacked size | 99 MB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 7 |
| Author | Lauri Saarni |
| Maintainers | laurisaarni |
| Keywords | barcode, camera, code, native, qr, react, react-native |

## Links

- npm: https://www.npmjs.com/package/react-native-simple-camera
- Repository: https://github.com/laurisaarni/react-native-simple-camera
- Issues: https://github.com/laurisaarni/react-native-simple-camera/issues
- npm.io page: https://npm.io/package/react-native-simple-camera

## Dependencies (2)

- [react-native-camera](https://npm.io/package/react-native-camera.md) ^1.0.2
- [react-native-loading-spinner-overlay](https://npm.io/package/react-native-loading-spinner-overlay.md) ^0.5.2

## Alternatives

- [flatbuffers](https://npm.io/package/flatbuffers.md) — 6.0M weekly downloads
- [jwt-simple](https://npm.io/package/jwt-simple.md) — 259.5K weekly downloads
- [@exodus/patch-broken-hermes-typed-arrays](https://npm.io/package/@exodus/patch-broken-hermes-typed-arrays.md) — 28.5K weekly downloads
- [@native-to-anchor/buffer-layout](https://npm.io/package/@native-to-anchor/buffer-layout.md) — 12.2K weekly downloads
- [binary-parser-encoder](https://npm.io/package/binary-parser-encoder.md) — 5.3K weekly downloads

## Recent versions

- 0.1.1 (latest) — 2018-03-12
- 0.1.0 — 2018-03-06
- 0.0.1 — 2018-03-05

## README

# react-native-simple-camera

A sample project for React Native Camera.

## How to use the Component in your app

To use the Camera Component in your app you need to do following steps.

### Install dependencies

First, install the package

```
yarn add react-native-simple-camera
```
or the old npm style
```
npm i react-native-simple-camera --save
```

Secondly, link the package to your code base by running following command.

```
react-native link react-native-camera
```
If this does not work correctly. Please follow the manual installation steps: [See the documentation](https://github.com/react-native-community/react-native-camera#manual-install)

At least you need to add following missing parts manually.

#### android/app/src/main/AndroidManifest.xml
Add to beginning of the manifest.
```
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
  xmlns:tools="http://schemas.android.com/tools"
    package="com.kamera">
```
Add necessary permissions.

```
    <uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE" />
    <uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />
    <uses-permission android:name="android.permission.CAMERA" />
    <uses-feature android:name="android.hardware.camera" />
```

#### android/build.gradle
Add maven urls to the end off your build.gradle file as follows.
```
allprojects {
    repositories {
        mavenLocal()
        jcenter()
        maven {
            // All of React Native (JS, Obj-C sources, Android binaries) is installed from npm
            url "$rootDir/../node_modules/react-native/android"
        }
        maven {
            url "https://maven.google.com"
        }
        maven { url "https://jitpack.io" }
    }
}
```

### Add Component to your app

You can use it as camera or barcode scanner.

#### Capturing photos
```
<CameraContainer
  mode="photo"
  onCapturePhoto={
    (data) => console.log('Image captured!', data)
  }
/>
```

##### onCapturePhoto function

When a photo is captured the `onCapturePhoto` function provided as a property will be called. It will receive `data` object as its parameter. `data` contains information related to the image captured.


#### Scanning bar codes and QR codes
```
<CameraContainer
  mode="scanner"
  onBarCodeRead={
    (barcode) => console.log('Barcode Found!', 'Type: ' + barcode.type + '\nData: ' + barcode.data)
  }
/>
```

##### onBarCodeRead function

When the app reads a QR code the `onBarCodeRead` function provided as a property will be called. It will receive `barcode` object as its parameter. `barcode` contains information related to the code captured. Returned data contains type of the code and data that it contained.


## License

This project is licensed under the MIT License

---
_Source: https://npm.io/package/react-native-simple-camera · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._