關于CocoStudio中AtlasLabel控件后臺編碼的一點備注

適用版本：CocoStudio 1.4.0.1

我們知道，CocoStudio搭配Cocos2d-x開發是最省力的選擇。但是，要想實現這一點，需要開發者對于示例工作Demo---TestCpp中幾乎所有編碼都要有細致的理解。

問題

在當前的CocoStudio版本中，要實現圖像化顯示數字的一種重要方法就是借助于UI編輯器提供的AtlasLabel控件。這個控件與示例工作Demo---TestCpp中的CCLabelAtlas控件基本是對應的。因此，理解了這里的CCLabelAtlas使用思路，則通過后臺編碼操縱CocoStudio的UI編輯器提供的AtlasLabel控件就非常容易了。

例如，我的UI編輯器提供的AtlasLabel控件設置如下圖所示：

上述控件對應的圖像文件為png格式（其中旋轉的各個字符應該是等寬度的，以便下面使用各個參數獲取之用）。內容為“0123456789”。其中幾個重要參數含義如下：

標簽首字符：要從圖像文件中獲取的第一個字符（其他的字符都以它為起點，因此，這個首字符的確定非常重要，其前面的字符將不會顯示）

• 標簽字符寬：每個圖形字符的寬度

• 標簽字符高：每個圖形字符的高度

• 文本：以后使用控件時要顯示的所有字符的集合（很可能是上述png文件字符內容集合中的一個子集）

技巧：

    在設置上面參數時，特別是調整“標簽字符寬”時，要確保相應控件中要顯示的所有圖形字符都要顯示出來（最好恰好），如上圖心形上面的數字顯示形式。這樣一來，以后通過控件的后臺代碼給控件賦值時，才能保證數字標簽內容正確顯示。

也就是說，上面的參數化設置相當于使用如下后臺代碼初始化了上述控件（FROM FILE ‘UILabelAtlasTest.cpp’）：

        UILabelAtlas* labelAtlas = UILabelAtlas::create();
        labelAtlas->setProperty("1234567890", "cocosgui/labelatlas.png", 17, 22, "0");
        labelAtlas->setPosition(ccp((widgetSize.width) / 2, widgetSize.height / 2.0f));
        
        m_pUiLayer->addWidget(labelAtlas);

上述代碼主要是初始化了控件，至于設置控件的實際文本數據則使用如下代碼：

   //set string value for labelatlas.
    void setStringValue(const std::string& value);

對于我上面使用CocoStudio創建的UI控件，我使用了如下代碼設置它的實際要顯示的數字字符串值：

LabelAtlas* AtlasLabel_1 = static_cast<LabelAtlas*>(ul->getWidgetByName("AtlasLabel_1"));
AtlasLabel_1->setStringValue(CCString::createWithFormat("%d",500)->m_sString);

小結

正確理解UI編輯器中AtlasLabel控件的上述幾個參數的含義至關重要；否則，可能引起后臺代碼的操作混亂，以致于無法正常顯示要顯示的數字串。