Links

Configure VideoFeedView

This page is about the possible values of attributes, supported Customisations, and Listeners or Call back Handlers available for the Video Feed View

Setting a Channel as Source

app:channelId - When you use feedType="channel" , you must also specify which channel to use. You can use the attribute app:channelId for that purpose. If you are determining at run-time which channelId to be used, you can also set channeld programmatically using API setChannel .
<com.loopnow.fireworklibrary.views.VideoFeedView
android:layout_width="match_parent"
android:layout_height="match_parent"
app:feedType="channel"
app:channelId=""
/>
/**
* Programmatically
* sets the channelId for the channel Video Feed.
* @param channelId valid channel id
*/
videoFeedView.setChannel(channelId)

Setting a Playlist as Source

app:playlistId - When you use feedType="playlist" , you must also specify which playlist to use and the channel associated with it. You can use attribute app:channelId to specify channel and app:playlistId to specify playlistId. If you are determining at run-time which playlist to be used, you can also set playlist programmatically using API setPlaylist
<com.loopnow.fireworklibrary.views.VideoFeedView
android:layout_width="match_parent"
android:layout_height="match_parent"
app:feedType="playlist"
app:channelId=""
app:playlistId=""
/>
/**
* Programatically
* sets the playlist
* @param playlistId valid playlsit id
* @param channelId valid channel id that playlist is associated with
*/
videoFeedView.setPlaylist(channelId, playlistId)

Display/Hide the Video Title(Caption)

app:showTitle - You can use this attribute if you want to display the title/caption of the video along with thumbnail. By default title is not displayed.
<com.loopnow.fireworklibrary.views.VideoFeedView
android:layout_width="match_parent"
android:layout_height="match_parent"
app:feedLayout="grid"
app:showTitle="true"
/>
<!-- default title position is below thumbnail -->
By default, caption is displayed below the thumbnail when feedLayout is either vertical or grid and bottom edge of the caption is aligned to bottom edge of the thumbnail when feedLayout is horizontal . We will cover attribute to change the positioning of the caption next.

Setting the Title Position

app:titlePosition - You have an option to display video caption in two positions. 1. Below thumbnail app:titlePosition="below" and 2. At the bottom of the thumbnail app:titlePosition="alignBottom" . If you don't explicitly specify title position, it default to below as seen in the above example. Please note that app:titlePosition="below" is not available when you selected app:feedLayout="horizontal".
<com.loopnow.fireworklibrary.views.VideoFeedView
android:layout_width="match_parent"
android:layout_height="match_parent"
app:feedLayout="grid"
app:showTitle="true"
app:titlePosition="alignBottom"
/>

Styling the Title Text

app:textStyle - You can provide your own textStyle to be used with caption. You can define a text style in style.xml like the one below
<com.loopnow.fireworklibrary.views.VideoFeedView
android:layout_width="match_parent"
android:layout_height="match_parent"
app:feedLayout="grid"
app:showTitle="true"
app:titlePosition="alignBottom"
app:textStyle="@style/CustomCaptionStyle"
/>
<style name="CustomCaptionStyle">
<item name="android:textColor">#ffff6622</item>
<item name="android:textSize">15dp</item>
<item name="android:gravity">bottom</item>
<item name="android:paddingLeft">8dp</item>
<item name="android:paddingRight">8dp</item>
<item name="android:background">#80000000</item>
</style>

Styling the Thumbnail

app:imageStyle - This is still work in progress but at present, you can style the corner radius. Please refer to the example below on how to add corner radius by defining attribute app:imageStyle
<com.loopnow.fireworklibrary.views.VideoFeedView
android:layout_width="match_parent"
android:layout_height="match_parent"
app:feedLayoukt="grid"
app:showTitle="true"
app:titlePosition="below"
app:imageStyle="@style/CustomImageStyle"
app:textStyle="@style/CustomCaptionStyle"
/>
<style name="CustomImageStyle" >
<item name="android:radius">12dp</item>
</style>

Enable Autoplay

app:autoPlay - You can enable autoplay of the video without volume on the feed by setting app:autoPlay to true. It is set to false by default.
Example code snippet to turn on autoplay on the feed by definding xml attribute.
<com.loopnow.fireworklibrary.views.VideoFeedView
android:layout_width="match_parent"
android:layout_height="match_parent"
app:feedType="discover"
app:autoPlay="true"/>

Functions

refreshFeed() - Use this function within videoFeedView if you want to refresh the entire feed on the feed view.
videoFeedView.refreshFeed()

Callbacks

SDK provides the following callbacks that you can implement to listen to events and perform any action.
OnItemClickedListener - Implement the interface, if you want to receive an event when a user clicks on the thumbnail.
Kotlin
Java
videoFeedView.addOnItemClickedListener(new OnItemClickedListener() {
/**
* Implement if you want to handle the thumbnail clicked event yourself.
* If false is returned, SDK will handle the click event by launching the player
* and start playing the clicked video.
*
* @author Parijat Shah
* @param index position of the video in the list
* @param feedId identifies the source VideoFeed backing the VideoFeedView
* @return true if you handled the event, false if you didn't
*
*/
@Override
public boolean onItemClicked(int index, int feedId) {
return false;
}
/**
*
* index : position of the video in the list
*/
@Override
public void onItemClicked(int index) {
}
/**
*
* index : position of the video in the list
* title : title of the video , empty if no title
* id : unique identifier of the video
* duration : total duration of the video in miliseconds
*
*/
@Override
public void onItemClicked(int index, @NonNull String title, @NonNull String id, long duration) {
}
});
videoFeedView.addOnItemClickedListener(new OnItemClickedListener() {
@Override
public void onItemClicked(int index, @NonNull String title, @NonNull String id, long duration) {
}
@Override
public void onItemClicked(int index) {
}
@Override
public boolean onItemClicked(int index, int feedId) {
return false;
}
});

Custom Layout for VideoFeed Item

Android SDK provides custom attributes to style the VideoFeed item. But if you want complete control over the UI, you can provide a custom layout that will be used for displaying the VideoFeed item.
app:itemLayout
You can pass the custom layout to be used with VideoFeed using the attribute itemLayout. Refer to the following code snippet.
<com.loopnow.fireworklibrary.views.VideoFeedView
android:layout_width="match_parent"
android:layout_height="match_parent"
app:itemLayout="@layout/custom_item"
app:playlistId="abcxyz"
app:channelId="xyzabc"
app:feedType="playlist"
/>
The custom layout must include the following views
  • TextView: The layout must include TextView with id caption . The SDK will set the video caption to this view. You can still define its visibility.
  • TextView: The layout must include TextView with id thumbnail_ad_badge . If the video is an ad video, SDK will set the ad label to this TextView.
  • ImageView: The layout must include FireworkImageView with id thumbnail . The SDK set the video thumbnail to this ImageView.
If the custom layout provided doesn't have the views mentioned, an exception will be thrown.