如何在相机中添加边框? [英] How can I add a border frame in the camera?

问题描述

我需要在react native相机视图的取景器中间添加一个方框.存储库中也没有关于它的信息.问题也没有得到答案.

I need to add a square frame in the middle of the viewfinder of the react native camera view. There is not information about it in the repository also. And questions there is not being answered also.

推荐答案

您正在使用哪个模块? react-native-camera或react-native-camera-kit?

Which module you are using? react-native-camera or react-native-camera-kit?

如果使用react-native-camera，只需将View(或Image)放在Camera组件内，然后在该视图的垂直和水平方向上添加样式即可.

If you using react-native-camera just put View (or Image) inside Camera component, then add styles to vertically and horizontally align this view.

赞:

const styles = {
    container: {
        flex: 1,
    },

    camera: {
        flex: 1,
        // These below are most important, they center your border view in container
        // ref: https://css-tricks.com/snippets/css/a-guide-to-flexbox/
        alignItems: "center",
        justifyContent: "center"
    },

    borderImage: {
        // Your styles for image, or custom borders
    },
}


class Component extends React.Component {

   ...

    render(){
        return <View style={styles.container}>
           <Camera style={styles.camera}>
              <Image style={styles.borderImage} source={require("./img/qrBorder.png")} />
           </Camera>
        </View>;
     }
}

这篇关于如何在相机中添加边框?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！