feat(android): handle increment forward and rewind buttons (#3818)

* feat(android): handle increment forward and rewind buttons * fix: function name for get seekIncrementMS
TheWidlarzGroup · May 28, 2024 · 5059e7a · 5059e7a
1 parent 46e12e0
commit 5059e7a
Show file tree

Hide file tree

Showing 5 changed files with 20 additions and 3 deletions.
diff --git a/android/src/main/java/com/brentvatne/common/api/ControlsConfig.kt b/android/src/main/java/com/brentvatne/common/api/ControlsConfig.kt
@@ -5,6 +5,7 @@ import com.facebook.react.bridge.ReadableMap
 
 class ControlsConfig {
     var hideSeekBar: Boolean = false
+    var seekIncrementMS: Int = 10000
 
     companion object {
         @JvmStatic
@@ -13,6 +14,7 @@ class ControlsConfig {
 
             if (src != null) {
                 config.hideSeekBar = ReactBridgeUtils.safeGetBool(src, "hideSeekBar", false)
+                config.seekIncrementMS = ReactBridgeUtils.safeGetInt(src, "seekIncrementMS", 10000)
             }
 
             return config

diff --git a/android/src/main/java/com/brentvatne/exoplayer/ReactExoplayerView.java b/android/src/main/java/com/brentvatne/exoplayer/ReactExoplayerView.java
@@ -444,6 +444,17 @@ public void handleOnBackPressed() {
             setPausedModifier(false);
         });
 
+        //Handling the rewind and forward button click events
+        ImageButton exoRewind = playerControlView.findViewById(R.id.exo_rew);
+        ImageButton exoForward = playerControlView.findViewById(R.id.exo_ffwd);
+        exoRewind.setOnClickListener((View v) -> {
+            seekTo(player.getCurrentPosition() - controlsConfig.getSeekIncrementMS());
+        });
+
+        exoForward.setOnClickListener((View v) -> {
+            seekTo(player.getCurrentPosition() + controlsConfig.getSeekIncrementMS());
+        });
+
         //Handling the pauseButton click event
         ImageButton pauseButton = playerControlView.findViewById(R.id.exo_pause);
         pauseButton.setOnClickListener((View v) ->

diff --git a/docs/pages/component/props.mdx b/docs/pages/component/props.mdx
@@ -53,15 +53,17 @@ A Boolean value that indicates whether the player should automatically delay pla
 
 Adjust the control styles. This prop is need only if `controls={true}` and is an object. See the list of prop supported below.
 
-| Property    | Type    | Description                                                                          |
-|-------------|---------|--------------------------------------------------------------------------------------|
-| hideSeekBar | boolean | The default value is `false`, allowing you to hide the seek bar for live broadcasts. |
+| Property        | Type    | Description                                                                             |
+|-----------------|---------|-----------------------------------------------------------------------------------------|
+| hideSeekBar     | boolean | The default value is `false`, allowing you to hide the seek bar for live broadcasts.    |
+| seekIncrementMS | number  | The default value is `10000`. You can change the value to increment forward and rewind. |
 
 Example with default values:
 
 ```javascript
 controlsStyles={{
   hideSeekBar: false,
+  seekIncrementMS: 10000,
 }}
 ```
 

diff --git a/src/specs/VideoNativeComponent.ts b/src/specs/VideoNativeComponent.ts
@@ -285,6 +285,7 @@ export type OnAudioFocusChangedData = Readonly<{
 
 type ControlsStyles = Readonly<{
   hideSeekBar?: boolean;
+  seekIncrementMS?: number;
 }>;
 
 export interface VideoNativeProps extends ViewProps {

diff --git a/src/types/video.ts b/src/types/video.ts
@@ -204,6 +204,7 @@ export type AudioOutput = 'speaker' | 'earpiece';
 
 export type ControlsStyles = {
   hideSeekBar?: boolean;
+  seekIncrementMS?: number;
 };
 
 export interface ReactVideoProps extends ReactVideoEvents, ViewProps {