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

* feat(android): handle increment forward and rewind buttons
* fix: function name for get seekIncrementMS

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

android/src/main/java/com/brentvatne/exoplayer/ReactExoplayerView.java

@@ -444,6 +444,17 @@ public class ReactExoplayerView extends FrameLayout implements
             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) ->

docs/pages/component/props.mdx

@@ -54,14 +54,16 @@ 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.    |
+| 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,
 }}
 ```
 

src/specs/VideoNativeComponent.ts

@@ -285,6 +285,7 @@ export type OnAudioFocusChangedData = Readonly<{
 
 type ControlsStyles = Readonly<{
   hideSeekBar?: boolean;
+  seekIncrementMS?: number;
 }>;
 
 export interface VideoNativeProps extends ViewProps {

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 {