advanced-react-native-qrcode-mask/lib/module/Overlay.js

React Native QR Code Mask Library

/**
 * Created by nghinv on Thu Jul 15 2021
 * Copyright (c) 2021 nghinv@lumi.biz
 */
import React, { useMemo, useEffect } from 'react';
import { Animated, View, StyleSheet } from 'react-native';

function Overlay(props) {
  const {
    overlayOpacity = 0.6,
    children,
    overlayColor = 'black'
  } = props;
  const opacity = useMemo(() => new Animated.Value(0), []);
  useEffect(() => {
    Animated.timing(opacity, {
      toValue: overlayOpacity,
      duration: 350,
      useNativeDriver: true
    }).start();
  }, [opacity, overlayOpacity]);

  if (children) {
    return /*#__PURE__*/React.createElement(View, {
      style: styles.container
    }, /*#__PURE__*/React.createElement(Animated.View, {
      style: [styles.content, {
        opacity,
        backgroundColor: overlayColor
      }]
    }), children);
  }

  return /*#__PURE__*/React.createElement(Animated.View, {
    style: [styles.content2, {
      opacity,
      backgroundColor: overlayColor
    }]
  });
}

const styles = StyleSheet.create({
  container: {
    flex: 1
  },
  content: { ...StyleSheet.absoluteFillObject // backgroundColor: 'black',

  },
  content2: {
    flex: 1 // backgroundColor: 'black',

  }
});
export default /*#__PURE__*/React.memo(Overlay);
//# sourceMappingURL=Overlay.js.map