Video Player
Determines the player mode and can be one of
- PlayerMode.FIT_MODE: This state causes the player surface cuts into a smaller area of the screen while it maintains the 9:16 aspect ratio. Also, it makes the corner of the player rounded. (default value)
- PlayerMode.FULL_BLEED_MODE: This state causes the player surface to fill the mobile screen without rounding the corner of the screen, Also while the source video maintains the 9:16 aspect ratio, the visible player fills the screen of the device, thus causing a minimal part of the video cut off in the edges.
Player Mode needs to be configured along with
FwVideoFeedView
<com.firework.videofeed.FwVideoFeedView
android:id="@+id/videoFeedView"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:fw_playerMode="fit_mode"
/>
Alternatively, this can be set as below in the class where ViewOptions are set for the
FwideoFeedView
Kotlin
Java
val playerOption = PlayerOption.Builder()
.playerMode(PlayerMode.FIT_MODE) // Set the player mode
.build()
val viewOptions = ViewOptions.Builder()
.playerOption(playerOption)
.build()
val videoFeedView = findViewById<FwVideoFeedView>(R.id.videoFeedView)
videoFeedView.init(viewOptions)
PlayerOption playerOptions = new PlayerOption.Builder()
.playerMode(PlayerMode.FIT_MODE)
.build();
ViewOptions viewOptions = new ViewOptions.Builder()
.playerOption(playerOptions)
.build();
// init video feed view with view options
videoFeedView.init(viewOptions);
Use
fw_autoPlayOnComplete
attribute of FwVideoFeedView
to control if the next video is automatically played after the previous one has ended. When true
the player will play the next video after the current video finishes. Whenfalse
, playing video will loop until users explicitly swipe away. Default value is true
. <com.firework.videofeed.FwVideoFeedView
android:id="@+id/videoFeedView"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:fw_autoPlayOnComplete="true"
/>
Alternatively, this attribute can be set via
ViewOptions
class:Kotlin
Java
val playerOption = PlayerOption.Builder()
.autoPlayOnComplete(true)
.build()
val viewOptions = ViewOptions.Builder()
.playerOption(playerOption)
.build()
val videoFeedView = findViewById<FwVideoFeedView>(R.id.videoFeedView)
videoFeedView.init(viewOptions)
PlayerOption playerOptions = new PlayerOption.Builder()
.autoPlayOnComplete(true)
.build();
ViewOptions viewOptions = new ViewOptions.Builder()
.playerOption(playerOptions)
.build();
// init video feed view with view options
videoFeedView.init(viewOptions);
Use
fw_showPlayPauseButtonInReplay
attribute of FwVideoFeedView
to control if the play/pause button is visible in the player. Default value is true
. <com.firework.videofeed.FwVideoFeedView
android:id="@+id/videoFeedView"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:fw_showPlayPauseButtonInReplay="false"
/>
Alternatively, this attribute can be set via
ViewOptions
class:Kotlin
Java
val playerOption = PlayerOption.Builder()
.showPlayPauseButtonInReplay(true)
.build()
val viewOptions = ViewOptions.Builder()
.playerOption(playerOption)
.build()
val videoFeedView = findViewById<FwVideoFeedView>(R.id.videoFeedView)
videoFeedView.init(viewOptions)
PlayerOption playerOptions = new PlayerOption.Builder()
.showPlayPauseButtonInReplay(true)
.build();
ViewOptions viewOptions = new ViewOptions.Builder()
.playerOption(playerOptions)
.build();
// init video feed view with view options
FwVideoFeedView videoFeedView = findViewById<FwVideoFeedView>(R.id.videoFeedView)
videoFeedView.init(viewOptions);
Use
fw_showMuteButton
the attribute FwVideoFeedView
to control if the mute/unmute button is visible in the player. DefaultDefault value is false
. <com.firework.videofeed.FwVideoFeedView
android:id="@+id/videoFeedView"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:fw_showMuteButton="true"
/>
Alternatively, this attribute can be set via
ViewOptions
class:Kotlin
Java
val playerOption = PlayerOption.Builder()
.showMuteButton(true)
.build()
val viewOptions = ViewOptions.Builder()
.playerOption(playerOption)
.build()
val videoFeedView = findViewById<FwVideoFeedView>(R.id.videoFeedView)
videoFeedView.init(viewOptions)
PlayerOption playerOptions = new PlayerOption.Builder()
.showMuteButton(true)
.build();
ViewOptions viewOptions = new ViewOptions.Builder()
.playerOption(playerOptions)
.build();
// init video feed view with view options
videoFeedView.init(viewOptions);
Use
fw_enablePipMode
the attribute FwVideoFeedView
to control if the PIP is enabled for the player. Default value is true
. <com.firework.videofeed.FwVideoFeedView
android:id="@+id/videoFeedView"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:fw_enablePipMode="true"
/>
Alternatively, this attribute can be set via
ViewOptions
class:Kotlin
Java
val playerOption = PlayerOption.Builder()
.enablePipMode(true)
.build()
val viewOptions = ViewOptions.Builder()
.playerOption(playerOption)
.build()
val videoFeedView = findViewById<FwVideoFeedView>(R.id.videoFeedView)
videoFeedView.init(viewOptions)
PlayerOption playerOptions = new PlayerOption.Builder()
.enablePipMode(true)
.build();
ViewOptions viewOptions = new ViewOptions.Builder()
.playerOption(playerOptions)
.build();
// init video feed view with view options
videoFeedView.init(viewOptions);ab
Use
fw_showFireworkLogo
attribute of FwVideoFeedView
to control if the share button is visible in the player. The default value is true. <com.firework.videofeed.FwVideoFeedView
android:id="@+id/videoFeedView"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:fw_showFireworkLogo="true"
/>
Alternatively, this attribute can be set via
ViewOptions
class:Kotlin
Java
val playerOption = PlayerOption.Builder()
.showFireworkLogo(true)
.build()
val viewOptions = ViewOptions.Builder()
.playerOption(playerOption)
.build()
val videoFeedView = findViewById<FwVideoFeedView>(R.id.videoFeedView)
videoFeedView.init(viewOptions)
PlayerOption playerOptions = new PlayerOption.Builder()
.showFireworkLogo(true)
.build();
ViewOptions viewOptions = new ViewOptions.Builder()
.playerOption(playerOptions)
.build();
// init video feed view with view options
videoFeedView.init(viewOptions);
Use
fw_showShareButton
attribute of FwVideoFeedView
to control if the share button is visible in the player. Default value is true
. <com.firework.videofeed.FwVideoFeedView
android:id="@+id/videoFeedView"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:fw_showShareButton="false"
/>
Alternatively, this attribute can be set via
ViewOptions
class:Kotlin
Java
PlayerOption playerOptions = new PlayerOption.Builder()
.showShareButton(true)
.build();
ViewOptions viewOptions = new ViewOptions.Builder()
.playerOption(playerOptions)
.build();
// init video feed view with view options
videoFeedView.init(viewOptions);
PlayerOption playerOptions = new PlayerOption.Builder()
.showShareButton(true)
.build();
ViewOptions viewOptions = new ViewOptions.Builder()
.playerOption(playerOptions)
.build();
// init video feed view with view options
videoFeedView.init(viewOptions);
Use
fw_feedAutoplay
attribute of FwVideoFeedView
to control if the video feed should use autoplay, this means that the first visible item of the feed will start playing. Default value is false
. <com.firework.videofeed.FwVideoFeedView
android:id="@+id/videoFeedView"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:fw_feedAutoplay="true"
/>
Alternatively, this attribute can be set via
ViewOptions
class:Kotlin
Java
val playerOptions = PlayerOption.Builder()
.autoplay(true)
.build()
val viewOptions = ViewOptions
.Builder()
.playerOption(playerOptions)
.build()
val videoFeedView = findViewById<FwVideoFeedView>(R.id.videoFeedView)
videoFeedView.init(viewOptions)
PlayerOption playerOptions = new PlayerOption.Builder()
.autoplay(true)
.build();
ViewOptions viewOptions = new ViewOptions.Builder()
.playerOption(playerOptions)
.build();
// init video feed view with view options
videoFeedView.init(viewOptions);
- CtaDelayUnit.SECONDS: This unit type makes the CTA button become visible at the number of seconds set, this unit type only supports values from 0.0f inclusive to 10.0f inclusive [0.0f, 10.0f], otherwise when trying to play a video it will use
3
seconds default value. - CtaDelayUnit.PERCENTAGE: This unit type makes the CTA button become visible at the percentage set of the video, for example, if the video is 20 seconds and the percentage is set to 0.6f (60%) the CTA button will become visible at 12 seconds, this unit type only supports values from 0.0f inclusive to 1.0f exclusive [0%, 100%), otherwise when trying to play a video it will use 0.2f (20%) default value.
Use
fw_ctaButtonDelayUnitType
and fw_ctaButtonDelayDuration
attribute of VideoFeedView
to control the visibility delay of CTA button. <com.firework.videofeed.FwVideoFeedView
android:id="@+id/videoFeedView"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:fw_ctaButtonDelayDuration=".5"
app:fw_ctaButtonDelayUnitType="percentage" />
Alternatively, this attribute can be set via
ViewOptions
class:Kotlin
Java
val ctaDelay = CtaDelay(ctaDelayDuration, CtaDelayUnit.SECONDS)
val viewOptions = ViewOptions.Builder()
.ctaDelay(ctaDelay)
.build()
val videoFeedView = findViewById<VideoFeedView>(R.id.videoFeedView)
videoFeedView.init(viewOptions)
CtaOption ctaOptions = new CtaOption.Builder()
.ctaDelay(new CtaDelay(2.0f, CtaDelayUnit.SECONDS)).build();
ViewOptions viewOptions = new ViewOptions.Builder()
.ctaOption(ctaOptions)
.build();
- CtaDelayUnit.SECONDS: This unit type makes the CTA button highlight at the number of seconds set after cta visibility delay ended, this unit type only supports values from 0.0f inclusive to 10.0f inclusive [0.0f, 10.0f], otherwise when trying to play a video it will use
2
seconds default value. - CtaDelayUnit.PERCENTAGE: This unit type makes the CTA button highlight at the percentage set of the video, for example, if the video is 20 seconds and the percentage is set to 0.6f (60%) the CTA button will highlight at 12 seconds, this unit type only supports values from 0.0f inclusive to 1.0f exclusive [0%, 100%), otherwise when trying to play a video it will use 0.2f (20%) default value.
This attribute can only be set via
ViewOptions
class:Kotlin
val ctaHighlightDelay = CtaDelay(ctaHighlightDelayDuration, CtaDelayUnit.SECONDS)
val viewOptions = ViewOptions.Builder()
.ctaHighlightDelay(ctaHighlightDelay)
.build()
val videoFeedView = findViewById<VideoFeedView>(R.id.videoFeedView)
videoFeedView.init(viewOptions)
Override
FwCtaButtonViewStyle
to modify the appearance of the CTA button:- CTA button background color
- CTA button text color
- CTA button typeface (Font)
Use
android:backgroundTint
, android:textColor
and android:fontFamily
attributes to modify the appearance of the CTA button<resources>
<style name="FwCtaButtonViewStyle">
<item name="android:backgroundTint">@color/customBackgroundColor</item>
<item name="android:textColor">@android:color/customTextColor</item>
<item name="android:fontFamily">@font/customFont</item>
</style>
</resources>
To override the CTA button shape properties (rounded corners radius for example) declare a separate style and apply it to
shapeAppearanceOverlay
style attribute:<resources>
<style name="FwCtaButtonViewStyle">
<item name="shapeAppearanceOverlay">@style/MyCustomCtaButtonShapeStyle</item>
</style>
<style name="MyCustomCtaButtonShapeStyle">
<item name="cornerFamily">rounded</item> <!-- possible values "rounded" and "cut" -->
<item name="cornerSizeTopLeft">6dp</item>
<item name="cornerSizeBottomLeft">6dp</item>
<item name="cornerSizeBottomRight">6dp</item>
<item name="cornerSizeTopRight">6dp</item>
</style>
</resources>
Refer to CTAClickHandler Section in
For managing PIP/Floating player you can use the following functions:
If you want to enter pip mode programmatically, you can call the following function:
Kotlin
Java
FireworkSdk.enterPip(
{ onSuccess ->
// true if entering PIP was a success
},
)
FireworkSdk.INSTANCE.enterPip();
If you want to close PIP/Floating player for some reason, you can call the following function:
Kotlin
Java
FireworkSdk.closePip()
FireworkSdk.INSTANCE.closePip();
Last modified 7d ago