react-native-modern-qrscanner - npm Package Compare versions

Comparing version 1.0.3 to 1.0.4

package.json

 {
   "name": "react-native-modern-qrscanner",
-  "version": "1.0.3",
+  "version": "1.0.4",
   "description": "A modern-designed and powerful QR code scanner for React Native with advanced features.",
@@ -43,3 +43,2 @@ "main": "index.js",
   "dependencies": {
-    "prop-types": "^15.8.1"
   },
@@ -46,0 +45,0 @@ "devDependencies": {

README.md

 
 # React Native Modern QR Scanner
 
+
+[![npm version](https://img.shields.io/npm/v/react-native-modern-qrscanner)](https://www.npmjs.com/package/react-native-modern-qrscanner)
+[![npm downloads](https://img.shields.io/npm/dw/react-native-modern-qrscanner)](https://www.npmjs.com/package/react-native-modern-qrscanner)
+[![Coverage Status](https://coveralls.io/repos/github/calintamas/react-native-modern-qrscanner/badge.svg?branch=master)](https://coveralls.io/github/calintamas/react-native-modern-qrscanner?branch=main)
+[![code style: prettier](https://img.shields.io/badge/code_style-prettier-ff69b4.svg)](https://github.com/prettier/prettier)
+
+
 A powerful and customizable QR code scanner component for React Native applications.
@@ -13,4 +20,11 @@
 
+
+## Demo
+
+
+![toast gif](./docs/demo.gif)
+
+
 ## Installation
-
+x
 ```bash
@@ -17,0 +31,0 @@ npm install react-native-modern-qrscanner

src/ModernQRScannerView.js

@@ -5,8 +5,7 @@ import React, { Component } from 'react';
   View,
+  Image,
   Animated,
   Easing,
-  Image
 } from 'react-native';
 
-// 별도의 유틸리티 파일로 이동 가능한 스타일 계산 함수들
 const calculateBorderSize = (props, isCornerOffset) => {
@@ -26,3 +25,3 @@ if (isCornerOffset) {
     maskColor: '#0000004D',
-    cornerColor: 'red',
+    cornerColor: '#D3FF00',
     borderColor: '#000000',
@@ -38,3 +37,3 @@ rectHeight: 200,
     scanBarAnimateTime: 2500,
-    scanBarColor: 'red',
+    scanBarColor: '#D3FF00',
     scanBarImage: null,
@@ -62,2 +61,3 @@ scanBarHeight: 1.5,
 
+
   startScannerLineMove = () => {
@@ -102,6 +102,9 @@ if (this.isClosed) return;
   render() {
-    const animatedStyle = {
-      transform: [{ translateY: this.state.animatedValue }],
+    const { rectHeight, rectWidth } = this.props;
+    const viewfinderStyle = {
+      height: rectHeight,
+      width: rectWidth,
+      alignItems: 'center',
+      justifyContent: 'center',
     };
-
     const borderSize = calculateBorderSize(this.props, this.props.isCornerOffset);
@@ -111,3 +114,3 @@
       <View style={styles.container}>
-        <View style={[styles.viewfinder, this.props.rectHeight, this.props.rectWidth]}>
+        <View style={viewfinderStyle}>
           <View style={[borderSize, styles.borderStyle, { borderColor: this.props.borderColor, borderWidth: this.props.borderWidth }]} />
@@ -122,5 +125,3 @@
           {/* Scan Bar */}
-          <View>
-            {this.renderScanBar()}
-          </View>
+          {this.renderScanBar()}
         </View>
@@ -134,20 +135,16 @@ </View>
   container: {
+    flex: 1,
     alignItems: 'center',
     justifyContent: 'center',
-    position: 'absolute',
-    top: 0,
-    right: 0,
-    left: 0,
   },
   viewfinder: {
-    alignItems: 'center',
-    justifyContent: 'center',
   },
   borderStyle: {
-    // Border style properties
+    position: 'absolute',
   },
   cornerStyle: {
     position: 'absolute',
-    height: 20, // 예시 값, 실제로는 props로부터 받은 값을 사용
-    width: 20,  // 예시 값, 실제로는 props로부터 받은 값을 사용
+    height: 20,
+    width: 20,
+    borderRadius: 5,
   },
@@ -170,50 +167,2 @@ topLeftCorner: {
   },
-  container: {
-    alignItems: 'center',
-    justifyContent: 'center',
-    position: 'absolute',
-    top: 0,
-    right: 0,
-    left: 0
-  },
-  viewfinder: {
-    alignItems: 'center',
-    justifyContent: 'center'
-  },
-  topLeftCorner: {
-    position: 'absolute',
-    top: 0,
-    left: 0
-  },
-  topRightCorner: {
-    position: 'absolute',
-    top: 0,
-    right: 0
-  },
-  bottomLeftCorner: {
-    position: 'absolute',
-    bottom: 0,
-    left: 0
-  },
-  bottomRightCorner: {
-    position: 'absolute',
-    bottom: 0,
-    right: 0
-  },
-  topMask: {
-    position: 'absolute',
-    top: 0
-  },
-  leftMask: {
-    position: 'absolute',
-    left: 0
-  },
-  rightMask: {
-    position: 'absolute',
-    right: 0
-  },
-  bottomMask: {
-    position: 'absolute',
-    bottom: 0
-  }
 });

No alert changes

Improved metrics

Total package byte prevSize

6747869

increased by5241.25%

Dependency count

0

decreased by-100%

Number of package files

46

increased by31.43%

Number of lines in readme file

74

increased by23.33%

Worsened metrics

Lines of code

308

decreased by-14.21%

Dependency changes

• - Removedprop-types@^15.8.1

• - Removedjs-tokens@4.0.0(transitive)

• - Removedloose-envify@1.4.0(transitive)

• - Removedobject-assign@4.1.1(transitive)

• - Removedprop-types@15.8.1(transitive)

• - Removedreact-is@16.13.1(transitive)