From 1430dc7fea624dd42b8779c278fec152f42b70d3 Mon Sep 17 00:00:00 2001
From: Ibrahim Sulaiman <ibrahim.sulaiman@jet.com>
Date: Mon, 4 Feb 2019 19:18:29 +0530
Subject: [PATCH] Fix for play and pause button UI issue

---
 .../exoplayer/ReactExoplayerView.java         | 27 +++++++++++++++++++
 .../res/layout/exo_player_control_view.xml    |  1 +
 2 files changed, 28 insertions(+)

diff --git a/android-exoplayer/src/main/java/com/brentvatne/exoplayer/ReactExoplayerView.java b/android-exoplayer/src/main/java/com/brentvatne/exoplayer/ReactExoplayerView.java
index 484265f6..f72e4304 100644
--- a/android-exoplayer/src/main/java/com/brentvatne/exoplayer/ReactExoplayerView.java
+++ b/android-exoplayer/src/main/java/com/brentvatne/exoplayer/ReactExoplayerView.java
@@ -98,6 +98,8 @@ class ReactExoplayerView extends FrameLayout implements
 
     private final VideoEventEmitter eventEmitter;
     private PlayerControlView playerControlView;
+    private View playPauseControlContainer;
+    private Player.EventListener eventListener;
     
     private Handler mainHandler;
     private ExoPlayerView exoPlayerView;
@@ -264,6 +266,7 @@ class ReactExoplayerView extends FrameLayout implements
      * Toggling the visibility of the player control view 
      */
     private void togglePlayerControlVisibility() {
+        reLayout(playerControlView);
         if(playerControlView.isVisible()) {
             playerControlView.hide();
         } else {
@@ -287,6 +290,7 @@ class ReactExoplayerView extends FrameLayout implements
         //Setting the player for the playerControlView
         playerControlView.setPlayer(player);
         playerControlView.show();
+        playPauseControlContainer = playerControlView.findViewById(R.id.exo_play_pause_container);
 
         //Invoking onClick event for exoplayerView
         exoPlayerView.setOnClickListener(new OnClickListener() {
@@ -295,6 +299,29 @@ class ReactExoplayerView extends FrameLayout implements
                 togglePlayerControlVisibility();
             }
         });
+
+        //Invoking onPlayerStateChanged event for Player
+        eventListener = new Player.EventListener() {
+            @Override
+            public void onPlayerStateChanged(boolean playWhenReady, int playbackState) {
+                reLayout(playPauseControlContainer);
+                player.removeListener(eventListener);
+            }
+        };
+        player.addListener(eventListener);
+    }
+
+    /**
+     * Update the layout
+     *
+     * This is a workaround for the open bug in react-native: https://github.com/facebook/react-native/issues/17968
+     * @param view  view needs to update layout
+     */
+    private void reLayout(View view) {
+        if(view == null) return;
+        view.measure(MeasureSpec.makeMeasureSpec(getMeasuredWidth(), MeasureSpec.EXACTLY),
+                MeasureSpec.makeMeasureSpec(getMeasuredHeight(), MeasureSpec.EXACTLY));
+        view.layout(view.getLeft(), view.getTop(), view.getMeasuredWidth(), view.getMeasuredHeight());
     }
 
     private void initializePlayer() {
diff --git a/android-exoplayer/src/main/res/layout/exo_player_control_view.xml b/android-exoplayer/src/main/res/layout/exo_player_control_view.xml
index 54b38ad7..becee6a9 100644
--- a/android-exoplayer/src/main/res/layout/exo_player_control_view.xml
+++ b/android-exoplayer/src/main/res/layout/exo_player_control_view.xml
@@ -20,6 +20,7 @@
         <ImageButton android:id="@id/exo_rew"
             style="@style/ExoMediaButton.Rewind"/>
         <FrameLayout
+            android:id="@+id/exo_play_pause_container"
             android:layout_width="wrap_content"
             android:layout_height="wrap_content"
             android:layout_gravity="center">