status-im
/
react-native-camera-kit
mirror of https://github.com/status-im/react-native-camera-kit.git
2
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #165 from wix/revert-159-perfomanceIssuesIOS 

Revert "update Barcode scanner usage"
This commit is contained in:
Ran Greenberg 2018-04-23 18:22:03 +03:00 committed by GitHub
parent 05312e62d8 fe16f2f51c
commit d9fddaec87
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
9 changed files with 146 additions and 238 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

27
README.md
View File

@ -227,23 +227,16 @@ Attribute | Values
<CameraKitCameraScreen
actions={{ rightButtonText: 'Done', leftButtonText: 'Cancel' }}
onBottomButtonPressed={(event) => this.onBottomButtonPressed(event)}
flashImages={{
on: require('./../images/flashOn.png'),
off: require('./../images/flashOff.png'),
auto: require('./../images/flashAuto.png')
}}
showFrame={true} //(default false) optional, show frame with transparent layer (qr code or barcode will be read on this area ONLY), start animation for scanner,that stoped when find any code.
laserColor={"blue"} // optional (default is white) property that set color of the scanning line in scanning frame
surfaceColor={"black"} // optional (default is black) when scanner appears, we see smooth animation with fade from setted color
frameColor={"yellow"} // optional (default is white) property that set color of corners scanning frame
onReadCode={((event) => this.setState({ example: CheckingScreen }))} // callback usage , if you want to get value that was scanned use this for example onReadCode={((event) => Alert.alert(Qr code found ${event.nativeEvent.codeStringValue}))}
hideControls={true} //(default false) optional, hide buttons and additional controls on top and bottom of screen
frameHeight={frameHeight} // (required property) height of scanner frame
frameWidth={frameWidth} // (required property) width of scanner frame
frameLeft={frameleft} // optional (default is 0) left offset for scanner frame
frameTop={frameTop} // optional (default is 0) top offset for scanner frame
overlayColor={'rgba(255, 0, 0, 0.5)'} // optional (default is black) set color for transculent view over the scanner frame
scanBarcode={true}
laserColor={"blue"}
frameColor={"yellow"}
onReadQRCode={((event) => Alert.alert("Qr code found"))} //optional
hideControls={false} //(default false) optional, hide buttons and additional controls on top and bottom of screen
showFrame={true} //(default false) optional, show frame with transparent layer (qr code or barcode will be read on this area ONLY), start animation for scanner,that stoped when find any code. Frame always at center of the screen
offsetForScannerFrame = {10} //(default 30) optional, offset from left and right side of the screen
heightForScannerFrame = {300} //(default 200) optional, change height of the scanner frame
colorForScannerFrame = {'red'} //(default white) optional, change colot of the scanner frame
/>
```

36
android/src/main/java/com/wix/RNCameraKit/Utils.java
View File

@ -2,12 +2,10 @@ package com.wix.RNCameraKit;
import android.content.ContentResolver;
import android.content.Context;
import android.content.res.Resources;
import android.graphics.Bitmap;
import android.graphics.BitmapFactory;
import android.net.Uri;
import android.support.annotation.NonNull;
import android.util.TypedValue;
import com.facebook.react.bridge.Arguments;
import com.facebook.react.bridge.ReadableArray;
@ -39,30 +37,23 @@ public class Utils {
return null;
}
@Nullable
public static Integer getIntSafe(ReadableMap map, String key) {
return getIntSafe(map, key, null);
}
public static Integer getIntSafe(ReadableMap map, String key, Integer defaultInt) {
public static @Nullable Integer getIntSafe(ReadableMap map, String key) {
if (map.hasKey(key)) {
return map.getInt(key);
}
return defaultInt;
return null;
}
@Nullable
public static Boolean getBooleanSafe(ReadableMap map, String key) {
public static @Nullable Boolean getBooleanSafe(ReadableMap map, String key) {
if (map.hasKey(key)) {
return map.getBoolean(key);
}
return null;
}
@NonNull
public static ArrayList<String> readableArrayToList(ReadableArray items) {
public static @NonNull ArrayList<String> readableArrayToList(ReadableArray items) {
ArrayList<String> list = new ArrayList<>();
for (int i = 0; i < items.size(); i++) {
for(int i = 0; i < items.size(); i++) {
list.add(items.getString(i));
}
return list;
@ -92,8 +83,8 @@ public class Utils {
WritableMap ans = Arguments.createMap();
ans.merge(image);
ans.putString("uri", FILE_PREFIX + resizedImagePath);
ans.putInt("size", (int) new File(resizedImagePath).length());
ans.putString("uri", FILE_PREFIX+resizedImagePath);
ans.putInt("size", (int)new File(resizedImagePath).length());
ans.putInt("width", scaledImage.getWidth());
ans.putInt("height", scaledImage.getHeight());
return ans;
@ -113,7 +104,7 @@ public class Utils {
float width = image.getWidth();
float height = image.getHeight();
float ratio = Math.min((float) maxWidth / width, (float) maxHeight / height);
float ratio = Math.min((float)maxWidth / width, (float)maxHeight / height);
int finalWidth = (int) (width * ratio);
int finalHeight = (int) (height * ratio);
@ -175,14 +166,14 @@ public class Utils {
* Loads the bitmap resource from the file specified in imagePath.
*/
private static Bitmap loadBitmapFromFile(Context context, String imagePath, int newWidth,
int newHeight) throws IOException {
int newHeight) throws IOException {
// Decode the image bounds to find the size of the source image.
BitmapFactory.Options options = new BitmapFactory.Options();
options.inJustDecodeBounds = true;
loadBitmap(context, imagePath, options);
// Set a sample size according to the image size to lower memory usage.
options.inSampleSize = calculateInSampleSize(options.outWidth, options.outHeight, newWidth, newHeight);
options.inSampleSize = calculateInSampleSize(options.outWidth, options.outHeight , newWidth, newHeight);
options.inJustDecodeBounds = false;
return loadBitmap(context, imagePath, options);
}
@ -199,7 +190,7 @@ public class Utils {
}
File newFile = new File(saveDirectory, fileName + "." + compressFormat.name());
if (!newFile.createNewFile()) {
if(!newFile.createNewFile()) {
throw new IOException("The file already exists");
}
@ -230,9 +221,4 @@ public class Utils {
public static void runOnWorkerThread(Runnable runnable) {
new Thread(runnable).start();
}
public static int convertDpToPx(int dp, Context context) {
Resources r = context.getResources();
return (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, dp, r.getDisplayMetrics());
}
}

28
android/src/main/java/com/wix/RNCameraKit/camera/CameraView.java
View File

@ -3,13 +3,11 @@ package com.wix.RNCameraKit.camera;
import android.graphics.Color;
import android.graphics.Rect;
import android.support.annotation.ColorInt;
import android.util.Log;
import android.view.SurfaceHolder;
import android.view.SurfaceView;
import android.view.View;
import android.widget.FrameLayout;
import com.facebook.react.bridge.ReadableMap;
import com.facebook.react.uimanager.ThemedReactContext;
import com.wix.RNCameraKit.Utils;
import com.wix.RNCameraKit.camera.barcode.BarcodeFrame;
@ -22,7 +20,8 @@ public class CameraView extends FrameLayout implements SurfaceHolder.Callback {
private boolean showFrame;
private Rect frameRect;
private BarcodeFrame barcodeFrame;
private ReadableMap scannerOptions;
@ColorInt private int frameColor = Color.GREEN;
@ColorInt private int laserColor = Color.RED;
public CameraView(ThemedReactContext context) {
super(context);
@ -85,7 +84,9 @@ public class CameraView extends FrameLayout implements SurfaceHolder.Callback {
public void showFrame() {
if (showFrame) {
barcodeFrame = new BarcodeFrame(getContext(), scannerOptions);
barcodeFrame = new BarcodeFrame(getContext());
barcodeFrame.setFrameColor(frameColor);
barcodeFrame.setLaserColor(laserColor);
addView(barcodeFrame);
requestLayout();
}
@ -115,17 +116,26 @@ public class CameraView extends FrameLayout implements SurfaceHolder.Callback {
return frameRect;
}
public void setFrameColor(@ColorInt int color) {
this.frameColor = color;
if (barcodeFrame != null) {
barcodeFrame.setFrameColor(color);
}
}
public void setLaserColor(@ColorInt int color) {
this.laserColor = color;
if (barcodeFrame != null) {
barcodeFrame.setLaserColor(laserColor);
}
}
/**
* Set background color for Surface view on the period, while camera is not loaded yet.
* Provides opportunity for user to hide period while camera is loading
*
* @param color - color of the surfaceview
*/
public void setSurfaceBgColor(@ColorInt int color) {
surface.setBackgroundColor(color);
}
public void setScannerOptions(ReadableMap scannerOptions) {
this.scannerOptions = scannerOptions;
}
}

14
android/src/main/java/com/wix/RNCameraKit/camera/CameraViewManager.java
View File

@ -14,7 +14,6 @@ import android.view.OrientationEventListener;
import android.view.WindowManager;
import com.facebook.react.bridge.Arguments;
import com.facebook.react.bridge.ReadableMap;
import com.facebook.react.bridge.WritableMap;
import com.facebook.react.common.MapBuilder;
import com.facebook.react.uimanager.SimpleViewManager;
@ -313,14 +312,19 @@ public class CameraViewManager extends SimpleViewManager<CameraView> {
}
}
@ReactProp(name = "showFrame")
@ReactProp(name = "showFrame", defaultBoolean = false)
public void setFrame(CameraView view, boolean show) {
view.setShowFrame(show);
}
@ReactProp(name = "scannerOptions")
public void setScannerOptions(CameraView view, ReadableMap options) {
view.setScannerOptions(options);
@ReactProp(name = "frameColor", defaultInt = Color.GREEN)
public void setFrameColor(CameraView view, @ColorInt int color) {
view.setFrameColor(color);
}
@ReactProp(name = "laserColor", defaultInt = Color.RED)
public void setLaserColor(CameraView view, @ColorInt int color) {
view.setLaserColor(color);
}
@ReactProp(name = "surfaceColor")

41
android/src/main/java/com/wix/RNCameraKit/camera/barcode/BarcodeFrame.java
View File

@ -2,21 +2,21 @@ package com.wix.RNCameraKit.camera.barcode;
import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.PorterDuff;
import android.graphics.PorterDuffXfermode;
import android.graphics.Rect;
import android.support.annotation.ColorInt;
import android.view.View;
import com.facebook.react.bridge.ReadableMap;
import com.wix.RNCameraKit.R;
import com.wix.RNCameraKit.Utils;
public class BarcodeFrame extends View {
private static final int STROKE_WIDTH = 5;
private static final int ANIMATION_SPEED = 8;
private static final int WIDTH_SCALE = 7;
private static final double HEIGHT_SCALE = 2.75;
private Paint dimPaint;
private Paint framePaint;
@ -30,17 +30,17 @@ public class BarcodeFrame extends View {
private long previousFrameTime = System.currentTimeMillis();
private int laserY;
public BarcodeFrame(Context context, ReadableMap options) {
public BarcodeFrame(Context context) {
super(context);
init(options);
init(context);
}
private void init(ReadableMap options) {
private void init(Context context) {
framePaint = new Paint();
framePaint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.CLEAR));
dimPaint = new Paint();
dimPaint.setStyle(Paint.Style.FILL);
dimPaint.setColor(getContext().getResources().getColor(R.color.bg_dark));
dimPaint.setColor(context.getResources().getColor(R.color.bg_dark));
borderPaint = new Paint();
borderPaint.setStyle(Paint.Style.STROKE);
borderPaint.setStrokeWidth(STROKE_WIDTH);
@ -49,18 +49,7 @@ public class BarcodeFrame extends View {
laserPaint.setStrokeWidth(STROKE_WIDTH);
frameRect = new Rect();
borderMargin = getContext().getResources().getDimensionPixelSize(R.dimen.border_length);
parseOptions(options);
}
private void parseOptions(ReadableMap options) {
frameRect.left = Utils.convertDpToPx(Utils.getIntSafe(options, "frameLeft", 0), getContext());
frameRect.top = Utils.convertDpToPx(Utils.getIntSafe(options, "frameTop", 0), getContext());
frameRect.right = frameRect.left + Utils.convertDpToPx(Utils.getIntSafe(options, "frameWidth", 0), getContext());
frameRect.bottom = frameRect.top + Utils.convertDpToPx(Utils.getIntSafe(options, "frameHeight", 0), getContext());
borderPaint.setColor(Utils.getIntSafe(options, "frameColor", Color.GREEN));
laserPaint.setColor(Utils.getIntSafe(options, "laserColor", Color.RED));
dimPaint.setColor(Utils.getIntSafe(options, "overlayColor", getContext().getResources().getColor(R.color.bg_dark)));
borderMargin = context.getResources().getDimensionPixelSize(R.dimen.border_length);
}
@Override
@ -69,6 +58,13 @@ public class BarcodeFrame extends View {
width = getMeasuredWidth();
height = getMeasuredHeight();
int marginWidth = width / WIDTH_SCALE;
int marginHeight = (int) (height / HEIGHT_SCALE);
frameRect.left = marginWidth;
frameRect.right = width - marginWidth;
frameRect.top = marginHeight;
frameRect.bottom = height - marginHeight;
}
@Override
@ -104,4 +100,11 @@ public class BarcodeFrame extends View {
return frameRect;
}
public void setFrameColor(@ColorInt int borderColor) {
borderPaint.setColor(borderColor);
}
public void setLaserColor(@ColorInt int laserColor) {
laserPaint.setColor(laserColor);
}
}

12
example-ios/CameraKit/Base.lproj/LaunchScreen.xib
View File

@ -1,13 +1,9 @@
<?xml version="1.0" encoding="UTF-8"?>
<document type="com.apple.InterfaceBuilder3.CocoaTouch.XIB" version="3.0" toolsVersion="13771" targetRuntime="iOS.CocoaTouch" propertyAccessControl="none" useAutolayout="YES" launchScreen="YES" useTraitCollections="YES" colorMatched="YES">
<device id="retina4_7" orientation="portrait">
<adaptation id="fullscreen"/>
</device>
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<document type="com.apple.InterfaceBuilder3.CocoaTouch.XIB" version="3.0" toolsVersion="7702" systemVersion="14D136" targetRuntime="iOS.CocoaTouch" propertyAccessControl="none" useAutolayout="YES" launchScreen="YES" useTraitCollections="YES">
<dependencies>
<deployment identifier="iOS"/>
<plugIn identifier="com.apple.InterfaceBuilder.IBCocoaTouchPlugin" version="13772"/>
<plugIn identifier="com.apple.InterfaceBuilder.IBCocoaTouchPlugin" version="7701"/>
<capability name="Constraints with non-1.0 multipliers" minToolsVersion="5.1"/>
<capability name="documents saved in the Xcode 8 format" minToolsVersion="8.0"/>
</dependencies>
<objects>
<placeholder placeholderIdentifier="IBFilesOwner" id="-1" userLabel="File's Owner"/>
@ -29,7 +25,7 @@
<nil key="highlightedColor"/>
</label>
</subviews>
<color key="backgroundColor" red="1" green="1" blue="1" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
<color key="backgroundColor" white="1" alpha="1" colorSpace="custom" customColorSpace="calibratedWhite"/>
<constraints>
<constraint firstItem="kId-c2-rCX" firstAttribute="centerY" secondItem="iN0-l3-epB" secondAttribute="bottom" multiplier="1/3" constant="1" id="5cJ-9S-tgC"/>
<constraint firstAttribute="centerX" secondItem="kId-c2-rCX" secondAttribute="centerX" id="Koa-jz-hwk"/>

15
example-js-code/src/BarcodeScreen.js
View File

@ -1,16 +1,10 @@
import React, { Component } from 'react';
import {
Alert,
Dimensions
Alert
} from 'react-native';
import { CameraKitCameraScreen } from '../../src';
import CheckingScreen from './CheckingScreen';
const { width, height } = Dimensions.get('window');
const frameleft = parseInt(width / 7);
const frameTop = parseInt(height / 2.75);
const frameWidth = width - 2 * frameleft;
const frameHeight = height - 2 * frameTop;
export default class CameraScreen extends Component {
@ -54,12 +48,9 @@ export default class CameraScreen extends Component {
frameColor={"yellow"}
onReadCode={((event) => this.setState({ example: CheckingScreen }))}
hideControls={true}
// offsetForScannerFrame = {10}
// heightForScannerFrame = {300}
colorForScannerFrame={'blue'}
frameHeight={frameHeight}
frameWidth={frameWidth}
frameLeft={frameleft}
frameTop={frameTop}
overlayColor={'rgba(255, 0, 0, 0.5)'}
/>
);
}

133
ios/lib/ReactNativeCameraKit/CKCamera.m
View File

@ -21,24 +21,9 @@
#import "CKCameraOverlayView.h"
#import "CKGalleryManager.h"
static void * CapturingStillImageContext = &CapturingStillImageContext;
static void * SessionRunningContext = &SessionRunningContext;
#pragma mark - String Constants For Scanner
const NSString *sFrameHeight = @"frameHeight";
const NSString *sFrameWidth = @"frameWidth";
const NSString *sFrameLeft = @"frameLeft";
const NSString *sFrameTop = @"frameTop";
const NSString *overlayColor = @"overlayColor";
const NSString *colorForFrame = @"colorForFrame";
const NSString *surfaceColor = @"surfaceColor";
const NSString *laserColor = @"laserColor";
const CGFloat scannerHeight = 2;
const CGFloat defaultAlpha = 0.6;
typedef NS_ENUM( NSInteger, CKSetupResult ) {
CKSetupResultSuccess,
CKSetupResultCameraNotAuthorized,
@ -110,21 +95,12 @@ RCT_ENUM_CONVERTER(CKCameraZoomMode, (@{
// frame for Scanner
@property (nonatomic, strong) NSDictionary *scannerOptions;
@property (nonatomic) BOOL showFrame;
@property (nonatomic) UIView *laserView;
@property (nonatomic) UIColor *laserViewColor;
@property (nonatomic) UIView *greenScanner;
@property (nonatomic) CGFloat frameWidth;
@property (nonatomic) CGFloat frameHeight;
@property (nonatomic) CGFloat frameLeft;
@property (nonatomic) CGFloat frameTop;
@property (nonatomic) UIColor *frameColor;
@property (nonatomic) UIView *overlayView;
@property (nonatomic) UIColor *overlayColor;
@property (nonatomic) UIView *dataReadingFrame;
@property (nonatomic) UIView *perfomanceBackground;
@property (nonatomic) UIColor *surfaceColor;
@property (nonatomic) CGFloat frameOffset;
@property (nonatomic) CGFloat heightFrame;
@property (nonatomic, strong) UIColor *frameColor;
@property (nonatomic) UIView * dataReadingFrame;
// cameraOptions props
@property (nonatomic) AVCaptureFlashMode flashMode;
@ -855,57 +831,33 @@ RCT_ENUM_CONVERTER(CKCameraZoomMode, (@{
}
}
- (void)addSplashScreen {
if (self.showFrame) {
dispatch_async(dispatch_get_main_queue(), ^{
self.perfomanceBackground = [[UIView alloc]initWithFrame:self.bounds];
self.perfomanceBackground.backgroundColor = self.surfaceColor;
[self addSubview:self.perfomanceBackground];
[self bringSubviewToFront:self.perfomanceBackground];
});
}
}
- (void)setScannerOptions:(NSDictionary *)scannerOptions {
if (scannerOptions[sFrameWidth]) {
self.frameWidth = [scannerOptions[sFrameWidth] floatValue];
if (scannerOptions[offsetForScannerFrame]) {
self.frameOffset = [scannerOptions[offsetForScannerFrame] floatValue];
}
if (scannerOptions[sFrameHeight]) {
self.frameHeight = [scannerOptions[sFrameHeight] floatValue];
}
if (scannerOptions[sFrameLeft]) {
self.frameLeft = [scannerOptions[sFrameLeft] floatValue];
}
if (scannerOptions[sFrameTop]) {
self.frameTop = [scannerOptions[sFrameTop] floatValue];
if (scannerOptions[heightForScannerFrame]) {
self.heightFrame = [scannerOptions[heightForScannerFrame] floatValue];
}
if (scannerOptions[colorForFrame]) {
UIColor *acolor = [RCTConvert UIColor:scannerOptions[colorForFrame]];
self.frameColor = (acolor) ? acolor : [UIColor whiteColor];
}
if (scannerOptions[surfaceColor]) {
UIColor *acolor = [RCTConvert UIColor:scannerOptions[surfaceColor]];
self.surfaceColor = (acolor) ? acolor : [UIColor blackColor];
}
if (scannerOptions[overlayColor]) {
UIColor *acolor = [RCTConvert UIColor:scannerOptions[overlayColor]];
self.overlayColor = (acolor) ? acolor : [UIColor blackColor];
}
if (scannerOptions[laserColor]) {
UIColor *acolor = [RCTConvert UIColor:scannerOptions[laserColor]];
self.laserViewColor = (acolor) ? acolor : [UIColor whiteColor];
}
}
- (void)addFrameForScanner {
CGFloat frameWidth = self.bounds.size.width - 2 * self.frameOffset;
if (!self.dataReadingFrame) {
self.dataReadingFrame = [[UIView alloc] initWithFrame:CGRectMake(self.frameLeft, self.frameTop, self.frameWidth, self.frameHeight)];
self.dataReadingFrame = [[UIView alloc] initWithFrame:CGRectMake(0, 0, frameWidth, self.heightFrame)]; //
self.dataReadingFrame.center = self.center;
self.dataReadingFrame.backgroundColor = [UIColor clearColor];
[self createCustomFramesForView:self.dataReadingFrame];
[self addSubview:self.dataReadingFrame];
[self startAnimatingScanner:self.dataReadingFrame];
[self addVisualEffects:self.dataReadingFrame.frame];
CGRect visibleRect = [self.previewLayer metadataOutputRectOfInterestForRect:self.dataReadingFrame.frame];
self.metadataOutput.rectOfInterest = visibleRect;
}
@ -955,40 +907,42 @@ RCT_ENUM_CONVERTER(CKCameraZoomMode, (@{
}
- (void)addVisualEffects:(CGRect)inputRect {
self.overlayView = [[UIView alloc] initWithFrame:self.bounds];
self.overlayView.alpha = defaultAlpha;
self.overlayView.autoresizingMask = UIViewAutoresizingFlexibleHeight;
[self addSubview:self.overlayView];
UIView *topView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, self.frame.size.width, inputRect.origin.y)];
topView.backgroundColor = [UIColor colorWithRed:0.0/255.0 green:0.0/255.0 blue:0.0/255.0 alpha:0.4];
[self addSubview:topView];
UIView *leftSideView = [[UIView alloc] initWithFrame:CGRectMake(0, inputRect.origin.y, self.frameOffset, self.heightFrame)]; //paddingForScanner scannerHeight
leftSideView.backgroundColor = [UIColor colorWithRed:0.0/255.0 green:0.0/255.0 blue:0.0/255.0 alpha:0.4];
[self addSubview:leftSideView];
UIView *rightSideView = [[UIView alloc] initWithFrame:CGRectMake(inputRect.size.width + self.frameOffset, inputRect.origin.y, self.frameOffset, self.heightFrame)];
rightSideView.backgroundColor = [UIColor colorWithRed:0.0/255.0 green:0.0/255.0 blue:0.0/255.0 alpha:0.4];
[self addSubview:rightSideView];
UIView *bottomView = [[UIView alloc] initWithFrame:CGRectMake(0, inputRect.origin.y + self.heightFrame, self.frame.size.width,
self.frame.size.height - inputRect.origin.y - self.heightFrame)];
bottomView.backgroundColor = [UIColor colorWithRed:0.0/255.0 green:0.0/255.0 blue:0.0/255.0 alpha:0.4];
[self addSubview:bottomView];
UIBezierPath *overlayPath = [UIBezierPath bezierPathWithRect:self.overlayView.bounds];
UIBezierPath *transparentPath = [UIBezierPath bezierPathWithRect:self.dataReadingFrame.frame];
[overlayPath appendPath:transparentPath];
[overlayPath setUsesEvenOddFillRule:YES];
CAShapeLayer *fillLayer = [CAShapeLayer layer];
fillLayer.path = overlayPath.CGPath;
fillLayer.fillRule = kCAFillRuleEvenOdd;
fillLayer.fillColor = self.overlayColor.CGColor;
[self.overlayView.layer addSublayer:fillLayer];
}
- (void)startAnimatingScanner:(UIView *)inputView {
if (!self.laserView) {
self.laserView = [[UIView alloc] initWithFrame:CGRectMake(scannerHeight, 0, inputView.frame.size.width - (2*scannerHeight), scannerHeight)];
self.laserView.backgroundColor = self.laserViewColor;
if (!self.greenScanner) {
self.greenScanner = [[UIView alloc] initWithFrame:CGRectMake(2, 0, inputView.frame.size.width - 4, 2)];
self.greenScanner.backgroundColor = [UIColor whiteColor];
}
if (self.laserView.frame.origin.y != 0) {
[self.laserView setFrame:CGRectMake(scannerHeight, 0, inputView.frame.size.width - (2*scannerHeight), scannerHeight)];
if (self.greenScanner.frame.origin.y != 0) {
[self.greenScanner setFrame:CGRectMake(2, 0, inputView.frame.size.width - 4, 2)];
}
[self checkPerfomancebackground];
[inputView addSubview:self.laserView];
[inputView addSubview:self.greenScanner];
[UIView animateWithDuration:3 delay:0 options:(UIViewAnimationOptionAutoreverse | UIViewAnimationOptionRepeat) animations:^{
CGFloat middleX = inputView.frame.size.width / scannerHeight;
self.laserView.center = CGPointMake(middleX, inputView.frame.size.height - (scannerHeight/2));
CGFloat middleX = inputView.frame.size.width / 2;
self.greenScanner.center = CGPointMake(middleX, inputView.frame.size.height - 1);
} completion:^(BOOL finished) {}];
}
- (void)stopAnimatingScanner {
[self.laserView removeFromSuperview];
[self.greenScanner removeFromSuperview];
}
//Observer actions
@ -1156,7 +1110,12 @@ didOutputMetadataObjects:(NSArray<__kindof AVMetadataObject *> *)metadataObjects
return result;
}
#pragma mark - String Constants For Scanner
const NSString *offsetForScannerFrame = @"offsetFrame";
const NSString *heightForScannerFrame = @"frameHeight";
const NSString *colorForFrame = @"colorForFrame";
const NSString *isNeedMultipleScanBarcode = @"isNeedMultipleScanBarcode";

78
src/CameraScreen/CameraKitCameraScreenBase.js
View File

@ -9,13 +9,11 @@ import {
NativeModules,
Platform,
SafeAreaView,
processColor
processColor
} from 'react-native';
import _ from 'lodash';
import CameraKitCamera from './../CameraKitCamera';
const Container = SafeAreaView && View;
const IsIOS = Platform.OS === 'ios';
const GalleryManager = IsIOS ? NativeModules.CKGalleryManager : NativeModules.NativeGalleryModule;
@ -23,8 +21,8 @@ const FLASH_MODE_AUTO = 'auto';
const FLASH_MODE_ON = 'on';
const FLASH_MODE_OFF = 'off';
const OVERLAY_DEFAULT_COLOR = '#ffffff77';
const FRAME_LEFT = 0;
const FRAME_TOP = 0;
const OFFSET_FRAME = 30;
const FRAME_HEIGHT = 200;
export default class CameraScreenBase extends Component {
@ -43,14 +41,14 @@ export default class CameraScreenBase extends Component {
mode: FLASH_MODE_AUTO,
image: _.get(this.props, 'flashImages.auto')
},
{
mode: FLASH_MODE_ON,
image: _.get(this.props, 'flashImages.on')
},
{
mode: FLASH_MODE_OFF,
image: _.get(this.props, 'flashImages.off')
}
{
mode: FLASH_MODE_ON,
image: _.get(this.props, 'flashImages.on')
},
{
mode: FLASH_MODE_OFF,
image: _.get(this.props, 'flashImages.off')
}
];
this.state = {
captureImages: [],
@ -60,7 +58,7 @@ export default class CameraScreenBase extends Component {
ratioArrayPosition: -1,
imageCaptured: undefined,
captured: false,
scannerOptions: {}
scannerOptions : {}
};
this.onSetFlash = this.onSetFlash.bind(this);
this.onSwitchCameraPressed = this.onSwitchCameraPressed.bind(this);
@ -105,45 +103,13 @@ export default class CameraScreenBase extends Component {
getScannerOptions() {
const scannerOptions = this.props.scannerOptions || {};
if (this.props.showFrame == true) {
if (this.props.frameHeight) {
scannerOptions.frameHeight = this.props.frameHeight
} else {
console.warn("frameHeight is required property, if you want to use scannerFrame set frameHeight value")
}
if (this.props.frameWidth) {
scannerOptions.frameWidth = this.props.frameWidth
} else {
console.warn("frameWidth is required property, if you want to use scannerFrame set frameWidth value")
}
}
scannerOptions.frameLeft = this.props.frameLeft || FRAME_LEFT
scannerOptions.frameTop = this.props.frameTop || FRAME_TOP
if (this.props.overlayColor) {
scannerOptions.overlayColor = processColor(this.props.overlayColor)
} else {
scannerOptions.overlayColor = processColor('rgba(0, 0, 0, 0.5)')
}
if (this.props.laserColor) {
scannerOptions.laserColor = processColor(this.props.laserColor)
} else {
scannerOptions.laserColor = processColor('white')
}
if (this.props.frameColor) {
scannerOptions.colorForFrame = processColor(this.props.frameColor);
scannerOptions.offsetFrame = this.props.offsetForScannerFrame || OFFSET_FRAME;
scannerOptions.frameHeight = this.props.heightForScannerFrame || FRAME_HEIGHT;
if (this.props.colorForScannerFrame) {
scannerOptions.colorForFrame = processColor(this.props.colorForScannerFrame);
} else {
scannerOptions.colorForFrame = processColor("white");
}
if (this.props.surfaceColor) {
scannerOptions.surfaceColor = processColor(this.props.surfaceColor)
} else {
scannerOptions.surfaceColor = processColor("black")
}
return scannerOptions;
}
@ -171,10 +137,10 @@ export default class CameraScreenBase extends Component {
renderTopButtons() {
return !this.props.hideControls && (
<Container style={styles.topButtons}>
{this.renderFlashButton()}
{this.renderSwitchCameraButton()}
</Container>
<SafeAreaView style={styles.topButtons}>
{this.renderFlashButton()}
{this.renderSwitchCameraButton()}
</SafeAreaView>
);
}
@ -304,11 +270,11 @@ export default class CameraScreenBase extends Component {
renderBottomButtons() {
return !this.props.hideControls && (
<Container style={[styles.bottomButtons, { backgroundColor: '#ffffff00' }]}>
<SafeAreaView style={[styles.bottomButtons, { backgroundColor: '#ffffff00' }]}>
{this.renderBottomButton('left')}
{this.renderCaptureButton()}
{this.renderBottomButton('right')}
</Container>
</SafeAreaView>
);
}