以前にも同じ内容のブログの記事を書いたのですが、音量を「ON」「OFF」のように切り替えられるボタンの作成方法を案内します。 cocos2dxのバージョンが上がり、コードも変わっていましたので、もしお困りの方がいましたら参考にしていただけると嬉しいです。
【以前の記事】
「ON」「OFF」ボタンを実装する
今回もMenuItemToggleクラスを利用して作成します。
ボタンを用意
まずは、MenuItemToggleクラスで利用するMenuItemクラスを用意します。 今回は、MenuItemSpriteクラスを利用しますが、他のクラスでも同じようにできると思います。 [c] //Spriteを用意 auto image1 = Sprite::create("info-on-button.png"); auto image2 = Sprite::create("info-on-button-hover.png");
//MenuItemSpriteクラスを作成 auto item1 = MenuItemSprite::create(image1, image1); auto item2 = MenuItemSprite::create(image2, image2);
[/c]
バージョン3.xでは、1つのToggleに2つのMenuItemクラスが必要でした。 同じSpriteを利用していますが、ボタンを押した際に画像を変える場合は、第二引数に別の画像を利用して下さい。
Toggleボタンの作成
先ほど用意したMenuItemクラスを利用してToggleボタンを作ります。 ここで、MenuItemToggleクラスが出てきます。 [c]
auto menuToggle1 = MenuItemToggle::createWithCallback(CC_CALLBACK_1(ToggleLayer::menuAction,this), item1,item2,NULL);
void InfoLayer::menuAction(Ref *sender){
CCLOG("hogehoge");
}
//ラムダ式を利用する場合 auto menuToggle1 = MenuItemToggle::createWithCallback({
CCLOG("hogehoge");
}, item1,item2,NULL);
[/c]
このような感じで作成をします。 後は通常のMenuクラス同様です。 [c] //Menuクラスを作成 auto menu = Menu::create(menuToggle1,NULL); menu->setPosition(Point::ZERO); addChild(_menu); [/c]
その他
これで、Toggleボタンは作成できますが、実際に利用するにはもう少し工夫が必要です。
Toggleボタンを押された状態にする
すでに、ボタンが押されている状態にするいは以下のコードを利用します。 [c] //item1,item2の順に追加する auto menuToggle1 = MenuItemToggle::createWithCallback(CC_CALLBACK_1(ToggleLayer::menuAction,this), item1,item2,NULL);
//Toggleをitem2の画像にする場合 menuToggle1->setSelectedIndex(1);
[/c]
MenuItemクラスを指定することで、事前にボタンの画像を変えることができます。 例えば、音量を以前に「OFF」にしている場合は、フラグを使って「OFF」から始めることができます。
「ON」「OFF」の判断
これは、先ほどのように何番目の画像が今、表示されているかを調べます。 [c]
if(menuToggle1->getSelectedIndex() != 0){
menuToggle1->setSelectedIndex(1);
} [/c]
このようにif文を使えば判別ができます。
最後に
バージョンが変わったので、Toggleボタン、最初は全然上手くいきませんでしたが、色々と調べるうちに、何とかできようになりました。 使ってみると、Toggleボタンとしてではなく、その他の使い方もあるのではないかと思いました。