Cocos2d-X에서 Admob광고 원하는 위치에 추가하기.

Admob의 광고를 Cocos2d-X를 이용한 게임에서 추가하는 방법은 생각보다 쉽습니다.

하지만 안될때는 정말 잘안되지만 한번만 정상적으로 사용해보시면 다음부터는 정말 쉽게 사용하실수 있을것입니다.

Admob는 개발자에게 광고를 통한 수익을 또는 보유한 어플끼리 크로스마케팅을 통한 추가 다운로드를 유도할 수 도있습니다.

목표 : Admob광고를 원하는 게임의 상태에 따라서 하단의 왼쪽에 또는 중앙에 노출시켜주도록 합니다.

다른 방법들도 참 많이있겠지만 저는 우선 다음과 같은 방법을 이용해서 구현을 했습니다.

일단 gamexml (main.xml)을 다음과 같이 구성합니다.

<?xml version="1.0" encoding="utf-8"?>

<!--

**************************************************************************************

작성일 : 2012-10-19일 

**************************************************************************************

Cocos2d-X에서 GLSurfaceView와 함께 Adview광고를 2개를 사용하고 

NewsBanner를 추가하기 위해서 다음과 같이 Layout을 구성하고 있습니다.

1. GLSurfaceView 사용.

2. NewsBanner 사용.

3. Adview layout 2개 사용.

**************************************************************************************

 -->

 

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"

android:layout_width="fill_parent" android:layout_height="fill_parent">

    <!-- Cocos2d-X에서 사용할 GLSurfaceView 입니다. -->

<LinearLayout android:id="@+id/content"

        android:layout_width="fill_parent"

        android:layout_height="fill_parent">

   <org.cocos2dx.lib.Cocos2dxGLSurfaceView

       android:id="@+id/game_gl_surfaceview"

       android:layout_width="fill_parent"

       android:layout_height="fill_parent"/>

    </LinearLayout>

    

<!-- Cocos2d-X에서 사용할 Adview #1로 하단의 왼쪽에 노출됩니다. -->

    <LinearLayout android:id="@+id/NewsBanner_Admob"

    android:layout_width="wrap_content"

   android:layout_height="wrap_content"

        android:background="#00000000"

        android:orientation="vertical"         

        android:layout_alignParentBottom="true"        

        android:clickable="true"

        android:visibility="visible">

</LinearLayout>

    <!-- Cocos2d-X에서 사용할 Adview #2로 하단의 중앙쪽에 노출됩니다. -->

<FrameLayout android:id="@+id/NewsBanner_AdmobCenter"

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:background="#55000000"       

    android:layout_alignParentBottom="true"

    android:layout_centerHorizontal="true"

    android:layout_centerVertical="true"

        android:weightSum="1"            

        android:clickable="true"

        android:visibility="visible">

    </FrameLayout>        

   

<!-- 게임내에서 사용할 NewsBannner Panel용으로 사용됩니다. -->

    <LinearLayout android:id="@+id/NewsBanner_Panel"

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:background="#00000000"

        android:orientation="vertical"         

        android:layout_alignParentBottom="true"

        android:layout_centerHorizontal="true"

        android:clickable="true"

        android:visibility="gone">

   <!-- NewsBanner상단의 단추입니다. -->

        <ImageView android:id="@+id/NewsBanner_Panel_Button"

            android:layout_width="wrap_content"

            android:layout_height="wrap_content"

        android:layout_gravity="center"   

            android:background="@drawable/newsbanner_button" />

        <!-- NewsBanner네의 실제 베너입니다.-->      

        <ImageView android:id="@+id/NewsBanner_Panel_Image"

            android:layout_width="wrap_content"

            android:layout_height="wrap_content"

        android:layout_gravity="center"               

        android:alpha="0.95"

        android:src="@drawable/newsbanner_default"

            android:background="@drawable/newsbanner_bg" />          

    </LinearLayout>      

</RelativeLayout>

게임소스에서 다음을 추가해줍니다.

AdView는 일단 2개를 선언해서 사용하고있습니다. 그리고 Layout도 2개를 선언했습니다.(한개를 사용하셔도 무관할것으로 보입니다. 하지만 크기가 다른 광고 2개를 사용한다면 이방법을 사용하시면 됩니다.)

//선언

  Handler handler = null;

static AdView adView = null;

static AdView adViewCenter = null;

LinearLayout NBANPAN_ADMOB = null;

FrameLayout NBANPAN_ADMOB_CENTER = null;

  int ADMon_Align = 0; //0일 경우 왼쪽, 1일 경우에는 중앙, 2일 경우에는 오른쪽으로 정한다.

protected void onCreate(Bundle savedInstanceState)

{

....생략

            //생성

        NBANPAN_ADMOB = (LinearLayout)findViewById(R.id.NewsBanner_Admob);

NBANPAN_ADMOB_CENTER = (FrameLayout)findViewById(R.id.NewsBanner_AdmobCenter);

        handler = new Handler();

        }

다음 함수를 이용해서 광고를 출력 또는 숨김을 할수 있다.

광고를 노출시키는 함수 : showADMobBanner();

광고를 숨겨주는 함수 : hideADmobBanner();

void showADMobBanner()

{

//광고 노출시켜줍니다. 한번만 생성되도록 하고 loadAd함수는 원하는 주기로 호출을 해도 됩니다.

if(adView == null)

{

adView = new AdView(SWATandZombie.this, AdSize.BANNER, "My Admob ID");  

NBANPAN_ADMOB.addView(adView, new LayoutParams(LayoutParams.FILL_PARENT,LayoutParams.WRAP_CONTENT));  

adView.loadAd(new AdRequest());

 

adViewCenter = new AdView(SWATandZombie.this, AdSize.BANNER, "My Admob ID");  

NBANPAN_ADMOB_CENTER.addView(adViewCenter, new LayoutParams(LayoutParams.FILL_PARENT,LayoutParams.WRAP_CONTENT));  

adViewCenter.loadAd(new AdRequest());  

}

// 게임의 상태에 따라서 광고의 위치를 다르게 해야할때 Align변수를 이용하시기 바랍니다.

if(ADMon_Align == 0)

{

NBANPAN_ADMOB_CENTER.setVisibility(LinearLayout.GONE);

NBANPAN_ADMOB.setVisibility(LinearLayout.VISIBLE);

}

else

{

NBANPAN_ADMOB_CENTER.setVisibility(LinearLayout.VISIBLE);

NBANPAN_ADMOB.setVisibility(LinearLayout.GONE);             

}

}

void hideAdMobBanner()

{

NBANPAN_ADMOB_CENTER.setVisibility(LinearLayout.GONE);

NBANPAN_ADMOB.setVisibility(LinearLayout.GONE);       

}

다음은 Cocos2d-X의 Native함수에서 다음을 호출하면 됩니다. Handler를 이용해서 다음과 같이 호출해주면 에러없이 실행됩니다. show와 hide를 적절하게 호출하면 됩니다.

    /*****************************************************************************

     * 외부 Ad서비스의 광고배너를 보여준다. 

     * @param align

     *****************************************************************************/

    void Native_ShowBanner(int align)

    {

    ADMon_Align = align;

        Runnable runnable = new Runnable() {

            @Override

            public void run() {

                handler.post(new Runnable() { // This thread runs in the UI

                    @Override

                    public void run() {

                    showADMobBanner();

                    }

                });

            }

        };

        new Thread(runnable).start();        

    }

하단 왼쪽에 Admob추가 예

하단 중앙에 Admob추가 예

매일같이 어플 개발하시느라 고생많으신 개발자분들에게 조금이나마 도움이 되셨으면 합니다.