cocos2d-x-3.0學習筆記之如何設置滾動菜單欄

除了做普通的菜單欄之外,同樣也可以利用TableView設計一個滾動的菜單欄,譬如是做關卡選擇或者是角色選擇的時候,需要一張稍大的圖片來展示額外的信息。此時利用滾動菜單就能很好的解決這個問題。
要實現上述功能,我們應當先了解這四個類
TabelView -用於響應觸摸事件,判斷觸摸位置
TableViewCell - 用於表示TableView中單元格的抽象類(注:此處沒有純虛函數,實際爲普通基類,不能算抽象類)
TableViewDataSource - 用於管理表格後端數據的數據源
TableViewDelegate - 代理TabelView 觸摸事件

實現步驟:
1.自己實現TableViewDataSource 類

class MyDataSource : public  TableViewDataSource
{
public:
      //創建一個數組用來保存需要的菜單
    Array *m_cells;
    MyDataSource()
    {
        m_cells = Array::create();
        m_cells->retain();
        //循環創建n個TableView中單元格(即我們需要的菜單)
        for (int i = 0; i < n; i++)
        {
            //創建TableView中單元格
            TableViewCell *cell = new TableViewCell;
            //cell->init();
            cell->autorelease();
            //將創建的單元格加到Array數組中
            m_cells->addObject(cell);

            //創建精靈顯示內容
            String str = "xxx"+(i+1)+".png";
            Sprite *sprite = Sprite::create(str)
            //將實物精靈添加到單元格
            //此時的cell才代表一個菜單選項
            cell->addChild(sprite);

         //設置精靈位置
         sprite->setPosition(Point(winSize.width / 2, 
                winSize.height / 2));

        }
    }
    ~MyDataSource()
    {
        m_cells->release();
    }

    //重載TableViewDataSource類的虛函數
    virtual Size cellSizeForTable(TableView *table) {
        return winSize;
    };

    virtual TableViewCell* tableCellAtIndex(TableView *table, ssize_t idx)
    {
        return (TableViewCell*)m_cells->objectAtIndex(idx);
    }

    virtual ssize_t numberOfCellsInTableView(TableView *table)
    {
        return m_cells->count();
    }
};

2.重寫TableView類響應觸摸事件

#ifndef __MyTabelView_H__
#define __MyTabelView_H__

class MyTabelView : public TableView
{
public:

    static MyTabelView *create(TableViewDataSource *source,Size size);

    virtual void onTouchEnded(Touch *pTouch, Event *pEvent);


};

.cpp文件


#include "MyTabelView.h"

MyTabelView * MyTabelView::create(TableViewDataSource *source, Size size)
{
    MyTabelView *table = new MyTabelView;

    //初始化
    table->initWithViewSize(size, NULL);
    table->autorelease();
    table->setDataSource(source);
    table->_updateCellPositions();
    table->_updateContentSize();


    return table;
}

void MyTabelView::onTouchEnded(Touch *pTouch, Event *pEvent)
{
    if (!this->isVisible()) {
        return;
    }
    if (_touchedCell){
        //判斷pTouch是否點擊了m_pTouchedCell這個格子裏的精靈,如果點中了精靈,才調用
        Vector<Node *> vec = (Vector<Node *>) _touchedCell->getChildren();

        Sprite *sprite = (Sprite*)vec.at(0);
        Rect rcSprite = sprite->boundingBox();
        Point ptInWorld = pTouch->getLocation();
        Point ptInCell = _touchedCell->convertToNodeSpace(ptInWorld);

        if (/*bb.containsPoint(pTouch->getLocation()) &&*/
            rcSprite.containsPoint(ptInCell) && _tableViewDelegate != NULL)
        {
            _tableViewDelegate->tableCellUnhighlight(this, _touchedCell);
            _tableViewDelegate->tableCellTouched(this, _touchedCell);
        }

        this->_touchedCell = NULL;
    }
    ScrollView::onTouchEnded(pTouch, pEvent);

}

3.讓需要實現滾動菜單的Layer繼承TableViewDelegate代理

class LayerMenu : public Layer,public TableViewDelegate
{
public:
    CREATE_FUNC(LayerMenu);

    void onEnter();
    void onExit();
    void Back(Object *);
    void addScrollViewMenu();

public:
    //添加MyDataSource 和MyTabelView 成員變量
    MyDataSource *m_dataSource;
    MyTabelView *m_table;

    //重載TableViewDelegate虛函數
    virtual void tableCellTouched(TableView* table, TableViewCell* cell);

    //重載ScrollView的虛函數
    virtual void scrollViewDidScroll(ScrollView* view)
    {
    }

    virtual void scrollViewDidZoom(ScrollView* view)
    {}
};

4.實現添加滾動菜單的函數,並加入觸摸響應的操作

void LayerMenu::addScrollViewMenu()
{
    m_dataSource = new MyDataSource();
    MyTabelView *view = MyTabelView::create(m_dataSource, winSize);
  //將滾動菜單添加到Layer
    this->addChild(view);
view->setDirection(ScrollView::Direction::HORIZONTAL);
    //加載資源
    view->reloadData();
    //將自己設爲代理
    view->setDelegate(this);

}

void LayerMenu::tableCellTouched(TableView* table, TableViewCell* cell)
{
    int index = cell->getIdx();
    //得到點擊的爲哪一個菜單選項,
    //用它做一些額外操作
    //例如進入到對應的遊戲場景

}
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章