React Native集成照相机功能示例

本示例演示了如何在React Native应用中集成照相机功能，实现拍照并展示照片的流程。使用React Native Camera库简化相机操作。

import React, { useState } from 'react';
import { View, TouchableOpacity, Image, Text } from 'react-native';
import { RNCamera } from 'react-native-camera';

const CameraExample = () => {
  const [photo, setPhoto] = useState(null);

  const takePicture = async (camera) => {
    const options = { quality: 0.5, base64: true };
    const data = await camera.takePictureAsync(options);
    setPhoto(data.uri);
  };

  return (
    <View style={{ flex: 1 }}>
      <RNCamera
        style={{ flex: 1 }}
        type={RNCamera.Constants.Type.back}
        captureAudio={false}
      >
        {({ camera, status }) => {
          if (status !== 'READY') return <View />;
          return (
            <View>
              <TouchableOpacity onPress={() => takePicture(camera)}>
                <Text>拍照</Text>
              </TouchableOpacity>
            </View>
          );
        }}
      </RNCamera>
      {photo && <Image source={{ uri: photo }} style={{ flex: 1 }} />}
    </View>
  );
};

export default CameraExample;

免责申明：文章和图片全部来源于公开网络，如有侵权，请通知删除 server@dude6.com