Google AdWhirl with Vpon

(2012-07-20 更新)前面幾篇小蛙陸續介紹了Google AdWhirl串接kuAD, AdMob，以及單獨使用AdMob(單獨使用Vpon或kuAD只要直接下載匯入範例就可以囉！)，今天要來記錄Google AdWhirl with Vpon，算是三者之中最麻煩的。

由於Vpon會需要用到QRCode讀取套件，因此將Vpon導入Android App中會有比kuAD, AdMob更多步驟，小蛙在導入Vpon的時候發生了很多怪怪的問題，包括了type 17錯誤(已經分不清楚是AdWhirl還是Vpon的錯誤了)，就算直接用Sample Code修改adOnKey也還是沒辦法顯示(adOnKey在官網上的顯示是「版位ID」或是英文界面的叫「Banner ID」)，小蛙弄到三更半夜還是沒辦法顯示，即使官網上狀態已經顯示「運作中」。今天來記錄一下Google AdWhirl + Vpon。
Vpon註冊及設定部份由於都是中文也還蠻簡單的，這部份小蛙就跳過，如果在註冊上有遇到任何問題也可以直接留言給小蛙，Google AdWhirl設定也跟串接kuAD的時候差不多，只是Function name把它改成容易辨識的名稱，例如：kuAD小蛙取「showKuAD」，就以此類推地把Vpon取名叫做「showVpon」吧！(再次強調這篇使用的是Google AdWhirl)
Vpon AdWhirl比Google AdWhirl多了一個「地區判斷」的功能，因為Vpon是以在地化廣告為宣傳，因此Vpon團隊在AdWhirl中加入了台灣地區及大陸地區的判斷，如果使用者在台灣就會撥放台灣的廣告，反之亦然。由於剛開始串接Vpon的時候遇到了很多奇奇怪怪的問題，因此小蛙使用Google AdWhirl，但新版Vpon AdWhirl應該已經做了修正，如果有兩岸廣告撥放需求的朋友，可以直接使用Vpon AdWhirl來做串接，官方文件提供了詳細的說明。
強烈建議在串接AdWhirl之前，先下載Vpon官方範例程式，修改adOnKey之後跑跑看，如果廣告都沒出現的話，就不用串接了！是不會成功的！使用Vpon AdWhirl串接的朋友可以參考以下方法：

1. 註冊Vpon帳號及Vpon AdWhirl帳號(這跟Google AdWhirl不同)
2. 在Vpon AdWhirl中新增應用程式(參考AdWhirl with AdMob by Google步驟5)
3. 下載最新版的Vpon套件及範例程式。可以在Vpon + AdWhirl SDK中找到。
4. 解壓縮後，把專案匯入到Eclipse中(匯入方式請參考Eclipse匯入專案)。小蛙測試時的版本為「android-sdk-adwhirl-3.0.3n」，匯入時選擇「adOnSample_withAdapters」資料夾。
5. 將com.android.vpon.addon.AdOnSampleActivity.java中的String adWhirlKey = “ChangeMe“;修改成步驟2得到的SDK Key
6. 直接在手機或模擬器上測試就完成了！

上面測試沒有問題才繼續以下部份。下面的步驟紀錄串接Google AdWhirl + Vpon。

1. 將上面專案中res/values下的attrs.xml, colors.xml, ids.xml, strings.xml複製到自己專案下，要注意檔案覆蓋問題，保險起見可以開啟這些檔案，例如：開啟strings.xml並複製裡面內容貼到自己的strings.xml。途中有錯誤都先別理它，最後再處理。(2012-07-20 更新)感謝網友ws提醒，要把layout下的capture.xml也複製到自己專案下的layout資料夾裡。
   
2. 用WinRAR分別開啟Google AdWhirl及Vpon AdWhirl，這個目的是要把Vpon的adapter抓到Google AdWhirl中使用(直接把com\adwhirl\adapters\AdOnCNAdapter.class, AdOnTWAdapter.class拉到Google AdWhirl中)。
   
