Links
Comment on page

Video Player

When a user clicks on one of the thumbnails displayed in the VideoFeedView, SDK will launch the Video Player and start playing the video that the user clicked on unless you are handling the onItemClickedEvent yourself. Users can swipe right or tap on the right side of the screen to play the next video and swipe left or tap on the left side of the screen to play the previous video. You can customize the playback experience and enable/disable some of the features through VideoPlayerProperties Class.

Video Player Properties

Kotlin
Java
/**
* Share - When true, the share feature will be enabled, disabled otherwise.
* Enabling Share feature, will display share icon on the screen
* and when a user clicks on it, a default shared sheet is displayed.
* The shared URL is a firework URL and users will watch videos on fw.tv.
* You can customize the shared URL
*
*/
VideoPlayerProperties.share = true
/*
* Set fullScreenPlayer to true if you want to launch the video player in full screen mode.
* The default is false.
*/
VideoPlayerProperties.fullScreenPlayer = true
/*
* Disable Firework Branding
*/
VideoPlayerProperties.branding = false
/*
* AutoPlayOnComplete
* When true, the player will play the next video,
* When the current video finishes playing.
* When false, playing video will loop until users explicitly swipe away
* Default value is true.
*/
VideoPlayerProperties.autoPlayOnComplete = true
/**
* Display & enable mute/unmute control.
* Default value is false.
*/
VideoPlayerProperties.enableOneTouchMute = true
/**
* Display & enable play/paused control
* Default value is false.
*/
VideoPlayerProperties.enablePlayPauseControl = true
/**
* Configuration for the mute or unmute at the first player launch.
* Default value is false, the player starts from unmute state.
*/
VideoPlayerProperties.launchPlayerWithMute = true
//Set the video player properties for Firework Video Player
VideoPlayerProperties.INSTANCE.setShare(true);
VideoPlayerProperties.INSTANCE.setFullScreenPlayer(true);
VideoPlayerProperties.INSTANCE.setBranding(false);
VideoPlayerProperties.INSTANCE.setAutoPlayOnComplete(true);
VideoPlayerProperties.INSTANCE.setEnableOneTouchMute(true);
VideoPlayerProperties.INSTANCE.setEnablePlayPauseControl(true);
VideoPlayerProperties.INSTANCE.setLaunchPlayerWithMute(false);

Launching Video Player

You can directly launch a player programamtically if you have a use case for it. SDK provides an easy-to-use API to launch a player activity.
Kotlin
Java
/**
* Launch the video player activity and start playing video
* based on VideoFeed configuration provided
* @param feedId This is random integer which needs to be unique. A feed can be shared across
* multiple launches. If you pass the feedId that has been used in the past, then any available
* data for the specified configuration is used.
* @param feedType specifies the feedType to be used. options are playlist, channel, discover
* @param channelId specifies the channelId to be used with feedType channel and playlist
* @param playlistId specifies the playlistId to be used with feedType playlist
* @param activityContext used to launch PlayerActivity
*/
FwSDK.play(activity, feedId, feedType, channelId, playlistId)
/**
* Launch the video player activity and start playing video
* based on VideoFeed configuration provided
* @param feedId This is random integer which needs to be unique. A feed can be shared across
* multiple launches. If you pass the feedId that has been used in the past, then any available
* data for the specified configuration is used.
* @param feedType specifies the feedType to be used. options are playlist, channel, discover
* @param channelId specifies the channelId to be used with feedType channel and playlist
* @param playlistId specifies the playlistId to be used with feedType playlist
* @param activityContext used to launch PlayerActivity
*/
FwSDK.INSTANCE.play(activity, feedId, feedType, channelId, playlistId);

Custom Handling of CTA

Call to Action(CTA) buttons are one form of Video Overlay component we support on our short-form videos. SDK provides a suitable callback to listen to CTA clicked events and handle the action as per required. For eg: The User could be navigated to Product pages upon clicking Shop Now CTA. The default behaviour of the SDK if this handler is not implemented is to load the CTA URL in a WebView within the app.
Kotlin
Java
//Return true if you have handled the event and do not want SDK to handle it and false when you want SDK to handle the ctaClicked event.
FwSDK.ctaClickHandler = object : FwSDK.CtaClickHandler {
override fun ctaClicked(label: String, actionUrl: String?): Boolean {
return true
}
}
//Return true if you have handled the event and do not want SDK to handle it and false when you want SDK to handle the ctaClicked event.
FwSDK.INSTANCE.setCtaClickHandler(new FwSDK.CtaClickHandler() {
@Override
public boolean ctaClicked(@NonNull String label, @Nullable String actionUrl) {
Log.v("FwDemo", actionUrl);
return false;
}
}

Customize Style

Custom CTA Button Background

//Apply your custom CTA button background by "FWCtaButtonBgStyle" style.
//Below is the default "FWCtaButtonBgStyle"
<style name="FWCtaButtonBgStyle">
<item name="android:background">your_desire_background_color_or_drawable</item>
</style>

Custom CTA Button Text Style

//Apply your custom CTA button title by "FWCtaButtonLabelStyle" style.
//Below is the default "FWCtaButtonLabelStyle"
<style name="FWCtaButtonLabelStyle">
<item name="android:textSize">your_desire_font_size</item>
<item name="android:textColor">your_desire_font_color</item>
</style>

Custom Add to Cart Button Style

<style name="FWAddToCartButtonStyle">
<item name="android:textColor">your_desire_font_color</item>
<item name="android:textSize">your_desire_font_size</item>
</style>

Custom Ad label

//Apply your custom Ad label by "FwAdBadgeOnPlayerStyle" style.
//Below is the default "FwAdBadgeOnPlayerStyle"
<style name="FwAdBadgeOnPlayerStyle" >
<item name="android:background">@null</item>
<item name="android:textColor">@android:color/white</item>
<item name="android:textSize">@dimen/fw_font_size_16</item>
</style>
Example code snippet:
Apply a customized "FwAdBadgeOnPlayerStyle" on the app res/style.xml
<style name="FwAdBadgeOnPlayerStyle" >
<item name="android:padding">5dp</item>
<item name="android:background">@android:color/darker_gray</item>
<item name="android:textColor">@android:color/white</item>
<item name="android:textSize">@dimen/fw_font_size_14</item>
</style>
Customised Ad Label
Default Ad Label