如何在React Native中打开相机后自动开始录制视频？

Question

我正在使用react-native-vision-camera包来录制视频。

我想在相机打开时自动开始录制视频。当我按下停止按钮时停止录制，并在停止上一个视频后立即开始录制另一个视频。

这是我的代码。

import React from 'react'
import { useState, useEffect, useMemo } from 'react'
import { StyleSheet, View, TouchableOpacity, Text } from 'react-native'
import { Camera, sortDevices } from 'react-native-vision-camera'

const App = () => {
    const camera = React.useRef(null)
    const [devices, setDevices] = useState([])
    const device = useMemo(() => devices.find((d) => d.position === 'back'), [devices])
    const [permissons, setPermissons] = useState(false)

    useEffect(() => {
        loadDevices()
        getPermissons()
    }, [])

    const getPermissons = async () => {
        const cameraPermission = await Camera.getCameraPermissionStatus()
        const microphonePermission = await Camera.getMicrophonePermissionStatus()
        if (microphonePermission === 'authorized' && cameraPermission === 'authorized') {
            setPermissons(true)
        }
    }

    const loadDevices = async () => {
        try {
            const availableCameraDevices = await Camera.getAvailableCameraDevices()
            const sortedDevices = availableCameraDevices.sort(sortDevices)
            setDevices(sortedDevices)
        } catch (e) {
            console.error('Failed to get available devices!', e)
        }
    }

    async function StartRecodingHandler() {
        camera.current.startRecording({
            flash: 'off',
            onRecordingFinished: (video) => console.log(video, 'videodata'),
            onRecordingError: (error) => console.error(error, 'videoerror'),
        })
    }

    async function stopRecodingHandler() {
        await camera.current.stopRecording()
    }

    if (device == null) {
        return null
    }

    return (
        <View>
            <View style={{ height: 600 }}>
                <Camera
                    ref={camera}
                    style={StyleSheet.absoluteFill}
                    device={device}
                    isActive={true}
                    video={true}
                    audio={true}
                    setIsPressingButton={true}
                />
            </View>
            <View>
                <TouchableOpacity onPress={() => { stopRecodingHandler() }}>
                    <Text style={{ fontSize: 35 }}>STOP Recoding</Text>
                </TouchableOpacity>
            </View>
        </View>
    )
}
export default App

所以，请有人帮我解决这个问题。

Answer 1

您找到解决方案了吗？我怎样才能实现它？