3. 將必須的JAR加入Java Build Path中(kuAD, GoogleAdMobAdsSdk如果沒使用可以不用理它們)。
   
4. 在AndroidManifest.xml中加入以下user permission。

   <uses-permission android:name="android.permission.INTERNET" />
   <uses-permission android:name="android.permission.READ_PHONE_STATE"/>
   <uses-permission android:name="android.permission.ACCESS_COARSE_LOCATION"/>
   <uses-permission android:name="android.permission.ACCESS_FINE_LOCATION"/>
   <uses-permission android:name="android.permission.ACCESS_WIFI_STATE" />
   <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
   <uses-permission android:name="android.permission.CAMERA"/>
   <uses-feature android:name="android.hardware.camera" />
   <uses-feature android:name="android.hardware.camera.autofocus" />

5. 在AndroidManifest.xml中加入以下activity，要放在<application></application>之間。

   <activity android:name="com.vpon.adon.android.WebInApp"
       android:configChanges="orientation|keyboardHidden|navigation|keyboard"
       android:label="@string/app_name"/>
       <activity android:name="com.vpon.adon.android.CrazyAdRun"
           android:configChanges="orientation|keyboardHidden|navigation|keyboard"
           android:label="@string/app_name"
           android:theme="@android:style/Theme.Translucent" />
       <activity android:name="com.vpon.adon.android.webClientHandler.QRActivity"
           android:finishOnTaskLaunch = "true"
           android:clearTaskOnLaunch = "true"
           android:configChanges="keyboardHidden|navigation|keyboard" />
       <activity android:name="com.vpon.adon.android.webClientHandler.ShootActivity"
           android:finishOnTaskLaunch = "true"
           android:clearTaskOnLaunch = "true"
           android:configChanges="keyboardHidden|navigation|keyboard" />
       <activity android:name="com.google.zxing.client.android.HelpActivity"
           android:finishOnTaskLaunch = "true"
           android:clearTaskOnLaunch = "true"
           android:configChanges="keyboardHidden|navigation|keyboard" />
       <activity android:name="com.google.zxing.client.android.CaptureActivity"
           android:finishOnTaskLaunch = "true"
           android:clearTaskOnLaunch = "true"
           android:configChanges="orientation|keyboardHidden"
           android:screenOrientation="landscape"
           android:theme="@android:style/Theme.NoTitleBar.Fullscreen"
           android:windowSoftInputMode="stateAlwaysHidden">
               <intent-filter>
                   <action android:name="com.google.zxing.client.android.SCAN"/>
                   <category android:name="android.intent.category.DEFAULT"/>
               </intent-filter>
       </activity>
       <!-- kuad 的，沒用到kuad的話要拿掉 -->
       <activity android:name="com.kuad.ADDisplay"/>
       <!-- AdMob的 -->
       <activity android:configChanges="keyboard|keyboardHidden|orientation|screenLayout|uiMode|screenSize|smallestScreenSize"
           android:name="com.google.ads.AdActivity" />

6. 將上面專案中src下除了com.android.vpon.adon以外的package全部複製下來。
   
7. 在自己專案中的src下貼上。
   
8. 有幾個package及檔案會出現紅色叉叉。
   
9. 開啟有紅色叉叉的檔案，置換.R檔的正確位置(自己主要專案的package)

   //import com.android.vpon.adon.R; //change import
   import com.hans.adwhirl.R;

