https://github.com/rishichawda/react-native-qrcode-generator

A minimal QRcode component for React Native
https://github.com/rishichawda/react-native-qrcode-generator

Last synced: about 2 months ago
JSON representation

A minimal QRcode component for React Native

• Host: GitHub
• URL: https://github.com/rishichawda/react-native-qrcode-generator
• Owner: rishichawda
• License: mit
• Created: 2019-04-09T07:18:16.000Z (over 5 years ago)
• Default Branch: master
• Last Pushed: 2023-01-26T06:19:32.000Z (almost 2 years ago)
• Last Synced: 2024-10-14T14:15:55.331Z (2 months ago)
• Language: JavaScript
• Homepage: https://www.npmjs.com/package/react-native-qrcode-generator
• Size: 119 KB
• Stars: 32
• Watchers: 2
• Forks: 12
• Open Issues: 6
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
#### This is a fork of [react-native-qrcode](https://github.com/cssivision/react-native-qrcode) with fixes and other enhancements since the original is not maintained anymore.

# react-native-qrcode

A react-native component to generate [QRcode](http://en.wikipedia.org/wiki/QR_code).

## Installation

```sh

npx install-peerdeps --save react-native-qrcode-generator

```

*(**Note** : If you want to use the original unmaintained package, [visit this link](https://github.com/cssivision/react-native-qrcode)).*

## Usage

```jsx

'use strict';

import React, { Component } from 'react'

import QRCode from 'react-native-qrcode-generator';

import {

    AppRegistry,

    StyleSheet,

    View,

    TextInput

} from 'react-native';

class HelloWorld extends Component {

  state = {

    text: 'http://facebook.github.io/react-native/',

  };

  render() {

    return (

      

         this.setState({text: text})}

          value={this.state.text}

        />

        

      

    );

  };

}

const styles = StyleSheet.create({

    container: {

        flex: 1,

        backgroundColor: 'white',

        alignItems: 'center',

        justifyContent: 'center'

    },

    input: {

        height: 40,

        borderColor: 'gray',

        borderWidth: 1,

        margin: 10,

        borderRadius: 5,

        padding: 5,

    }

});

AppRegistry.registerComponent('HelloWorld', () => HelloWorld);

module.exports = HelloWorld;

```

#### Output : 



##

## Available Props

prop      | type                 | Description

----------|----------------------|--------------

`value`   | `string`  ( **Default** : `http://facebook.github.io/react-native/` ) | Value of the QRCode. 

`size`    | `number` ( **Default** : `128` ) | Size of the qrcode / image.

`bgColor` | `string` ( **Default** : `white` ) | Background Color for the qrcode / image.

`fgColor` | `string` ( **Default** : `black` ) | Foreground Color for the qrcode / image.

`getImageOnLoad` | `function` | Returns the base64 png image data *( string )*.

## Licenses

All source code is licensed under the [MIT License](https://github.com/rishichawda/react-native-qrcode/blob/master/LICENSE).