Millenial Media banner Ad display a white entire screen

Question

I am using Millennial Media SDK and writing a Cordova/PhoneGap plugin for mMedia Ad, it works pretty well on iOS and video Ad, but I have some trouble when using banner AD on Android.

If I insert the MMAdView as brother view of Cordova WebView (docking at top or bottom), the banner Ad always display a full screen white space, which covers the WebView.

When I write log to check the size of MMAdView with getWidth() or getMeasuredWidth(), it always return 0 or 1 instead of the actual size!

It's quite similar to this question, the difference is I am using pure java code instead of XML layout file.

AdMob mediated Millenial Media ad taking entire screen on refresh

See the screenshot:

banner unexpected white screen

Here is the code:

                adView = new MMAdView(cordova.getActivity());
                adView.setApid( bannerAdId );
                adView.setId(MMSDK.getDefaultAdId());

                width = BANNER_AD_WIDTH;
                height = BANNER_AD_HEIGHT;
                //Finds an ad that best fits a users device.
                if(canFit(MED_BANNER_WIDTH)) {
                    width = MED_BANNER_WIDTH;
                    height = MED_BANNER_HEIGHT;
                } else if(canFit(IAB_LEADERBOARD_WIDTH)) {
                    width = IAB_LEADERBOARD_WIDTH;
                    height = IAB_LEADERBOARD_HEIGHT;
                }
                adView.setWidth(width);
                adView.setHeight(height);

                adView.setListener(new BannerListener());
                adView.getAd();

                ViewGroup parentView = (ViewGroup) webView.getParent();
                if(argPos <= TOP_RIGHT) {
                    parentView.addView(adView, 0);
                } else {
                    parentView.addView(adView);
                }

Raymond Xie · Accepted Answer · 2014-11-15T02:15:53.507

After study, I find the solution by myself.

First, create the banner view and set logic adWidth and adHeight:

//Constants for tablet sized ads (728x90)
private static final int IAB_LEADERBOARD_WIDTH = 728;
private static final int IAB_LEADERBOARD_HEIGHT = 90;

private static final int MED_BANNER_WIDTH = 480;
private static final int MED_BANNER_HEIGHT = 60;

//Constants for phone sized ads (320x50)
private static final int BANNER_AD_WIDTH = 320;
private static final int BANNER_AD_HEIGHT = 50;

    MMAdView ad = new MMAdView(getActivity());
    ad.setApid( adId );
    ad.setMMRequest(new MMRequest());
    ad.setId(MMSDK.getDefaultAdId());
    ad.setIgnoresDensityScaling(ignoreScaling);
    ad.setTransitionType(transitionType);

    //Finds an ad that best fits a users device.
    if(canFit(MED_BANNER_WIDTH)) {
        adWidth = MED_BANNER_WIDTH;
        adHeight = MED_BANNER_HEIGHT;
    } else if(canFit(IAB_LEADERBOARD_WIDTH)) {
        adWidth = IAB_LEADERBOARD_WIDTH;
        adHeight = IAB_LEADERBOARD_HEIGHT;
    }
    ad.setWidth(adWidth);
    ad.setHeight(adHeight);

The banner view cannot return proper width and height, it must be calculated from the adWidth and adHeight.

    DisplayMetrics metrics = new DisplayMetrics();
    getActivity().getWindowManager().getDefaultDisplay().getMetrics(metrics);
    float screenDensity = metrics.density;

    int adViewWidth = (int) (adWidth * screenDensity);
    int adViewHeight = (int) (adHeight * screenDensity);

Then, use the calculated adViewWidth and adViewHeight to set position of the banner view.

    adViewLayout = new RelativeLayout(activity);

    RelativeLayout.LayoutParams params = new RelativeLayout.LayoutParams(
            RelativeLayout.LayoutParams.MATCH_PARENT,
            RelativeLayout.LayoutParams.MATCH_PARENT);
    ViewGroup rootView = (ViewGroup) getView().getRootView();
    rootView.addView(adViewLayout, params);
    adViewLayout.bringToFront();

    Log.d(LOGTAG, String.format("show banner: (%d,%d), (%d x %d)", x,y,bw,bh));

    RelativeLayout.LayoutParams params = new RelativeLayout.LayoutParams(bw, bh);
    params.leftMargin = x;
    params.topMargin = y;
    adViewLayout.addView(adView, params);

Now it works, see screenshot.

enter image description here

I'm having the same problem. Can you upload the rest of the code? I still can't manage to make it work. And how to move the banner to bottom? — erasmus77, Nov 14 '14 at 11:54
create a relativelayout or linearlayout as container, put the ad banner view into it. — Raymond Xie, Nov 14 '14 at 12:59
I managed to do that and I also moved it to the bottom but now I have white space around the ad. It is not transparent like yours. any ideeas? — erasmus77, Nov 14 '14 at 19:20

score 0 · Answer 2 · answered Oct 09 '14 at 03:07

It's hard to tell with out the code. This could be due to the fact that you are using PhoneGap to wrap some of the advertising code. It could be a different type of bug. Since you are using PhoneGap already you might find Millennial Media's Javascript SDK a bit easier to use for your advertisement needs. http://docs.millennialmedia.com/mmadlib/index.html

Millenial Media banner Ad display a white entire screen

2 Answers2