'CCMenu padding'에 해당되는 글 1건

  1. 2011.09.09 안드로이드 cocos2d 예제 분석강좌 - 세번째- (메뉴 MenuTest.class)
자 이번엔.menuTest.java 의 마지막 시간이 될듯합니다. 

Layer2 클래스에 대해서 알아보죠  

아래는 전체 소스 입니다. 

 
결과 물입니다.  


첫번째는 가로 정렬 
두번째는 about버튼을 눌렀을때 나타나는 화면입니다.

간단히 이야기 하자면 메뉴 2개 만들어서 가로 정렬 해보고 세로정렬 해봤습니다. 
그럼 일단 메뉴2개를 만들어보죠 

public static final int kTagMenu = 1;

public Layer2() {

   super();

      for( int i=0;i < 2;i++ ) {

         CCMenuItemImage item1 = CCMenuItemImage.item("btn-play-normal.png", "btn-play-selected.png", this, "menuCallbackBack");

         CCMenuItemImage item2 = CCMenuItemImage.item("btn-highscores-normal.png", "btn-highscores-selected.png", this, "menuCallbackOpacity");

         CCMenuItemImage item3 = CCMenuItemImage.item("btn-about-normal.png", "btn-about-selected.png", this, "menuCallbackAlign");

  item1.setScaleX(1.5f);

         item2.setScaleY(0.5f);

         item3.setScaleX(0.5f);

         CCMenu menu = CCMenu.menu(item1, item2, item3); 

               menu.setTag(kTagMenu); 

               addChild(menu, 0, 100+i);

               centeredMenu = menu.getPosition();

        } 

     alignedH = true;

     alignMenusH();
}
생성자에서 만들었네요
CCMenuItemImage 를 이용해서 이미지버튼을 3개 만들고 
각 버튼의 크기를 셋팅합니다.
첫번째 CCMenuItemImage는 원래 사이즈에서 가로 1.5배 
두번째 CCMenuItemImage는 원래 사이즈에서 세로를 0.5배 
세번째 CCMenuItemImage는 원래 사이즈에서 가로 0.5배

이버튼들을 Menu에 넣었습니다. 그리고 수평정렬 함수를 호출합니다.
centeredMenu의 값은 ( 0 , 0 )  입니다 앵커의값이죠 
갤럭시 기준으로 하면 480 800  인니까 240 에 400 이 되겟네요 

------------------2011년 9월 10일 추가 내용 TAG--------------------
제가  이부분을 깝빡 했네요 

menu.setTag(kTagMenu); 
addChild(menu, 0, 100+i);
태그는 말그대로 꼬리표입니다.
안드로이드에서는 View클래스에 id 를 할당합니다.
그 아이디를 기반으로 R.java 클래스 변수로 등록되고 액티비티
어디에서든 접근 가능합니다.

그럼 cocos2d에 대한 구분자는 어떻게 할까요 ?
바로 TAG입니다  

안드로이드 id는  유일한 값입니다 이는 어플리케이션 package에서 관리
하기때문입니다.
그럼 cocos2d에서는 tag는 어디서 관리할까요?
바로 자기 자신이 관리 합니다. 
그럼 으로서 활용방법은 2가지 입니다. 
Node의 독립성을 확보하기 위해 각기 고유 코드값으로 줄수도 있고
분류를 위한  비슷한 역활을 하는 Node들에서 공통의 값을 줄수도 있습니다.(2011년 9월 26일 수정)

바로 부모 CCNode에서 관리합니다.

결국 이말은 부모만 다르다면 같은 TAG 값을 가져도 됩니다. 이명제의 대우는 무엇일까요? 
같은 부모를 가지는 CCNode는 서로 다른 값을 가져야 한다는 말과 같습니다. 즉 유니크 해야 한다는거죠 ㅎㅎㅎ
Tag에 대해서 간단히 살펴 보았습니다.

헷살리는 분이 있으시면 댓글로^^;

-------------------------------------------------------------



