どのように反応ネイティブのボタンでスクリーンショットを撮ることができますか？

Question

ボタンで現在の画面のスクリーンショットを撮ることのできるシンプルなアプリケーションを開発したいと考えています。このコードは正常に実行されますが、キャプチャボタンを押すとエラーが返されます。

export default class App extends Component<{}> { 
 
    render() { 
 
    captureScreen({ 
 
     format: "jpg", 
 
     quality: 0.8 
 
    }) 
 
    .then(
 
     uri => console.log("Image saved to", uri), 
 
     error => console.error("Oops, snapshot failed", error) 
 
    ); 
 
    
 
    return (
 
     <View style={styles.container}> 
 
     <Text style={styles.welcome}> 
 
      Welcome to React Native SnapShot! 
 
     </Text> 
 
     <Text style={styles.instructions}> 
 
      To get started, edit App.js 
 
     </Text> 
 
     <Text style={styles.instructions}> 
 
      {instructions} 
 
     </Text> 
 
     <Button 
 
      onPress={captureScreen.bind(this)} 
 
      title="capture" 
 
      color="#841584" 
 
      accessibilityLabel="Capture" 
 
     /> 
 
     </View> 
 
    ); 
 
    } 
 
}

Answer 1

なぜあなたは、レンダリングでスクリーンショットをキャプチャしていますか？私はあなたのスクリーンショットスニペットを別の機能に移動する必要があると思います。

export default class App extends Component<{}> { 
    render() { 
    return (
     <View style={styles.container}> 
     <Text style={styles.welcome}> 
      Welcome to React Native SnapShot! 
     </Text> 
     <Text style={styles.instructions}> 
      To get started, edit App.js 
     </Text> 
     <Text style={styles.instructions}> 
      {instructions} 
     </Text> 
     <Button 
      onPress={() => { 
      captureScreen({ 
       format: "jpg", 
       quality: 0.8 
      }) 
      .then(
       uri => console.log("Image saved to", uri), 
       error => console.error("Oops, snapshot failed", error) 
      ); 
      }} 
      title="capture" 
      color="#841584" 
      accessibilityLabel="Capture" 
     /> 
     </View> 
    ); 
    } 
}