Lab

Cocos2d-x:テーブルのセルがフォーカスされた時の処理

 Tag :  Published : 2014-3-22

Pocket

tableCellHighlight、tableCellUnhighlightを使用します。
テーブルのセルがフォーカスされた時、またはフォーカスが外れた時の処理を設定します。
> Ver3.x : 『テーブルのセルがフォーカスされた時の処理』はこちら

テーブルの作成

テーブルを作成します。
テーブルの基本的な作成に関してはこちらのページをどうぞ。

cocos2d-x テーブルを作成

各セルの内容は、グレーの背景に白い文字、セル下のボーダーです。
うち、背景にはタグを設定しています。

CCTableViewCell* HelloWorld::tableCellAtIndex(CCTableView *table, unsigned int idx){
    CCTableViewCell *cell = table->dequeueCell();
    cell = new CCTableViewCell();
    cell->autorelease();
    
    CCSize s = CCDirector::sharedDirector()->getWinSize();
    
    // セルの背景
    CCSprite* bg = CCSprite::create();
    bg->setAnchorPoint(ccp(0, 0));
    bg->setTextureRect(CCRectMake(0, 0, s.width, 100));
    bg->setColor(ccc3(190, 190, 190));
    bg->setTag(100); //タグ設定
    cell->addChild(bg);
    
    // テキスト
    CCString *text = CCString::createWithFormat("Line %d", idx);
    CCLabelTTF *label = CCLabelTTF::create(text->getCString(), "Arial", 40);
    label->setAnchorPoint(CCPointZero);
    label->setPosition(ccp(10, 30));
    label->setColor(ccWHITE);
    cell->addChild(label);
    
    // ボーダーライン
    CCSprite* line = CCSprite::create();
    line->setAnchorPoint(ccp(0, 0));
    line->setTextureRect(CCRectMake(0, 0, s.width, 1));
    line->setColor(ccWHITE);
    cell->addChild(line);

    return cell;
}
    

セルがフォーカスされた時(tableCellHighlight)

セルがタップされたとき、白背景がグレーに、グレーの文字が白になるようにします。
先ほど設定したタグを利用してそれぞれにアクセスし、色を変更します

cocos2d-x セルがフォーカスされた時
void HelloWorld::tableCellHighlight(CCTableView* table, CCTableViewCell* cell)
{
    //背景色の変更
    CCSprite* bg = (CCSprite*)cell-> getChildByTag(100);
    bg->setColor(ccc3(150, 150, 150));
}
    

セルのフォーカスがはずれた時(tableCellUnhighlight)

これだけだと、色が変わったままになってしまうので、タップ後元に戻るようにします。

void HelloWorld::tableCellUnhighlight(CCTableView* table, CCTableViewCell* cell)
{
    //背景色を元に戻す
    CCSprite* bg = (CCSprite*)cell-> getChildByTag(100);
    bg->setColor(ccc3(190, 190, 190));
}
    

pageTop