자그럼 수평정렬 함수를 확인해보겟습니다.

public void alignMenusH() {

    for(int i=0;i<2;i++) {

       CCMenu menu = (CCMenu) getChildByTag(100+i);

       menu.setPosition(centeredMenu);

       if(i==0) {

           // TIP: if no padding, padding = 5

           menu.alignItemsHorizontally();              

           final CGPoint p = menu.getPositionRef();

           menu.setPosition(CGPoint.ccpAdd(p, CGPoint.ccp(0,30)));

       } else {

           // TIP: but padding is configurable

           menu.alignItemsHorizontally(40);

           final CGPoint p = menu.getPositionRef();

           menu.setPosition(CGPoint.ccpSub(p, CGPoint.ccp(0,30)));

       }

   }
}

메뉴를 불러와서 하나는 CCMenu 에 있는 MenuItem 간의 간격이 을 결정합니다. 
디폴트로 5가 삽입되어있구요  밑에는 40이라는 상수 값을 주었네요 .
menu.setPosition(CGPoint.ccpAdd(p, CGPoint.ccp(0,30)));
menu.setPosition(CGPoint.ccpSub(p, CGPoint.ccp(0,30))); 

그리고 위에는 센터에서 y좌표값이 +30 이니까 화면에서 위로 올라 가겟고 
아래는 센터에서 30 내려 가는 것이니까 화면에서 내려 가겟네요 ^^;


수직정렬도 이와 거의 똑같습니다. 
 public void alignMenusV() {

    for(int i=0;i<2;i++) {

       CCMenu menu = (CCMenu) getChildByTag(100+i);

       menu.setPosition(centeredMenu);

       if(i==0) {

           // TIP: if no padding, padding = 5

           menu.alignItemsVertically();              

           final CGPoint p = menu.getPositionRef();

           menu.setPosition(CGPoint.ccpAdd(p, CGPoint.ccp(100,0)));

       else {

           // TIP: but padding is configurable

           menu.alignItemsVertically(40);

           final CGPoint p = menu.getPositionRef();

           menu.setPosition(CGPoint.ccpSub(p, CGPoint.ccp(100,0)));

       }

   }
}

 이정도야 머 쉽죠이 ㅎ.ㅎ 

자 마지막으로  콜백에서 볼만한게 있는지 확인해볼까요?

public void menuCallbackBack (Object sender) {

     ((CCMultiplexLayer)getParent()).switchTo(0);

}
이거는 이미 한번 했고 레이서 순서 바꾸기 


public void menuCallbackOpacity (Object sender) {

     CCMenuItem item = (CCMenuItem)sender;

     CCMenu menu = (CCMenu)item.getParent();

     int opacity = menu.getOpacity();

     if (opacity == 128)

         menu.setOpacity((byte) 255);

     else

         menu.setOpacity((byte) 128);     
}
opacity 는 불투명도는 나타내죠 그런데 255로 변화 시키니까 아에 안보이고
이벤트도 안먹네요  흠... 이벤트 안먹히고 이건 따로 한번 알아 볼께요 
사라지는것 까지는 이해 했는데 이벤트라 ... 아시는분 댓글좀^^;; 

public void menuCallbackAlign (Object sender) {

     alignedH = ! alignedH;

     if( alignedH )

         alignMenusH();

     else

         alignMenusV();

}
기건머 2말 할필요없죠 ^^





자 그럼 여기까지가 . Layer2엿습니다.


여기서 새롭게 알게 된거는

1.
CCMenuItem 할 때 크기를 따로 지정한다

 item1.setScaleX(1.5f);

2.CCNode 의 TAG
 CCNode는 자식간의 구별과 접근 용이성을 높이기 위해 TAG을 할당한다. 입니다. 

3.CCMenu 수직 수평 정렬할때 padding값을 주어서 간격을
 조절한다.

 menu.alignItemsVertically(40);
 menu.alignItemsHorizontally(40);

딸랑 요거 하나네요 .

Posted by 수다쟁이증후군 :