In Feed
Scenario
Insert ad into
ListView/RecyclerView
when user is scrolling it.
Ad Formats Supported
Card Ad
Native Ad
How to Integrate
CrystalExpress™ SDK provides CEInFeedHelper
to simplify in-feed integration of Card Ad and Native Ad. Please follow the step below:
CEInFeedHelper
to simplify in-feed integration of Card Ad and Native Ad. Please follow the step below:Step 1: Copy the adsource
, component
under infeed
folder.
adsource
, component
under infeed
folder.You can modify the CEIFNativeAdView.java /CEIFDisplayAdView.java to customize the ad view.
Step 2: Prepare placement
You can have only one placement for a given RecyclerVIew/ListView.
The placement also could be obtained from your backend server to improve the scalability.
Step 3: Initialize CEInFeedHelper
If your app consists of multiple
RecyclerVIew/ListView
, eachRecyclerView/ListView
needs to be associated with oneCEInFeedHelper
.
// Prepare CEInFeedHelper
//
mInFeedHelper = new CEInFeedHelper(mActivity, placement, IS_DEBUG);
Step 4: Initial and Add ad source to CEInFeedHelper
The CEIFAdSource define the ad format you want to show on the feed placement.
For Card Ad format, please initialize
CEIFDisplayAdSource
.
// Init the Card ad source format.
adSource = new CEIFDisplayAdSource(mActivity){
@NonNull
@Override
public Map<String, Object> getAdProps() {
// TODO
// Make your custom ad props (Option)
// For example
// adProps.put(AdProperty.HIDE_WIFITAG, true);
// adProps.put(AdProperty.HIDE_SPEAKER, true);
// ...
return super.getAdProps();
}
};
// Add ad source to CEInFeedHelper
mInFeedHelper.setAdSource(adSource);
For more detail of customizing ad props, you can refer to AdProperty
For Native Ad format, please initialize
CEIFNativeAdSource
.
// Init the Native Ad source format.
adSource = new CEIFNativeAdSource(mActivity){
@NonNull
@Override
public Map<String, Object> getAdProps() {
// TODO
// Make your custom ad props (Option)
// For example
// adProps.put(AdProperty.HIDE_WIFITAG, true);
// adProps.put(AdProperty.HIDE_SPEAKER, true);
// ...
return super.getAdProps();
}
@NonNull
@Override
public View getNativeAdView(NativeAd nativeAd) {
// Get ad title string.
String title = mNativeAd.getAdTitle()
// Get ad description string.
String adBody = mNativeAd.getAdBody();
// Get call to action string.
String callToAction = mNativeAd.getAdCallToAction();
// Instantiate MediaView
// please make sure to pass activity on to the mediaview
//
int width = your_defined_width;
mMediaView = new MediaView(activity);
RelativeLayout.LayoutParams params = new RelativeLayout.LayoutParams(
width, RelativeLayout.LayoutParams.WRAP_CONTENT);
mMediaView.setLayoutParams(params);
mMediaView.setNativeAd(mNativeAd);
// Add these materials to the UI hierarchy
adView.addView(mediaView);
return adView;
}
};
// Add ad source to CEInFeedHelper.
mInFeedHelper.setAdSource(adSource);
For more detail of customizing ad props, you can refer to AdProperty
Step 5 (Optional) : Set ad event listener if you want to receive ad event status.
If you want to track the impression, click, mute.... etc, you can implement the CEIFHelperAdEventListener
to override the corresponding function.
// Set ad event listener if you want to receive ad event status. (Option)
//
mInFeedHelper.setAdEventListener(new CEInFeedHelper.CEIFHelperAdEventListener() {
@Override
public void onAdClicked(int index, Object ad) {
}
@Override
public void onAdImpression(int index, Object ad) {
}
@Override
public void onAdMute(int index, Object ad) {
}
@Override
public void onAdUnmute(int index, Object ad) {
}
@Override
public void onAdVideoStart(int index, Object ad) {
}
@Override
public void onAdVideoEnd(int index, Object ad) {
}
@Override
public void onAdVideoProgress(int index, Object ad, int totalDuration, int currentPosition) {
}
});
Step 6
Case 1 (Recommend): Put your adapter and CEInFeedHelper into CEIFAdapter()/CEIFRecyclerViewAdapter()
The CEIFAdapter/CEIFRecyclerViewAdapter can handle perform dynamic ad insertion and placement management. You can integrate the related adapter according to
ListView: Please use CEIFAdapter
mAdapter = new CEIFAdapter(mActivity, YourListViewAdapter, mInFeedHelper);
RecyclerView: Please use CEIFRecyclerViewAdapter
mAdapter = new CEIFRecyclerViewAdapter(mActivity, YourRecycleViewAdapter, mInFeedHelper);
Case 2: Get the Ad View from CEInFeedHelper each time in onBindViewHolder to make sure the ad can insert into your dataset in order.
If you want to assign Ad position by your own, you can pass the step6, and handle the content order as you prefer or contact your solutions engineer.
Step 7 : Implement the RecyclerView.OnScrollListener to notify InFeedHelper the scroll and scroll state.
The CEInFeedHelper needs to know the scroll state to make sure whether to prepare the Ad.
mRecyclerView.addOnScrollListener(new RecyclerView.OnScrollListener() {
@Override
public void onScrollStateChanged(RecyclerView recyclerView, int newState) {
super.onScrollStateChanged(recyclerView, newState);
if (mInFeedHelper != null) {
mInFeedHelper.onScrollStateChanged(newState);
}
}
@Override
public void onScrolled(RecyclerView recyclerView, int dx, int dy) {
super.onScrolled(recyclerView, dx, dy);
int firstVisibleItem, visibleItems, totalItems;
visibleItems = mRecyclerView.getChildCount();
totalItems = mLayoutManager.getItemCount();
firstVisibleItem = mLayoutManager.findFirstVisibleItemPosition();
if (mInFeedHelper != null) {
mInFeedHelper.onScroll(firstVisibleItem, visibleItems, totalItems);
}
}
});
Step 8: Add helper.onDestroy() and adapter.onDestroy()in the Activity.onDestroy() for memory release
@Override
protected void onDestroy() {
if (mAdapter != null) {
mAdapter.onDestroy();
mAdapter = null;
}
if (mInFeedHelper != null) {
mInFeedHelper.onDestroy();
mInFeedHelper = null;
}
...
...
super.onDestroy();
}
Last updated