react-native-camera 对原生 android 的反应很慢

Posted 2023-03-11

【中文标题】react-native-camera 对原生 android 的反应很慢

【英文标题】：react-native-camera slow on react native android

【发布时间】：2017-10-10 10:39:24

【问题描述】：

我在我的 React Native 项目中使用 react-native-camera 库。

但是当我尝试拍照时遇到了问题。保存照片需要 3-4 秒。当我点击按钮拍照时，我听到声音，但大约需要 3-4 秒才能保存照片。

渲染方法如下：

return (
   <View style=styles.container>
       <Camera ref=(cam) => this.camera = cam;
               style=styles.preview
               aspect=Camera.constants.Aspect.fill>
                    this.imageOverlay()
                    <Text style=styles.capture onPress=this.takePicture.bind(this, this.state.type)>[CAPTURE]</Text>
       </Camera>
    </View>
)

而takePicture函数如下：

takePicture(type)
        let self = this;
        this.camera.capture(target: Camera.constants.CaptureTarget.disk)
            .then((data) => 

                <!---------------------------------------------------------->
                <!------------It takes 3-4 seconds to come here------------!>
                <!---------------------------------------------------------->

                let n_pictures = [];
                each(this.state.pictures, function (picture)
                   if(picture.item !== type.item)
                       n_pictures.push(picture)
                   else
                       n_pictures.push(
                           title: type.title,
                           noImage: false,
                           imageOverlay: type.imageOverlay,
                           image: data.path,
                           imageIcon: type.imageIcon,
                           overlay: false,
                           item: type.item,
                           mandatory: type.mandatory
                       )
                   
                );
                self.setState(pictures: n_pictures, showCamera: false)
            )
            .catch(err => console.error(err));
    

知道怎么解决吗？

我可以在照片保存之前至少放一个加载屏幕吗？

【问题讨论】：

您是否尝试过运行生产版本？开发模式比生产模式慢 2-8 倍。

@GuilhermeCronemberger 是的。同样的问题。

@GuilhermeCronemberger 那太好了。

您在应用中使用哪种类型的导航？

@GuilhermeCronemberger react-native-router-flux

【参考方案1】：

所以我遇到了同样的问题，在互联网上搜索了一段时间后，我找不到加快速度的答案。

但是，要回答有关使用加载屏幕的问题，您可能需要查看 javascript 承诺。对于我的应用程序，我立即将用户重定向到一个新屏幕，并在未解决/拒绝承诺时显示加载图片。解决后，图片就显示出来了。

我知道这是一个旧答案，但我会将其放在这里，以供可能遇到类似问题的其他人使用。

【讨论】：

亲爱的 Solariser，您能发布一些代码来说明您的观点吗？