论坛 › 知识问答 › android - Expo Camera recordAsync promise 未解决

菜鸟教程小白 发表于 2022-12-13 04:45:10

android - Expo Camera recordAsync promise 未解决

                                            <p><p>我开始使用 expo/react native 开发移动应用程序，但在处理相机对象时遇到了一些问题:</p>

<p>我有一个相机对象，我在 componentDidMount 开始录制 (recordAsync)，然后在 componentWillUnmount 停止它 (stopRecording)。然而，promise 永远不会被解决(then，catch no finally 都没有被调用)</p>

<p>我做错了吗？
这是代码:</p>

<pre><code>import { Camera, Permissions } from &#39;expo&#39;;

import React from &#39;react&#39;;


export default class CameraReaction extends React.Component {
constructor(props){
    super(props)
    this.takeFilm = this.takeFilm.bind(this)      
    this.isFilming=false
    this.cameraScreenContent = this.renderCamera()
}

componentDidMount(){
    if (this.props.shouldrecording &amp;&amp; !this.isFilming ){
      this.takeFilm()
    }
}
componentWillUnmount(){
    this.camera.stopRecording()
}

saveMediaFile = async video =&gt; {
    console.log(&#34;=======saveMediaFile=======&#34;);
}

renderCamera = () =&gt; {
    let self = this
    return (
      &lt;View style={{ flex: 1 }}&gt;
      &lt;Camera
          ref={ref =&gt; {self.camera=ref}}
          style={styles.camera}
          type=&#39;front&#39;
          whiteBalance=&#39;off&#39;
          ratio=&#39;4:3&#39;
          autoFocus=&#39;off&#39;
          &gt;
      &lt;/Camera&gt;
      &lt;/View&gt;
    );
}

takeFilm(){
    let self = this
    try{
      self.camera.recordAsync()
      .then(data =&gt; {
      self.saveMediaFile(data),
      self.isFilming=false
      })
      .catch(error =&gt; {console.log(error)})
      this.isFilming = true
    }
    catch(e){      
      this.isFilming = false      
    }            
};

render() {   
    return &lt;View style={styles.container}&gt;{this.cameraScreenContent}&lt;/View&gt;;
}

}
</code></pre>

<p>有人知道我做错了什么吗？</p>

<p>提前致谢</p></p>
                                    <br><hr><h1><strong>Best Answer-推荐答案</ strong></h1><br>
                                            <p><p>我终于意识到，我们不能在渲染组件时直接开始录制。 “直接”是指用户无需采取任何进一步行动。如果我分两步进行(例如等待用户单击某处)，则效果很好。但我在文档中没有看到任何对这种行为/限制的引用。</p>

<p>下面的工作代码:</p>

<pre><code>import React from &#39;react&#39;;
import { StyleSheet, Text, View , TouchableOpacity} from &#39;react-native&#39;;
import { Camera, Permissions} from &#39;expo&#39;;

export default class App extends React.Component {
constructor(props){
    super(props)   
    this.camera=undefined
    this.state = {permissionsGranted:false,bcolor:&#39;red&#39;}
    this.takeFilm = this.takeFilm.bind(this)
}

async componentWillMount() {   
    let cameraResponse = await Permissions.askAsync(Permissions.CAMERA)
    if (cameraResponse.status == &#39;granted&#39;){
      let audioResponse = await Permissions.askAsync(Permissions.AUDIO_RECORDING);
      if (audioResponse.status == &#39;granted&#39;){
      this.setState({ permissionsGranted: true });
      }
    }                  
}

takeFilm(){   
    let self = this;
    if (this.camera){
      this.camera.recordAsync().then(data =&gt; self.setState({bcolor:&#39;green&#39;}))
    }   
}

render() {   
    if (!this.state.permissionsGranted){
      return &lt;View&gt;&lt;Text&gt;Camera permissions not granted&lt;/Text&gt;&lt;/View&gt;
    } else {
      return (
      &lt;View style={{flex: 1}}&gt;
          &lt;View style={{ flex: 1 }}&gt;
            &lt;Camera ref={ref =&gt; this.camera = ref} style={{flex: 0.3}} &gt;&lt;/Camera&gt;
          &lt;/View&gt;
          &lt;TouchableOpacity style={{backgroundColor:this.state.bcolor, flex:0.3}} onPress={() =&gt; {

            if(this.state.cameraIsRecording){
            this.setState({cameraIsRecording:false})
            this.camera.stopRecording();
            }
            else{
            this.setState({cameraIsRecording:true})
            this.takeFilm();
            }
          }} /&gt;
      &lt;/View&gt;)
    }
}
}
</code></pre></p>
                                   
                                                <p style="font-size: 20px;">关于android - Expo Camera recordAsyncpromise 未解决，我们在Stack Overflow上找到一个类似的问题：
                                                        <a href="https://stackoverflow.com/questions/52706203/" rel="noreferrer noopener nofollow" style="color: red;">
                                                                https://stackoverflow.com/questions/52706203/
                                                        </a>
                                                </p>
                                       

查看完整版本: android - Expo Camera recordAsync promise 未解决