title: Expo Video re-render on state change
body: <p>I have a video where all I want it a play button over the top.  I have achieved this with the following:</p>
  
  <pre><code>                &lt;View style={{ backgroundColor: 'yellow', justifyContent: 'center', alignItems: 'center'}}&gt;
                      &lt;Video
                          ref={setupVideo}
                          source={require('../../assets/AppSampleCoverVideo.mp4')} // TODO:
                          rate={1.0}
                          volume={1.0}
                          isMuted={false}
                          shouldPlay={isPlaying}
                          resizeMode='contain'
                          isLooping={false}
                          style={styles.setupVideo}
                          //onPlaybackStatusUpdate={onPlaybackStatusUpdate}
                          //useNativeControls={true}
                      /&gt;
  
                      &lt;TouchableOpacity style={styles.playButton} onPress={toggleVideoPlay}&gt;
                          {
                              !isPlaying ? (
                                  &lt;Ionicons style={styles.playIcon} color='white' size={ Dimensions.get('window').width / 5 } name='ios-play' /&gt;
                              ) : null
                          }
                      &lt;/TouchableOpacity&gt;
  
                  &lt;/View&gt;
  </code></pre>
  
  <p>I control the video with the following:</p>
  
  <pre><code>    const [isPlaying, setIsPlaying] = useState(false)
      const setupVideo = useRef(null);
  
      const toggleVideoPlay = async () =&gt; {
          try {
              let videoStatus = await setupVideo.current.getStatusAsync();
              if(videoStatus.isPlaying) {
                  return setupVideo.current.pauseAsync();
              } else {
                  if(videoStatus.durationMillis === videoStatus.positionMillis) return setupVideo.current.replayAsync();
                  return setupVideo.current.playAsync();
              }
          } catch(err) {
  
          }
      }
  </code></pre>
  
  <p>However, I want to be able to track when the video is playing and when it is not in order to set the isPlaying and control whether the play button icon is rendered or not.  Anything I have tried causes either the video to flicker when calling <code>setIsPlaying</code> or the video re-renders and doesn't play at all.</p>
  
  <p>Any help would be appreciated.</p>