如何在React Native Expo中访问相机？

15 浏览
0 Comments

如何在React Native Expo中访问相机？

这是我在React Native Expo应用中实现访问相机的代码。但是这段代码不起作用，只显示空白屏幕，没有其他内容。如果需要任何更改或者实现此功能的其他方法，请给我建议。

0

3 答案

0 Comments

近期有用户在使用React Native Expo时遇到了访问相机的问题。用户尝试使用Camera.requestPermissionsAsync()方法来请求相机权限，但是发现该方法已经被弃用。用户在寻找解决方法时发现了Camera.requestCameraPermissionsAsync()方法，并且在更新代码后发现弃用提示消失了。

解决方法：

可以尝试使用Camera.requestCameraPermissionsAsync()方法来请求相机权限。这个方法可以取代之前被弃用的Camera.requestPermissionsAsync()方法，可以正常工作。

代码示例：

Camera.requestCameraPermissionsAsync();

希望以上方法可以帮助到遇到类似问题的用户。

0
0 Comments

在React Native Expo中访问摄像头的问题是由于以下原因引起的：在应用程序中拒绝了权限，并且如果代码中的hasPermission为null，则会显示一个空白页面。同时需要注意的是，在iOS平台上，如果您在应用程序中拒绝或授予权限一次，那么在您使用链接并允许用户从设置中启用权限之前，应用程序将不会再次显示权限弹窗。

为了解决这个问题，您可以按照以下步骤操作：

1. 在Expo项目中，确保您已经正确安装了Camera模块。

import { Camera } from 'expo-camera';

2. 确保您的应用程序在Android和iOS上都具有相机权限。您可以通过在应用程序的配置文件中添加以下权限来实现：

Android：

iOS：

NSCameraUsageDescription
Your message to user when the camera is accessed for the first time
NSMicrophoneUsageDescription
Your message to user when the microphone is accessed for the first time

3. 在您的React Native组件中，添加以下代码以检查并请求相机权限：

const [hasPermission, setHasPermission] = useState(null);
useEffect(() => {
  (async () => {
    const { status } = await Camera.requestPermissionsAsync();
    setHasPermission(status === 'granted');
  })();
}, []);

4. 确保您在组件渲染时处理hasPermission为null的情况，以避免显示空白页面。

if (hasPermission === null) {
  return ;
} else if (hasPermission === false) {
  return No access to camera;
} else {
  return (
    
      
    
  );
}

通过按照上述步骤，您就可以在React Native Expo中访问摄像头了。请注意，在iOS平台上，如果您在首次访问时拒绝了权限，您需要在设置中启用应用程序的摄像头权限。

0
0 Comments

问题的原因是在<SafeAreaView>中使用了<YOUR_CAMERA_COMPONENT>，导致相机组件无法正常显示。解决方法是将<Camera />从<SafeAreaView />中移除。

以下是解决方法的代码示例：

<YOUR_CAMERA_COMPONENT /> /* <-- 在<SafeAreaView>之外，它正常工作！*/
<SafeAreaView>
    /* <-- 这里将显示空白视图 */
</SafeAreaView>

当将<Camera />从<SafeAreaView />中移除后，问题得到解决。

0