Lab

Cocos2d-x v3:ボタンの作成(画像)

 Tag :  Published : 2014-9-8

Pocket

MenuItemImage、Menuを使用します。
デフォルト時とタップ時で画像が切り替わり、タップされた時にログが出るようなボタンを作成します。
> Ver2.x : 『ボタンの作成(画像)』はこちら

1. ボタンの作成(MenuItemImage、Menu)

デフォルトでは1.png、タップ時に2.pngが表示されるボタンを作成します。

cocos2d-xのボタンデフォルト
デフォルト

cocos2d-xのボタンタップ時
タップ時

    //画面サイズを取得
    Size s = Director::getInstance()->getVisibleSize();
    
    //メニューアイテムイメージの作成
    //1.png->デフォルトの画像 2.png->タップ時の画像 HelloWorld::myCallback->押した後の動作
    auto pBtnItem = MenuItemImage::create("1.png", "2.png", CC_CALLBACK_1(HelloWorld::myCallback, this));

    //メニューの作成 pMenuの中にpBtnItemを入れる
    Menu* pMenu = Menu::create(pBtnItem, NULL);
    
    //pMenuを画面中央に配置
    pMenu->setPosition(Vec2(s.width*.5, s.height*.5));
    this->addChild(pMenu);
    

2. タップ時のコールバックを作成

myCallbackを作成します。
タップするとログを返します。

void HelloWorld::myCallback(Ref* pSender)
{
    log("タップされました。");
}
    

3. 他の書き方

先ほどと同じ内容ですが、別の書き方です。

    //画面サイズを取得
    Size s = Director::getInstance()->getVisibleSize();

    auto pBtnItem = MenuItemImage::create(
        "1.png",
        "2.png",
        [this](Ref *pSender){
            log("タップされました。");
        }
    );
    
    //メニューの作成 pMenuの中にpBtnItemを入れる
    Menu* pMenu = Menu::create(pBtnItem, NULL);
    
    //pMenuを画面中央に配置
    pMenu->setPosition(Vec2(s.width*.5, s.height*.5));
    this->addChild(pMenu);
    

pageTop