From b77df1d651c39d88acefe7941948c24aaf4af1b3 Mon Sep 17 00:00:00 2001 From: Jens Andersson Date: Thu, 11 Jun 2020 16:44:13 +0200 Subject: [PATCH] Removed JS fullscreening for Android (#2013) --- CHANGELOG.md | 1 + README.md | 4 +- Video.js | 50 +--------------- .../exoplayer/ReactExoplayerView.java | 55 +----------------- .../main/res/drawable/fullscreen_expand.png | Bin 365 -> 0 bytes .../main/res/drawable/fullscreen_shrink.png | Bin 358 -> 0 bytes .../res/layout/exo_player_control_view.xml | 16 ----- 7 files changed, 5 insertions(+), 121 deletions(-) delete mode 100644 android-exoplayer/src/main/res/drawable/fullscreen_expand.png delete mode 100644 android-exoplayer/src/main/res/drawable/fullscreen_shrink.png diff --git a/CHANGELOG.md b/CHANGELOG.md index 880b695c4f..832cae61e7 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -9,6 +9,7 @@ - Added `preferredForwardBufferDuration` (iOS) - the duration the player should buffer media from the network ahead of the playhead to guard against playback disruption. (#1944) - Added `currentPlaybackTime` (Android ExoPlayer, iOS) - when playing an HLS live stream with a `EXT-X-PROGRAM-DATE-TIME` tag configured, then this property will contain the epoch value in msec. (#1944) - Added `trackId` (Android ExoPlayer) - Configure an identifier for the video stream to link the playback context to the events emitted. (#1944) +- Reverted the JS fullscreening for Android. [#2013](https://github.com/react-native-community/react-native-video/pull/2013) ### Version 5.1.0-alpha5 diff --git a/README.md b/README.md index 9da556ebdb..c80433778e 100644 --- a/README.md +++ b/README.md @@ -455,7 +455,7 @@ Controls whether the player enters fullscreen on play. * **false (default)** - Don't display the video in fullscreen * **true** - Display the video in fullscreen -Platforms: iOS, Android Exoplayer +Platforms: iOS #### fullscreenAutorotate If a preferred [fullscreenOrientation](#fullscreenorientation) is set, causes the video to rotate to that orientation but permits rotation of the screen to orientation held by user. Defaults to TRUE. @@ -468,8 +468,6 @@ Platforms: iOS * **landscape** * **portrait** -Note on Android ExoPlayer, the full-screen mode by default goes into landscape mode. Exiting from the full-screen mode will display the video in Initial orientation. - Platforms: iOS #### headers diff --git a/Video.js b/Video.js index 65bc68dad6..dd9290adc3 100644 --- a/Video.js +++ b/Video.js @@ -1,6 +1,6 @@ import React, { Component } from 'react'; import PropTypes from 'prop-types'; -import { StyleSheet, requireNativeComponent, NativeModules, View, ViewPropTypes, Image, Platform, UIManager, findNodeHandle, Dimensions } from 'react-native'; +import { StyleSheet, requireNativeComponent, NativeModules, View, ViewPropTypes, Image, Platform, findNodeHandle } from 'react-native'; import resolveAssetSource from 'react-native/Libraries/Image/resolveAssetSource'; import TextTrackType from './TextTrackType'; import FilterType from './FilterType'; @@ -21,34 +21,7 @@ export default class Video extends Component { this.state = { showPoster: !!props.poster, - androidFullScreen: false, - videoContainerLayout_x: 0, - videoContainerLayout_y: 0, }; - this.getDimension(); - } - - /** - * @description this is will set the width and height needs to be considered for full screen - */ - getDimension() { - if (Dimensions.get('window').width < Dimensions.get('window').height) { - this.width = Math.round(Dimensions.get('window').height); - this.height = Math.round(Dimensions.get('window').width); - } - else { - this.width = Math.round(Dimensions.get('window').width); - this.height = Math.round(Dimensions.get('window').height); - } - } - - componentDidMount() { - UIManager.measure(findNodeHandle(this._videoContainer), (x, y) => { - this.setState({ - videoContainerLayout_x: x, - videoContainerLayout_y: y, - }); - }); } setNativeProps(nativeProps) { @@ -172,7 +145,6 @@ export default class Video extends Component { }; _onFullscreenPlayerWillPresent = (event) => { - Platform.OS === 'android' && this.setState({ androidFullScreen: true }); if (this.props.onFullscreenPlayerWillPresent) { this.props.onFullscreenPlayerWillPresent(event.nativeEvent); } @@ -185,7 +157,6 @@ export default class Video extends Component { }; _onFullscreenPlayerWillDismiss = (event) => { - Platform.OS === 'android' && this.setState({ androidFullScreen: false }); if (this.props.onFullscreenPlayerWillDismiss) { this.props.onFullscreenPlayerWillDismiss(event.nativeEvent); } @@ -356,25 +327,8 @@ export default class Video extends Component { resizeMode: this.props.posterResizeMode || 'contain', }; - //androidFullScreen property will only impact on android. It will be always false for iOS. - const videoStyle = this.state.androidFullScreen ? { - position: 'absolute', - top: 0, - left: 0, - width: this.width, - height: this.height, - backgroundColor: '#ffffff', - justifyContent: 'center', - zIndex: 99999, - marginTop: -1 * (this.state.videoContainerLayout_y ? parseFloat(this.state.videoContainerLayout_y) : 0), //margin: 0 - is not working properly. So, updated all the margin individually with 0. - marginLeft: -1 * (this.state.videoContainerLayout_x ? parseFloat(this.state.videoContainerLayout_x) : 0), - } : {}; - return ( - { - this._videoContainer = videoContainer; - return videoContainer; - }} style={[nativeProps.style, videoStyle]}> + IqJTj!Bf^)LDR{JnxEa~N1ab~2G;I8aZ+;vD&|9K#>Za+}}S hw1+W7gH38^%;Wl|urlrTkp31lF&-Yo(Vqj@t5MW?(VBlb2RA68sk<$=%?fL}g zZ@w1M<_+p#0~j#Cmx(8vl_oDaY^OGVp<-aWFxZL*KC4gr|LWiWhBN&&+XoiXZ3bHg cHfq6Cc79Qrt<3%=7eID - - - - -