AdMob banner causes scrolled content to get stuck


#1

I’ve added this AdMob plugin to my app https://github.com/floatinghotpot/cordova-admob-pro

I have a list that only half fills the screen e.g.side menu list with only 3 items. The ad banner shows correctly at the bottom of the screen but when I swipe the list content down so that it is behind the banner AND remove my finger only once it is over the banner, the scrolled content does not bounce back up as it should. It becomes stuck behind the banner until I touch the screen and swipe the list back up.


#2

Hmm, do you mind sharing some code? I havent used admob, maybe @nicraboy would be able to provide some info?


#3

@edd, I saw my bat signal.

I am very familiar with the floatinghotpot plugin. I use it in two of my applications. However, I’ve not yet dabled with the pro version. I can’t imagine it being too different.

Would you mind sharing some images with us about what you’re talking about. Code would be good too, but images at a minimum.

Thanks,


#4

Hi @nicraboy - sorry for late reply.

Here is an iOS emulator screen shot of a list stuck behind the AdMob banner.

Note that it only gets stuck when you scroll the list down lift off the touch when finger/pointer is over the AdMob banner.

I just used the default tabs project and added the AdMob plugin. I’m also making use of $log so that needs to be injected into app.js.

cordova plugin add com.google.cordova.admob

This is the AdMob code I added into app.js

// AdMob
// https://github.com/floatinghotpot/cordova-admob-pro/blob/master/test/index.html

if(AdMob) {
    $log.info('AdMob EXISTS');
    
    // Select the right Ad Id according to platform
    var adUnits = {
        ios : {
            banner: 'ca-app-pub-xxx/yyy', // Replace this with real AdMob id
            interstitial: 'ca-app-pub-xxx/yyy'
        },
        android : {
            banner: 'ca-app-pub-xxx/zzz',
            interstitial: 'ca-app-pub-xxx/kkk'
        }
    };
    
    var adMobId = adUnits.ios;
    
    var initAd = function() {
        var defaultOptions = {
            // license: 'username@gmail.com/xxxxxxxxxxxxxxx',
            // bannerId: AdMob.banner,
            // interstitialId: admobid.interstitial,
             adSize: 'SMART_BANNER',
            // width: 360, // valid when set adSize 'CUSTOM'
            // height: 90, // valid when set adSize 'CUSTOM'
            position: AdMob.AD_POSITION.BOTTOM_CENTER,
            // x: 0,       // valid when set position to POS_XY
            // y: 0,       // valid when set position to POS_XY
            isTesting: true
            //,autoShow: true
        };
        
        $log.info('defaultOptions = ' + JSON.stringify(defaultOptions));
        
        AdMob.setOptions( defaultOptions );
        registerAdEvents();
    }
    
    // optional, in case respond to events or handle error
    var registerAdEvents = function() {
        document.addEventListener('onBannerFailedToReceive', function(data){ alert('error: ' + data.error + ', reason: ' + data.reason); });
        document.addEventListener('onBannerReceive', function(){});
        document.addEventListener('onBannerPresent', function(){});
        document.addEventListener('onBannerLeaveApp', function(){});
        document.addEventListener('onBannerDismiss', function(){});

        document.addEventListener('onInterstitialFailedToReceive', function(data){ alert('error: ' + data.error + ', reason: ' + data.reason); });
        document.addEventListener('onInterstitialReceive', function(){});
        document.addEventListener('onInterstitialPresent', function(){});
        document.addEventListener('onInterstitialLeaveApp', function(){});
        document.addEventListener('onInterstitialDismiss', function(){});
    }
    
    // Set options
    initAd();
    
    $log.info('adMobId.banner = ' + adMobId.banner);
    
    // Display the banner at startup
    AdMob.createBanner(
        adMobId.banner, 
        function(){
            $log.info('AdMob SUCCESS!');
        }, 
        function(data){
            $log.info(JSON.stringify(data));
        } 
    );

    
}

#5

Is this in the run method of your module or is this code in a controller?


#6

It’s in the $ionicPlatform.ready(function() {} in the app.js .run function


#7

Hi @nicraboy, @mhartington - I don’t suppose you guys managed to reproduce this by any chance?

Sorry, I don’t mean to push you, just interested if anyone else is seeing the same thing?

Thanks


#8

Sorry @edd,

I’ve never run into anything like this when I use floatinghotpot. Can you try to use the basic version rather than the pro version?

I have a tutorial on the basic version and haven’t heard any complaints:

Maybe worth trying?


#9

Thanks @nicraboy I will give the basic plugin a go.

I read this post Implementing admob is app
though whcih suggested using the pro version.

@floatinghotpot - have you run into this issue I mention above or are you able to reproduce it?