10. 確定都沒有紅色叉叉後，加入呼叫AdWirl程式碼。

    package com.hans.adwhirl;
    import com.adwhirl.AdWhirlLayout;
    import com.adwhirl.AdWhirlManager;
    import com.adwhirl.AdWhirlTargeting;
    import com.adwhirl.AdWhirlLayout.AdWhirlInterface;
    import com.adwhirl.AdWhirlLayout.ViewAdRunnable;
    import com.adwhirl.util.AdWhirlUtil;
    import com.kuad.KuBanner;
    import com.kuad.kuADListener;
    import com.vpon.adon.android.AdListener;
    import com.vpon.adon.android.AdOnPlatform;
    import com.vpon.adon.android.AdView;
    import android.app.Activity;
    import android.os.Bundle;
    import android.util.Log;
    import android.widget.LinearLayout;
    import android.widget.LinearLayout.LayoutParams;
    public class TestAdWhirlActivity extends Activity implements AdWhirlInterface {
        AdWhirlLayout adWhirlLayout;
        private static final String ADWHIRL_KEY		= "換成自己的Google AdWhirl Key";
        @Override
        public void onCreate(Bundle savedInstanceState) {
            super.onCreate(savedInstanceState);
            setContentView(R.layout.main);
            // 預留放置廣告的layout
            LinearLayout layout = (LinearLayout)findViewById(R.id.mainLayout);
            // 初始化 adwhirl layout
            adWhirlLayout = new AdWhirlLayout(this, ADWHIRL_KEY);
            AdWhirlManager.setConfigExpireTimeout(1000 * 60);
            // 年齡
            AdWhirlTargeting.setAge(23);
            // 性別
        	AdWhirlTargeting.setGender(AdWhirlTargeting.Gender.MALE);
        	// 郵遞區號
        	AdWhirlTargeting.setPostalCode("115");
        	// 是否為測試模式，上架時要改成false
        	AdWhirlTargeting.setTestMode(true);
        	// 這行千萬不可以漏掉
        	adWhirlLayout.setAdWhirlInterface(this);
        	// 將 adwhirl layout 放入我們預留的顯示廣告的 layout 中
        	layout.addView(adWhirlLayout);
        }
        @Override
        public void adWhirlGeneric() {
    	// TODO Auto-generated method stub
        }
        public void showVpon(){
    	AdView adView = new AdView(this);
    	adView.setLicenseKey("Vpon Banner ID 輸入在這邊(版面ID)", AdOnPlatform.TW, false);
    	adView.setAdListener(new AdListener() {
        	    @Override
                public void onRecevieAd(AdView adView) {
        	        Log.d(AdWhirlUtil.ADWHIRL, "Vpon ad success");
                    adWhirlLayout.adWhirlManager.resetRollover();
    	        adWhirlLayout.handler.post(new ViewAdRunnable(adWhirlLayout, adView));
    	        adWhirlLayout.rotateThreadedDelayed();
    	    }
    	    @Override
    	    public void onFailedToRecevieAd(AdView adView) {
                    Log.d(AdWhirlUtil.ADWHIRL, "Vpon ad failure");
    	        adView.setAdListener(null);
    	        adWhirlLayout.rollover();
    	    }
            });
        }
        // for kuAD
        /*
        public void showKuAD(){
            Log.e("showKuAD", "showKuAD()");
    	final KuBanner banner = new KuBanner(this);
    	banner.setAPID("如果有用kuAD的話，kuAD的APID");
    	banner.setLayoutParams(new LayoutParams(LayoutParams.FILL_PARENT, LayoutParams.WRAP_CONTENT));
    	banner.setkuADListener(new kuADListener() {
    	    @Override
    	    public void onRecevie(String arg0) {
    	        Log.e("onRecevie", "onRecevie -> " + arg0);
    		adWhirlLayout.adWhirlManager.resetRollover();
    		adWhirlLayout.handler.post(new ViewAdRunnable(adWhirlLayout, banner));
    		adWhirlLayout.rotateThreadedDelayed();
    	    }
    	    @Override
    	    public void onFailedRecevie(String arg0) {
    		Log.e("onFailedRecevie", "showKuAd -> " + arg0);
    		banner.setkuADListener(null);
    		adWhirlLayout.rollover();
    	    }
            });
        }
    }

11. 可以丟到模擬器或手機上執行囉！