How to save the QR Data and copy my clipboard?

Viewed 285

I just have some question. First, I'm beginner... Very sorry.

I have been developed the react-native app (iOS) for recognize the QR Code.

I already have been succeed the recognize the QR Code on my App.

But My Plan is..

First, I scan the QR Code and I want to save the QR data.

For the purpose, there are many QR Code in the warehouse above many box and it is included Serial Number.

After scanning, I will continue the scan until I want to stop it. (In conclusion, I scan many times.)

I just thought "Let's save the Serial Number at array.

Second, I save the serial number through the scanning and I want to copy our clipboard.

Also, I want to print in my App.

How can I implement this? I have no idea about that.

Code is here.

import { StatusBar } from 'expo-status-bar';
import React, {useState, useEffect} from 'react'
import { StyleSheet, Text, View, Button } from 'react-native';
import { BarCodeScanner } from 'expo-barcode-scanner';

export default function App() {
  

  const [hasPermisson, setHasPermisson] = useState(null);
  const [scanned, setScanned] = useState(false);
  const [text, setText] = useState('Not yet scanned')

  const askForCameraPermisson = () => {
    (async () => {
      const {status} = await BarCodeScanner.requestPermissionsAsync();
      setHasPermisson(status == 'granted')
    })()
  }

  useEffect(() => {
    askForCameraPermisson ();
  }, [])

  
  const handleBarCodeScanned = ({type, data}) => {
    setScanned(true);
    setText(text);
    
    state = {
      sn : [
        {
          type : type,
          data : data
        },
        {
          type : type,
          data : data
        }
      ]
    }
    console.log(state)
    
  }

  if (hasPermisson === null) {
    return (
      <View style={styles.container}>
        <Text>Requesting for camera permisson</Text>
        <StatusBar style="auto" />
      </View>
    )
    
  }

  if(hasPermisson === false) {
    return (
      <View style={styles.container}>
        <Text>No acess to camera</Text>
        <Button title={'Allow Camera'} onPress={() => askForCameraPermisson()}/>
      </View>
    )
  }

  
  return (
    <View style={styles.container}>
      
      <View style={styles.barcodebox}>

        <BarCodeScanner
        onBarCodeScanned={scanned ? undefined : handleBarCodeScanned}
        style = {{ height:400, width:400}} />
        

      </View>
      <Text style={styles.maintext}>{text}</Text>
      
      {scanned && <Button title={'scan again?'} onPress={( ) => setScanned(false)} color='tomato'/>}
    </View>
  );
}



const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: '#fff',
    alignItems: 'center',
    justifyContent: 'center',
  },

  barcodebox: {
    alignItems: 'center',
    justifyContent: 'center',
    height: 300,
    width:300,
    overflow:'hidden',
    borderRadius:30,
    backgroundColor:'tomato'
  },

  maintext: {
    fontSize :16,
    margin:20

  }

});
0 Answers
Related