CocosStudio UI组件使用大全Cocos2d-x3.2使用

最新推荐文章于 2022-02-09 21:34:11 发布
最新推荐文章于 2022-02-09 21:34:11 发布
阅读量1.4k 收藏 1
点赞数
分类专栏： Cocos2D-x开发

CocosStudio UI组件


按钮UIButton
复选框UICheckBox
滑块UISlider
图片UIImageView
进度条UILoadingBar
纹理文本 UITextAtlas
字体文本 UIText
图片字体文本 UITextBMFont
文本区域 UITextField
布局组件 UILayout
滚动组件 UIScrollView
页面切换组件 UIPageView
列表组件   UIListView
所有控件都继承 UIWidget
可以通过addChild()添加UIWidget类型的节点
可以通过addRender()添加CCNode类型的节点
一、使用方法
1.1 在解决方案中添加项目并添加引用
libCocostudio
libGui
libExtensions
1.2 在项目中引用以下2个头文件
#include "extensions/cocos-ext.h"
#include "ui/CocosGUI.h"
USING_NS_CC;
using namespace ui;
1.3 使用CocosStudio UI编辑器或直接通过代码定义组件对象
二、各组件使用详解
2.1.UIButton
   2.1.1 按钮对象的创建
        // 创建按钮 button
        Button* button = Button::create("cocosui/animationbuttonnormal.png",
                                        "cocosui/animationbuttonpressed.png");
        //设置坐标
        button->setPosition(Point(widgetSize.width / 2.0f, widgetSize.height / 2.0f));
        //添加事件
        button->addTouchEventListener(this, toucheventselector(UIButtonTest::touchEvent));
        //添加到图层
        _uiLayer->addChild(button);
    2.1.2 事件处理方法：
void UIButtonTest::touchEvent(Ref *pSender, TouchEventType type)
{   switch (type)
    {   case TOUCH_EVENT_BEGAN:
            _displayValueLabel->setText(String::createWithFormat("Touch Down")->getCString());
            break;            
        case TOUCH_EVENT_MOVED:
            _displayValueLabel->setText(String::createWithFormat("Touch Move")->getCString());
            break;            
        case TOUCH_EVENT_ENDED:
            _displayValueLabel->setText(String::createWithFormat("Touch Up")->getCString());
            break;            
        case TOUCH_EVENT_CANCELED:
            _displayValueLabel->setText(String::createWithFormat("Touch Cancelled")->getCString());
            break;
        default:
            break;
    }
    
}  
   2.1.3 使用9Path图片
    // Create the button
        Button* button = Button::create("cocosui/button.png", "cocosui/buttonHighlighted.png");
        // open scale9 render
        button->setScale9Enabled(true);
        button->setCapInsets(Rect(5,5,15,15));
        button->setPosition(Point(widgetSize.width / 2.0f, widgetSize.height / 2.0f));
        button->setSize(Size(150, 70));
        button->addTouchEventListener(this, toucheventselector(UIButtonTest_Scale9::touchEvent));
        _uiLayer->addChild(button);
   2.1.4 实现PressedAction效果
         // Create the button
        Button* button = Button::create("cocosui/animationbuttonnormal.png", "cocosui/animationbuttonpressed.png");
        button->setPressedActionEnabled(true);
        button->setPosition(Point(widgetSize.width / 2.0f, widgetSize.height / 2.0f));
        button->addTouchEventListener(this, toucheventselector(UIButtonTest_PressedAction::touchEvent));        
        _uiLayer->addChild(button);
   2.1.5 实现TitleButton
    // Create the button with title
        Button* button = Button::create("cocosui/backtotoppressed.png", "cocosui/backtotopnormal.png");
        button->setTitleText("Title Button");
        button->setPosition(Point(widgetSize.width / 2.0f, widgetSize.height / 2.0f));
        button->addTouchEventListener(this, toucheventselector(UIButtonTest_Title::touchEvent));
        _uiLayer->addChild(button);
2.2.UICheckBox
   2.2.1 添加CheckBox
   // Create the checkbox
        CheckBox* checkBox = CheckBox::create("cocosui/check_box_normal.png",
                                              "cocosui/check_box_normal_press.png",
                                              "cocosui/check_box_active.png",
                                              "cocosui/check_box_normal_disable.png",
                                              "cocosui/check_box_active_disable.png");
        checkBox->setPosition(Point(widgetSize.width / 2.0f, widgetSize.height / 2.0f));
        
        checkBox->addEventListenerCheckBox(this, checkboxselectedeventselector(UICheckBoxTest::selectedEvent));
        _uiLayer->addChild(checkBox);
    2.2.2 处理用户选中事件
    void UICheckBoxTest::selectedEvent(Ref* pSender,CheckBoxEventType type)
{
    switch (type)
    {
        case CHECKBOX_STATE_EVENT_SELECTED:
            _displayValueLabel->setText(String::createWithFormat("Selected")->getCString());
            break;
            
        case CHECKBOX_STATE_EVENT_UNSELECTED:
            _displayValueLabel->setText(String::createWithFormat("Unselected")->getCString());
            break;
            
        default:
            break;
    }
    
}    
2.3.UISlider
2.3.1 
      // Create the slider
        Slider* slider = Slider::create();
        slider->loadBarTexture("cocosui/sliderTrack.png");
        slider->loadSlidBallTextures("cocosui/sliderThumb.png", "cocosui/sliderThumb.png", "");
        slider->loadProgressBarTexture("cocosui/sliderProgress.png");
        slider->setPosition(Point(widgetSize.width / 2.0f, widgetSize.height / 2.0f/* + slider->getSize().height * 2.0f*/));
        slider->addEventListenerSlider(this, sliderpercentchangedselector(UISliderTest::sliderEvent));
        _uiLayer->addChild(slider); 
2.3.2 
    void UISliderTest::sliderEvent(Ref *pSender, SliderEventType type)
   {
    if (type == SLIDER_PERCENTCHANGED)
     {
        Slider* slider = dynamic_cast<Slider*>(pSender);
        int percent = slider->getPercent();
        _displayValueLabel->setText(String::createWithFormat("Percent %d", percent)->getCString());
     }
   }
2.3.3 
    // Create the slider
        Slider* slider = Slider::create();
        slider->loadBarTexture("cocosui/sliderTrack2.png");
        slider->loadSlidBallTextures("cocosui/sliderThumb.png", "cocosui/sliderThumb.png", "");
        slider->loadProgressBarTexture("cocosui/slider_bar_active_9patch.png");
        slider->setScale9Enabled(true);
        slider->setCapInsets(Rect(0, 0, 0, 0));
        slider->setSize(Size(250.0f, 19));
        slider->setPosition(Point(widgetSize.width / 2.0f, widgetSize.height / 2.0f/* + slider->getSize().height * 3.0f*/));
        slider->addEventListenerSlider(this, sliderpercentchangedselector(UISliderTest_Scale9::sliderEvent));
        _uiLayer->addChild(slider);
2.4.UIImageView
2.4.1 // Create the imageview
        ImageView* imageView = ImageView::create("cocosui/ccicon.png");
        imageView->setPosition(Point(widgetSize.width / 2.0f,
                                     widgetSize.height / 2.0f));
        
        _uiLayer->addChild(imageView);
2.4.2 
   // Create the imageview
        ImageView* imageView = ImageView::create("cocosui/buttonHighlighted.png");
        imageView->setScale9Enabled(true);
        imageView->setSize(Size(300, 115));
        imageView->setPosition(Point(widgetSize.width / 2.0f,
                                     widgetSize.height / 2.0f));
        
2.5.UILoadingBar
2.5.1创建进度条
  // Create the loading bar
        LoadingBar* loadingBar = LoadingBar::create("cocosui/sliderProgress.png");
        loadingBar->setTag(0);
        loadingBar->setPosition(Point(widgetSize.width / 2.0f,
                                      widgetSize.height / 2.0f + loadingBar->getSize().height / 4.0f));
        
        _uiLayer->addChild(loadingBar);
2.5.2 修改进度条的长度
    void UILoadingBarTest_Left::update(float delta)
{
    _count++;
    if (_count > 100)
    {
        _count = 0;
    }
    LoadingBar* loadingBar = static_cast<LoadingBar*>(_uiLayer->getChildByTag(0));
    loadingBar->setPercent(_count);
}
2.5.3 修改进度条的方向
 // Create the loading bar
        LoadingBar* loadingBar = LoadingBar::create("cocosui/sliderProgress.png");
        loadingBar->setTag(0);
        loadingBar->setDirection(LoadingBarTypeRight);
        
        loadingBar->setPosition(Point(widgetSize.width / 2.0f,
                                      widgetSize.height / 2.0f + loadingBar->getSize().height / 4.0f));
        
        _uiLayer->addChild(loadingBar);
2.5.4 scale9
        LoadingBar* loadingBar = LoadingBar::create("cocosui/slider_bar_active_9patch.png");
        loadingBar->setTag(0);
        loadingBar->setScale9Enabled(true);
        loadingBar->setCapInsets(Rect(0, 0, 0, 0));
        loadingBar->setSize(Size(300, 13));        
        loadingBar->setPosition(Point(widgetSize.width / 2.0f,
                                      widgetSize.height / 2.0f + loadingBar->getSize().height / 4.0f));       
        _uiLayer->addChild(loadingBar);
2.6.UITextAtlas
        TextAtlas* textAtlas = TextAtlas::create("1234567890", "cocosui/labelatlas.png", 17, 22, "0");
        textAtlas->setPosition(Point((widgetSize.width) / 2, widgetSize.height / 2.0f));
        _uiLayer->addChild(textAtlas);  
2.7.UIText
   2.7.1 
        // Create the text
        Text* text = Text::create("Text", "AmericanTypewriter", 30);
        text->setPosition(Point(widgetSize.width / 2.0f, widgetSize.height / 2.0f + text->getSize().height / 4.0f));
        _uiLayer->addChild(text);
   2.7.2 
        // Create the line wrap
        Text* text = Text::create("Text can line wrap","AmericanTypewriter",32);
        text->ignoreContentAdaptWithSize(false);
        text->setSize(Size(280, 150));
        text->setTextHorizontalAlignment(TextHAlignment::CENTER);
        text->setPosition(Point(widgetSize.width / 2.0f, widgetSize.height / 2.0f - text->getSize().height / 8.0f));
        _uiLayer->addChild(text);
   2.7.3 create with ttf
     Text* alert = Text::create("Text line wrap","fonts/Marker Felt.ttf",30);
        alert->setColor(Color3B(159, 168, 176));
        alert->setPosition(Point(widgetSize.width / 2.0f, widgetSize.height / 2.0f - alert->getSize().height * 1.75f));
        _uiLayer->addChild(alert);
2.8.UITextBMFont
     // Create the TextBMFont
        TextBMFont* textBMFont = TextBMFont::create("BMFont", "cocosui/bitmapFontTest2.fnt");
        textBMFont->setPosition(Point(widgetSize.width / 2, widgetSize.height / 2.0f + textBMFont->getSize().height / 8.0f));
        _uiLayer->addChild(textBMFont);
2.9.UITextField
 2.9.1
        // Create the textfield
        TextField* textField = TextField::create("input words here","fonts/Marker Felt.ttf",30);


        textField->setPosition(Point(widgetSize.width / 2.0f, widgetSize.height / 2.0f));
        textField->addEventListenerTextField(this, textfieldeventselector(UITextFieldTest::textFieldEvent));
        _uiLayer->addChild(textField);
 2.9.2
      void UITextFieldTest::textFieldEvent(Ref *pSender, TextFiledEventType type)
{
    switch (type)
    {
        case TEXTFIELD_EVENT_ATTACH_WITH_IME:
        {
            TextField* textField = dynamic_cast<TextField*>(pSender);
            Size screenSize = CCDirector::getInstance()->getWinSize();
            textField->runAction(CCMoveTo::create(0.225f,
                                                  Point(screenSize.width / 2.0f, screenSize.height / 2.0f + textField->getContentSize().height / 2.0f)));
            _displayValueLabel->setText(String::createWithFormat("attach with IME")->getCString());
        }
            break;
            
        case TEXTFIELD_EVENT_DETACH_WITH_IME:
        {
            TextField* textField = dynamic_cast<TextField*>(pSender);
            Size screenSize = CCDirector::getInstance()->getWinSize();
            textField->runAction(CCMoveTo::create(0.175f, Point(screenSize.width / 2.0f, screenSize.height / 2.0f)));
            _displayValueLabel->setText(String::createWithFormat("detach with IME")->getCString());
        }
            break;
            
        case TEXTFIELD_EVENT_INSERT_TEXT:
            _displayValueLabel->setText(String::createWithFormat("insert words")->getCString());
            break;
            
        case TEXTFIELD_EVENT_DELETE_BACKWARD:
            _displayValueLabel->setText(String::createWithFormat("delete word")->getCString());
            break;
            
        default:
            break;
    }
}
2.9.2
        textField->setMaxLengthEnabled(true);
        textField->setMaxLength(3);
2.9.3 
        textField->setPasswordEnabled(true);
        textField->setPasswordStyleText("*");
2.9.4 
        TextField* textField = TextField::create("input words here","fonts/Marker Felt.ttf",30);
        textField->ignoreContentAdaptWithSize(false);
        textField->setSize(Size(240, 160));
        textField->setTextHorizontalAlignment(TextHAlignment::CENTER);
        textField->setTextVerticalAlignment(TextVAlignment::CENTER);
2.10.UILayout
2.10.1
       // Create the layout
        Layout* layout = Layout::create();
        layout->setSize(Size(280, 150));
        Size backgroundSize = background->getSize();
        layout->setPosition(Point((widgetSize.width - backgroundSize.width) / 2.0f +
                                  (backgroundSize.width - layout->getSize().width) / 2.0f,
                                  (widgetSize.height - backgroundSize.height) / 2.0f +
                                  (backgroundSize.height - layout->getSize().height) / 2.0f));
        _uiLayer->addChild(layout);//将Layout添加到场景
2.10.2在Layout中添加组件
        Button* button = Button::create("cocosui/animationbuttonnormal.png", "cocosui/animationbuttonpressed.png");
        button->setPosition(Point(button->getSize().width / 2.0f,
                                  layout->getSize().height - button->getSize().height / 2.0f));
        layout->addChild(button);
        
        Button* titleButton = Button::create("cocosui/backtotopnormal.png", "cocosui/backtotoppressed.png");
        titleButton->setTitleText("Title Button");
        titleButton->setPosition(Point(layout->getSize().width / 2.0f, layout->getSize().height / 2.0f));
        layout->addChild(titleButton);
        
        Button* button_scale9 = Button::create("cocosui/button.png", "cocosui/buttonHighlighted.png");
        button_scale9->setScale9Enabled(true);
        button_scale9->setSize(Size(100.0f, button_scale9->getVirtualRendererSize().height));
        button_scale9->setPosition(Point(layout->getSize().width - button_scale9->getSize().width / 2.0f,
                                         button_scale9->getSize().height / 2.0f));
        
        layout->addChild(button_scale9);
2.10.3 
        layout->setBackGroundColorType(LAYOUT_COLOR_SOLID);
        layout->setBackGroundColor(Color3B(128, 128, 128));
        layout->setSize(Size(280, 150));
2.10.4 
        layout->setBackGroundColorType(LAYOUT_COLOR_GRADIENT);
        layout->setBackGroundColor(Color3B(64, 64, 64), Color3B(192, 192, 192));
2.10.5
        layout->setClippingEnabled(true);
        layout->setBackGroundImage("cocosui/Hello.png");
2.10.6
        layout->setBackGroundImageScale9Enabled(true);
        layout->setBackGroundImage("cocosui/green_edit.png");
2.10.7 
// Create the layout
        Layout* layout = Layout::create();
        layout->setLayoutType(LAYOUT_LINEAR_VERTICAL);
        layout->setSize(Size(280, 150));        
        Size backgroundSize = background->getSize();
        layout->setPosition(Point((widgetSize.width - backgroundSize.width) / 2.0f +
                                  (backgroundSize.width - layout->getSize().width) / 2.0f,
                                  (widgetSize.height - backgroundSize.height) / 2.0f +
                                  (backgroundSize.height - layout->getSize().height) / 2.0f));
        _uiLayer->addChild(layout);
        
        
        Button* button = Button::create("cocosui/animationbuttonnormal.png", "cocosui/animationbuttonpressed.png");
        layout->addChild(button);
        
        LinearLayoutParameter* lp1 = LinearLayoutParameter::create();
        button->setLayoutParameter(lp1);
        lp1->setGravity(LINEAR_GRAVITY_CENTER_HORIZONTAL);
        lp1->setMargin(Margin(0.0f, 5.0f, 0.0f, 10.0f));
        
        
        Button* titleButton = Button::create("cocosui/backtotopnormal.png", "cocosui/backtotoppressed.png");
        titleButton->setTitleText("Title Button");
        layout->addChild(titleButton);
        
        LinearLayoutParameter* lp2 = LinearLayoutParameter::create();
        titleButton->setLayoutParameter(lp2);
        lp2->setGravity(LINEAR_GRAVITY_CENTER_HORIZONTAL);
        lp2->setMargin(Margin(0.0f, 10.0f, 0.0f, 10.0f));
        
        
        Button* button_scale9 = Button::create("cocosui/button.png", "cocosui/buttonHighlighted.png");
        button_scale9->setScale9Enabled(true);
        button_scale9->setSize(Size(100.0f, button_scale9->getVirtualRendererSize().height));
        layout->addChild(button_scale9);
        
        LinearLayoutParameter* lp3 = LinearLayoutParameter::create();
        button_scale9->setLayoutParameter(lp3);
        lp3->setGravity(LINEAR_GRAVITY_CENTER_HORIZONTAL);
        lp3->setMargin(Margin(0.0f, 10.0f, 0.0f, 10.0f)); 
2.10.8
    // Create the layout
        Layout* layout = Layout::create();
        layout->setLayoutType(LAYOUT_LINEAR_HORIZONTAL);
        layout->setClippingEnabled(true);
        layout->setSize(Size(280, 150));        
        Size backgroundSize = background->getSize();
        layout->setPosition(Point((widgetSize.width - backgroundSize.width) / 2.0f +
                                  (backgroundSize.width - layout->getSize().width) / 2.0f,
                                  (widgetSize.height - backgroundSize.height) / 2.0f +
                                  (backgroundSize.height - layout->getSize().height) / 2.0f));
        _uiLayer->addChild(layout);
        
        Button* button = Button::create("cocosui/animationbuttonnormal.png", "cocosui/animationbuttonpressed.png");
        layout->addChild(button);
        
        LinearLayoutParameter* lp1 = LinearLayoutParameter::create();
        button->setLayoutParameter(lp1);
        lp1->setGravity(LINEAR_GRAVITY_CENTER_VERTICAL);
        lp1->setMargin(Margin(0.0f, 10.0f, 0.0f, 10.0f));
        
        
        Button* titleButton = Button::create("cocosui/backtotopnormal.png", "cocosui/backtotoppressed.png");
        titleButton->setTitleText("Title Button");
        layout->addChild(titleButton);
        
        LinearLayoutParameter* lp2 = LinearLayoutParameter::create();
        titleButton->setLayoutParameter(lp2);
        lp2->setGravity(LINEAR_GRAVITY_CENTER_VERTICAL);
        lp2->setMargin(Margin(0.0f, 10.0f, 0.0f, 10.0f));
        
        
        Button* button_scale9 = Button::create("cocosui/button.png", "cocosui/buttonHighlighted.png");
        button_scale9->setScale9Enabled(true);
        button_scale9->setSize(Size(100.0f, button_scale9->getVirtualRendererSize().height));
        layout->addChild(button_scale9);
        
        LinearLayoutParameter* lp3 = LinearLayoutParameter::create();
        button_scale9->setLayoutParameter(lp3);
        lp3->setGravity(LINEAR_GRAVITY_CENTER_VERTICAL);
        lp3->setMargin(Margin(0.0f, 10.0f, 0.0f, 10.0f));
2.10.9
     // Create the layout
        Layout* layout = Layout::create();
        layout->setLayoutType(LAYOUT_RELATIVE);
        layout->setSize(Size(280, 150));
        layout->setBackGroundColorType(LAYOUT_COLOR_SOLID);
        layout->setBackGroundColor(Color3B::GREEN);
        Size backgroundSize = background->getSize();
        layout->setPosition(Point((widgetSize.width - backgroundSize.width) / 2.0f +
                                (backgroundSize.width - layout->getSize().width) / 2.0f,
                                (widgetSize.height - backgroundSize.height) / 2.0f +
                                (backgroundSize.height - layout->getSize().height) / 2.0f));
        _uiLayer->addChild(layout);
        
        // top left
        Button* button_TopLeft = Button::create("cocosui/animationbuttonnormal.png",
                                                "cocosui/animationbuttonpressed.png");
        layout->addChild(button_TopLeft);
        
        RelativeLayoutParameter* rp_TopLeft = RelativeLayoutParameter::create();
        rp_TopLeft->setAlign(RELATIVE_ALIGN_PARENT_TOP_LEFT);
        button_TopLeft->setLayoutParameter(rp_TopLeft);
        
        
        // top center horizontal
        Button* button_TopCenter = Button::create("cocosui/animationbuttonnormal.png",
                                                  "cocosui/animationbuttonpressed.png");
        layout->addChild(button_TopCenter);
        
        RelativeLayoutParameter* rp_TopCenter = RelativeLayoutParameter::create();
        rp_TopCenter->setAlign(RELATIVE_ALIGN_PARENT_TOP_CENTER_HORIZONTAL);
        button_TopCenter->setLayoutParameter(rp_TopCenter);
        
        
        // top right
        Button* button_TopRight = Button::create("cocosui/animationbuttonnormal.png",
                                                 "cocosui/animationbuttonpressed.png");
        layout->addChild(button_TopRight);
        
        RelativeLayoutParameter* rp_TopRight = RelativeLayoutParameter::create();
        rp_TopRight->setAlign(RELATIVE_ALIGN_PARENT_TOP_RIGHT);
        button_TopRight->setLayoutParameter(rp_TopRight);
        
        
        // left center
        Button* button_LeftCenter = Button::create("cocosui/animationbuttonnormal.png",
                                                   "cocosui/animationbuttonpressed.png");
        layout->addChild(button_LeftCenter);
        
        RelativeLayoutParameter* rp_LeftCenter = RelativeLayoutParameter::create();
        rp_LeftCenter->setAlign(RELATIVE_ALIGN_PARENT_LEFT_CENTER_VERTICAL);
        button_LeftCenter->setLayoutParameter(rp_LeftCenter);
        
        
        // center
        Button* buttonCenter = Button::create("cocosui/animationbuttonnormal.png",
                                              "cocosui/animationbuttonpressed.png");
        layout->addChild(buttonCenter);
        
        RelativeLayoutParameter* rpCenter = RelativeLayoutParameter::create();
        rpCenter->setAlign(RELATIVE_CENTER_IN_PARENT);
        buttonCenter->setLayoutParameter(rpCenter);
        
        
        // right center
        Button* button_RightCenter = Button::create("cocosui/animationbuttonnormal.png",
                                                    "cocosui/animationbuttonpressed.png");
        layout->addChild(button_RightCenter);
        
        RelativeLayoutParameter* rp_RightCenter = RelativeLayoutParameter::create();
        rp_RightCenter->setAlign(RELATIVE_ALIGN_PARENT_RIGHT_CENTER_VERTICAL);
        button_RightCenter->setLayoutParameter(rp_RightCenter);
        
        
        // left bottom
        Button* button_LeftBottom = Button::create("cocosui/animationbuttonnormal.png",
                                                   "cocosui/animationbuttonpressed.png");
        layout->addChild(button_LeftBottom);
        
        RelativeLayoutParameter* rp_LeftBottom = RelativeLayoutParameter::create();
        rp_LeftBottom->setAlign(RELATIVE_ALIGN_PARENT_LEFT_BOTTOM);
        button_LeftBottom->setLayoutParameter(rp_LeftBottom);
        
        
        // bottom center
        Button* button_BottomCenter = Button::create("cocosui/animationbuttonnormal.png",
                                                     "cocosui/animationbuttonpressed.png");
        layout->addChild(button_BottomCenter);
        
        RelativeLayoutParameter* rp_BottomCenter = RelativeLayoutParameter::create();
        rp_BottomCenter->setAlign(RELATIVE_ALIGN_PARENT_BOTTOM_CENTER_HORIZONTAL);
        button_BottomCenter->setLayoutParameter(rp_BottomCenter);
        
        
        // right bottom
        Button* button_RightBottom = Button::create("cocosui/animationbuttonnormal.png",
                                                    "cocosui/animationbuttonpressed.png");
        layout->addChild(button_RightBottom);
        
        RelativeLayoutParameter* rp_RightBottom = RelativeLayoutParameter::create();
        rp_RightBottom->setAlign(RELATIVE_ALIGN_PARENT_RIGHT_BOTTOM);
        button_RightBottom->setLayoutParameter(rp_RightBottom);
        
 2.10.10
  // Create the layout
        Layout* layout = Layout::create();
        layout->setLayoutType(LAYOUT_RELATIVE);
        layout->setSize(Size(280, 150));
        Size backgroundSize = background->getSize();
        layout->setPosition(Point((widgetSize.width - backgroundSize.width) / 2.0f +
                                (backgroundSize.width - layout->getSize().width) / 2.0f,
                                (widgetSize.height - backgroundSize.height) / 2.0f +
                                (backgroundSize.height - layout->getSize().height) / 2.0f));
        _uiLayer->addChild(layout);
        
        // center
        ImageView* imageView_Center = ImageView::create("cocosui/scrollviewbg.png");
        layout->addChild(imageView_Center);
        
        RelativeLayoutParameter* rp_Center = RelativeLayoutParameter::create();
        rp_Center->setRelativeName("rp_Center");
        rp_Center->setAlign(RELATIVE_CENTER_IN_PARENT);
        imageView_Center->setLayoutParameter(rp_Center);
        
        
        // above center
        ImageView* imageView_AboveCenter = ImageView::create("cocosui/switch-mask.png");
        layout->addChild(imageView_AboveCenter);
        
        RelativeLayoutParameter* rp_AboveCenter = RelativeLayoutParameter::create();
        rp_AboveCenter->setRelativeToWidgetName("rp_Center");
        rp_AboveCenter->setAlign(RELATIVE_LOCATION_ABOVE_CENTER);
        imageView_AboveCenter->setLayoutParameter(rp_AboveCenter);
        
        
        // below center
        ImageView* imageView_BelowCenter = ImageView::create("cocosui/switch-mask.png");
        layout->addChild(imageView_BelowCenter);
        
        RelativeLayoutParameter* rp_BelowCenter = RelativeLayoutParameter::create();
        rp_BelowCenter->setRelativeToWidgetName("rp_Center");
        rp_BelowCenter->setAlign(RELATIVE_LOCATION_BELOW_CENTER);
        imageView_BelowCenter->setLayoutParameter(rp_BelowCenter);
        
        
        // left center
        ImageView* imageView_LeftCenter = ImageView::create("cocosui/switch-mask.png");
        layout->addChild(imageView_LeftCenter);
        
        RelativeLayoutParameter* rp_LeftCenter = RelativeLayoutParameter::create();
        rp_LeftCenter->setRelativeToWidgetName("rp_Center");
        rp_LeftCenter->setAlign(RELATIVE_LOCATION_LEFT_OF_CENTER);
        imageView_LeftCenter->setLayoutParameter(rp_LeftCenter);
        // right center
        ImageView* imageView_RightCenter = ImageView::create("cocosui/switch-mask.png");
        layout->addChild(imageView_RightCenter);      
        RelativeLayoutParameter* rp_RightCenter = RelativeLayoutParameter::create();
        rp_RightCenter->setRelativeToWidgetName("rp_Center");
        rp_RightCenter->setAlign(RELATIVE_LOCATION_RIGHT_OF_CENTER);
        imageView_RightCenter->setLayoutParameter(rp_RightCenter);     
2.11.UIScrollView
 2.11.1 创建垂直滚动UI
 // Create the scrollview by vertical
        ui::ScrollView* scrollView = ui::ScrollView::create();
        scrollView->setSize(Size(280.0f, 150.0f));        
        Size backgroundSize = background->getContentSize();
        scrollView->setPosition(Point((widgetSize.width - backgroundSize.width) / 2.0f +
                               (backgroundSize.width - scrollView->getSize().width) / 2.0f,
                               (widgetSize.height - backgroundSize.height) / 2.0f +
                               (backgroundSize.height - scrollView->getSize().height) / 2.0f));
        _uiLayer->addChild(scrollView);
        
        ImageView* imageView = ImageView::create("cocosui/ccicon.png");
        
        float innerWidth = scrollView->getSize().width;
        float innerHeight = scrollView->getSize().height + imageView->getSize().height;
        
        scrollView->setInnerContainerSize(Size(innerWidth, innerHeight));                
        
        Button* button = Button::create("cocosui/animationbuttonnormal.png", "cocosui/animationbuttonpressed.png");
        button->setPosition(Point(innerWidth / 2.0f, scrollView->getInnerContainerSize().height - button->getSize().height / 2.0f));
        scrollView->addChild(button);
        
        Button* titleButton = Button::create("cocosui/backtotopnormal.png", "cocosui/backtotoppressed.png");
        titleButton->setTitleText("Title Button");
        titleButton->setPosition(Point(innerWidth / 2.0f, button->getBottomInParent() - button->getSize().height));
        scrollView->addChild(titleButton);
        
        Button* button_scale9 = Button::create("cocosui/button.png", "cocosui/buttonHighlighted.png");
        button_scale9->setScale9Enabled(true);
        button_scale9->setSize(Size(100.0f, button_scale9->getVirtualRendererSize().height));
        button_scale9->setPosition(Point(innerWidth / 2.0f, titleButton->getBottomInParent() - titleButton->getSize().height));
        scrollView->addChild(button_scale9);
        
        imageView->setPosition(Point(innerWidth / 2.0f, imageView->getSize().height / 2.0f));
        scrollView->addChild(imageView);            
2.11.2
  // Create the scrollview by horizontal
        ui::ScrollView* scrollView = ui::ScrollView::create();
        scrollView->setBounceEnabled(true);
        scrollView->setDirection(SCROLLVIEW_DIR_HORIZONTAL);
        scrollView->setSize(Size(280.0f, 150.0f));
        scrollView->setInnerContainerSize(scrollView->getSize());
        Size backgroundSize = background->getContentSize();
        scrollView->setPosition(Point((widgetSize.width - backgroundSize.width) / 2.0f +
                                    (backgroundSize.width - scrollView->getSize().width) / 2.0f,
                                    (widgetSize.height - backgroundSize.height) / 2.0f +
                                    (backgroundSize.height - scrollView->getSize().height) / 2.0f));
        _uiLayer->addChild(scrollView);
        
        ImageView* imageView = ImageView::create("cocosui/ccicon.png");
        
        float innerWidth = scrollView->getSize().width + imageView->getSize().width;
        float innerHeight = scrollView->getSize().height;
        
        scrollView->setInnerContainerSize(Size(innerWidth, innerHeight));
        
        Button* button = Button::create("cocosui/animationbuttonnormal.png", "cocosui/animationbuttonpressed.png");
        button->setPosition(Point(button->getSize().width / 2.0f,
                                scrollView->getInnerContainerSize().height - button->getSize().height / 2.0f));
        scrollView->addChild(button);
        
        Button* titleButton = Button::create("cocosui/backtotopnormal.png", "cocosui/backtotoppressed.png");
        titleButton->setTitleText("Title Button");
        titleButton->setPosition(Point(button->getRightInParent() + button->getSize().width / 2.0f,
                                    button->getBottomInParent() - button->getSize().height / 2.0f));
        scrollView->addChild(titleButton);
        
        Button* button_scale9 = Button::create("cocosui/button.png", "cocosui/buttonHighlighted.png");
        button_scale9->setScale9Enabled(true);
        button_scale9->setSize(Size(100.0f, button_scale9->getVirtualRendererSize().height));
        button_scale9->setPosition(Point(titleButton->getRightInParent() + titleButton->getSize().width / 2.0f,
                                       titleButton->getBottomInParent() - titleButton->getSize().height / 2.0f));
        scrollView->addChild(button_scale9);                
                
        imageView->setPosition(Point(innerWidth - imageView->getSize().width / 2.0f,
                                   button_scale9->getBottomInParent() - button_scale9->getSize().height / 2.0f));
        scrollView->addChild(imageView);  
2.11.3
       // Create the dragpanel
        ui::ScrollView* scrollView = ui::ScrollView::create();
        scrollView->setDirection(SCROLLVIEW_DIR_BOTH);
        scrollView->setTouchEnabled(true);
        scrollView->setBounceEnabled(true);//反弹
        scrollView->setBackGroundImageScale9Enabled(true);
        scrollView->setBackGroundImage("cocosui/green_edit.png");
        scrollView->setSize(Size(210, 122.5));
        Size backgroundSize = background->getContentSize();
        scrollView->setPosition(Point((widgetSize.width - backgroundSize.width) / 2.0f +
                                    (backgroundSize.width - scrollView->getSize().width) / 2.0f,
                                    (widgetSize.height - backgroundSize.height) / 2.0f +
                                    (backgroundSize.height - scrollView->getSize().height) / 2.0f));
        ImageView* imageView = ImageView::create("Hello.png");
        scrollView->addChild(imageView);
        
        scrollView->setInnerContainerSize(imageView->getContentSize());
        Size innerSize = scrollView->getInnerContainerSize();
        imageView->setPosition(Point(innerSize.width / 2.0f, innerSize.height / 2.0f));
        
        _uiLayer->addChild(scrollView);
2.11.4
    ui::ScrollView* sc = ui::ScrollView::create();
        sc->setBackGroundColor(Color3B::GREEN);
        sc->setBackGroundColorType(LAYOUT_COLOR_SOLID);
        sc->setDirection(SCROLLVIEW_DIR_BOTH);
        sc->setInnerContainerSize(Size(480, 320));
        sc->setSize(Size(100,100));
        Size backgroundSize = background->getContentSize();
        sc->setPosition(Point((widgetSize.width - backgroundSize.width) / 2.0f +
                              (backgroundSize.width - sc->getSize().width) / 2.0f,
                              (widgetSize.height - backgroundSize.height) / 2.0f +
                              (backgroundSize.height - sc->getSize().height) / 2.0f));
                                                          //减速
        sc->scrollToPercentBothDirection(Point(50, 50), 1, true);
        ImageView* iv = ImageView::create("cocosui/Hello.png");
        iv->setPosition(Point(240, 160));
        sc->addChild(iv);
        _uiLayer->addChild(sc);
2.12.UIPageView
 // Create the page view
        PageView* pageView = PageView::create();
        pageView->setSize(Size(240.0f, 130.0f));
        Size backgroundSize = background->getContentSize();
        pageView->setPosition(Point((widgetSize.width - backgroundSize.width) / 2.0f +
                                  (backgroundSize.width - pageView->getSize().width) / 2.0f,
                                  (widgetSize.height - backgroundSize.height) / 2.0f +
                                  (backgroundSize.height - pageView->getSize().height) / 2.0f));
        
        for (int i = 0; i < 3; ++i)
        {
            Layout* layout = Layout::create();
            layout->setSize(Size(240.0f, 130.0f));
            
            ImageView* imageView = ImageView::create("cocosui/scrollviewbg.png");
            imageView->setScale9Enabled(true);
            imageView->setSize(Size(240, 130));
            imageView->setPosition(Point(layout->getSize().width / 2.0f, layout->getSize().height / 2.0f));
            layout->addChild(imageView);
            
            Text* label = Text::create(StringUtils::format("page %d",(i+1)), "fonts/Marker Felt.ttf", 30);
            label->setColor(Color3B(192, 192, 192));
            label->setPosition(Point(layout->getSize().width / 2.0f, layout->getSize().height / 2.0f));
            layout->addChild(label);
            
            pageView->addPage(layout);
        }
        pageView->addEventListenerPageView(this, pagevieweventselector(UIPageViewTest::pageViewEvent));
        
        _uiLayer->addChild(pageView);
  2.12.2
  void UIPageViewTest::pageViewEvent(Ref *pSender, PageViewEventType type)
{
    switch (type)
    {
        case PAGEVIEW_EVENT_TURNING:
        {
            PageView* pageView = dynamic_cast<PageView*>(pSender);
            
            _displayValueLabel->setText(CCString::createWithFormat("page = %ld", pageView->getCurPageIndex() + 1)->getCString());
        }
            break;
            
        default:
            break;
    }
}      
     
2.13.UIListView
2.13.1 
 // create list view ex data
        _array = Array::create();
        CC_SAFE_RETAIN(_array);
        for (int i = 0; i < 20; ++i)
        {
            __String* ccstr = __String::createWithFormat("listview_item_%d", i);
            _array->addObject(ccstr);
        }
        
        
        // Create the list view ex
        ListView* listView = ListView::create();
        // set list view ex direction
        listView->setDirection(SCROLLVIEW_DIR_VERTICAL);
        listView->setTouchEnabled(true);
        listView->setBounceEnabled(true);
        listView->setBackGroundImage("cocosui/green_edit.png");
        listView->setBackGroundImageScale9Enabled(true);
        listView->setSize(Size(240, 130));
        listView->setPosition(Point((widgetSize.width - backgroundSize.width) / 2.0f +
                                    (backgroundSize.width - listView->getSize().width) / 2.0f,
                                    (widgetSize.height - backgroundSize.height) / 2.0f +
                                    (backgroundSize.height - listView->getSize().height) / 2.0f));
        listView->addEventListenerListView(this, listvieweventselector(UIListViewTest_Vertical::selectedItemEvent));
        _uiLayer->addChild(listView);
        
        
        // create model
        Button* default_button = Button::create("cocosui/backtotoppressed.png", "cocosui/backtotopnormal.png");
        default_button->setName("Title Button");
        
        Layout* default_item = Layout::create();
        default_item->setTouchEnabled(true);
        default_item->setSize(default_button->getSize());
        default_button->setPosition(Point(default_item->getSize().width / 2.0f,
                                          default_item->getSize().height / 2.0f));
        default_item->addChild(default_button);
        
        // set model
        listView->setItemModel(default_item);
        
        // add default item
        ssize_t count = _array->count();
        for (int i = 0; i < count / 4; ++i)
        {
            listView->pushBackDefaultItem();
        }
        // insert default item
        for (int i = 0; i < count / 4; ++i)
        {
            listView->insertDefaultItem(0);
        }
        
        // add custom item
        for (int i = 0; i < count / 4; ++i)
        {
            Button* custom_button = Button::create("cocosui/button.png", "cocosui/buttonHighlighted.png");
            custom_button->setName("Title Button");
            custom_button->setScale9Enabled(true);
            custom_button->setSize(default_button->getSize());
            
            Layout *custom_item = Layout::create();
            custom_item->setSize(custom_button->getSize());
            custom_button->setPosition(Point(custom_item->getSize().width / 2.0f, custom_item->getSize().height / 2.0f));
            custom_item->addChild(custom_button);
            
            listView->pushBackCustomItem(custom_item);
        }
        // insert custom item
        Vector<Widget*>& items = listView->getItems();
        ssize_t items_count = items.size();
        for (int i = 0; i < count / 4; ++i)
        {
            Button* custom_button = Button::create("cocosui/button.png", "cocosui/buttonHighlighted.png");
            custom_button->setName("Title Button");
            custom_button->setScale9Enabled(true);
            custom_button->setSize(default_button->getSize());
            
            Layout *custom_item = Layout::create();
            custom_item->setSize(custom_button->getSize());
            custom_button->setPosition(Point(custom_item->getSize().width / 2.0f, custom_item->getSize().height / 2.0f));
            custom_item->addChild(custom_button);
            
            listView->insertCustomItem(custom_item, items_count);
        }
        
        // set item data
        items_count = items.size();
        for (int i = 0; i < items_count; ++i)
        {
            Widget* item = listView->getItem(i);
            Button* button = static_cast<Button*>(item->getChildByName("Title Button"));
            ssize_t index = listView->getIndex(item);
            button->setTitleText(static_cast<__String*>(_array->getObjectAtIndex(index))->getCString());
        }
        
        // remove last item
        listView->removeLastItem();
        
        // remove item by index
        items_count = items.size();
        listView->removeItem(items_count - 1);
        
        // set all items layout gravity
        listView->setGravity(LISTVIEW_GRAVITY_CENTER_VERTICAL);
        
        // set items margin
        listView->setItemsMargin(2.0f);
   2.13.2 
   void UIListViewTest_Vertical::selectedItemEvent(Ref *pSender, ListViewEventType type)
{
    switch (type)
    {
        case cocos2d::ui::LISTVIEW_ONSELECTEDITEM_START:
        {
            ListView* listView = static_cast<ListView*>(pSender);
            CC_UNUSED_PARAM(listView);
            CCLOG("select child start index = %ld", listView->getCurSelectedIndex());
            break;
        }
        case cocos2d::ui::LISTVIEW_ONSELECTEDITEM_END:
        {
            ListView* listView = static_cast<ListView*>(pSender);
            CC_UNUSED_PARAM(listView);
            CCLOG("select child end index = %ld", listView->getCurSelectedIndex());
            break;
        }
        default:
            break;
    }
}
2.13.3  
        // Create the list view ex
        ListView* listView = ListView::create();
        // set list view ex direction
        listView->setDirection(SCROLLVIEW_DIR_HORIZONTAL);
        listView->setTouchEnabled(true);
        listView->setBounceEnabled(true);
        listView->setBackGroundImage("cocosui/green_edit.png");
        listView->setBackGroundImageScale9Enabled(true);
        listView->setSize(Size(240, 130));


2.14.UIRichText
 _richText = RichText::create();
        _richText->ignoreContentAdaptWithSize(false);
        _richText->setSize(Size(100, 100));
        
        RichElementText* re1 = RichElementText::create(1, Color3B::WHITE, 255, "This color is white. ", "Helvetica", 10);
        RichElementText* re2 = RichElementText::create(2, Color3B::YELLOW, 255, "And this is yellow. ", "Helvetica", 10);
        RichElementText* re3 = RichElementText::create(3, Color3B::BLUE, 255, "This one is blue. ", "Helvetica", 10);
        RichElementText* re4 = RichElementText::create(4, Color3B::GREEN, 255, "And green. ", "Helvetica", 10);
        RichElementText* re5 = RichElementText::create(5, Color3B::RED, 255, "Last one is red ", "Helvetica", 10);
        
        RichElementImage* reimg = RichElementImage::create(6, Color3B::WHITE, 255, "cocosui/sliderballnormal.png");
        
        cocostudio::ArmatureDataManager::getInstance()->addArmatureFileInfo("cocosui/100/100.ExportJson");
        cocostudio::Armature *pAr = cocostudio::Armature::create("100");
        pAr->getAnimation()->play("Animation1");
        
        RichElementCustomNode* recustom = RichElementCustomNode::create(1, Color3B::WHITE, 255, pAr);
        RichElementText* re6 = RichElementText::create(7, Color3B::ORANGE, 255, "Have fun!! ", "Helvetica", 10);
        _richText->pushBackElement(re1);
        _richText->insertElement(re2, 1);
        _richText->pushBackElement(re3);
        _richText->pushBackElement(re4);
        _richText->pushBackElement(re5);
        _richText->insertElement(reimg, 2);
        _richText->pushBackElement(recustom);
        _richText->pushBackElement(re6);
        
        _richText->setPosition(Point(widgetSize.width / 2, widgetSize.height / 2));
        _richText->setLocalZOrder(10);  
        _widget->addChild(_richText);
三、在CocosStudio的UI编辑器中获取组件对象
3.1使用UI编辑器
3.2导出UI文件
3.3在Cocos2d-x中加载UI文件
3.4获取UI层中的子对象


四、UI组件详解
4.1使用UIButton
4.1.1 载入UIButton文件
bool UIButtonTest_Editor::init()
{
    if (UIScene_Editor::init())
    {
        _layout = static_cast<Layout*>(cocostudio::GUIReader::getInstance()->widgetFromJsonFile("cocosui/UIEditorTest/UIButton_Editor/UIButton_Editor_1.json"));
        _touchGroup->addChild(_layout);
        Size screenSize = CCDirector::getInstance()->getWinSize();
        Size rootSize = _layout->getSize();
        _touchGroup->setPosition(Point((screenSize.width - rootSize.width) / 2,
                                       (screenSize.height - rootSize.height) / 2));
        
        Layout* root = static_cast<Layout*>(_layout->getChildByName("root_Panel"));


        Text* back_label = static_cast<Text*>(Helper::seekWidgetByName(root, "back"));
        back_label->addTouchEventListener(this, toucheventselector(UIScene_Editor::toGUIEditorTestScene));
        
        _sceneTitle = static_cast<Text*>(Helper::seekWidgetByName(root, "UItest"));
        
        Button* button = static_cast<Button*>(Helper::seekWidgetByName(root, "Button_123"));
        button->addTouchEventListener(this, toucheventselector(UIButtonTest_Editor::touchEvent));
        
        Button* title_button = static_cast<Button*>(Helper::seekWidgetByName(root, "Button_126"));
        title_button->addTouchEventListener(this, toucheventselector(UIButtonTest_Editor::touchEvent));
        
        Button* scale9_button = static_cast<Button*>(Helper::seekWidgetByName(root, "Button_129"));
        scale9_button->addTouchEventListener(this, toucheventselector(UIButtonTest_Editor::touchEvent));
        
        _displayValueLabel = Text::create();
        _displayValueLabel->setFontName("fonts/Marker Felt.ttf");
        _displayValueLabel->setFontSize(30);
        _displayValueLabel->setText("No event");
        _displayValueLabel->setPosition(Point(_layout->getSize().width / 2,
                                              _layout->getSize().height - _displayValueLabel->getSize().height * 1.75f));
        _touchGroup->addChild(_displayValueLabel);
        
        return true;
    }
    
    return false;
}


void UIButtonTest_Editor::touchEvent(Ref *pSender, TouchEventType type)
{
    switch (type)
    {
        case TOUCH_EVENT_BEGAN:
            _displayValueLabel->setText("Touch Down");
            break;
            
        case TOUCH_EVENT_MOVED:
            _displayValueLabel->setText("Touch Moved");
            break;
            
        case TOUCH_EVENT_ENDED:
            _displayValueLabel->setText("Touch Ended");
            break;
            
        case TOUCH_EVENT_CANCELED:
            _displayValueLabel->setText("Touch Canceled");
            break;
            
        default:
            break;
    }
motive_yw
关注
专栏目录
CocosStudio（二）创建UI项目
小飞飞的博客
10-24 3356
游戏场景一般分为UI场景（又称游戏外围UI），游戏战斗场景。UI场景种有一系列UI系统组成（比如：登陆系统，商城系统，背包系统，好友系统，聊天系统，任务系统等），每个系统由多个UI界面组成。游戏战斗场景是游戏的核心，想留住玩家，战斗得玩法新颖，丰富，里面包括游戏战斗界面、战斗结算界面、战斗奖励界面、其他UI界面。战斗结算界面和战斗奖励界面可放在UI场景里，根据自己怎么设计了，我们一般放在战斗场景里
Cocos2d-x UI组件
yizhengtutu的专栏
12-14 942
3.0版本创建项目后，GUI相关的库是没有默认添加到项目中的，如果直接使用会编译不通过（例如：fatal error C1083: 无法打开包括文件:“cocostudio/ObjectFactory.h”: No such file or directory），下面是解决这个问题的流程: 一、在工程里添加3个项目： ①cocos2d/cocos/editor-support/cocostud
Cocos2d-x 3.0final 终结者系列教程23CocosStudio UI组件使用大全Cocos2d-x3.2使用
Cocos2d-x,Android,IOS,游戏，HTML5开发/交流/学习/资源 沈大海
08-19 1万+
按钮UIButton 复选框UICheckBox 滑块UISlider 图片UIImageView 进度条UILoadingBar 纹理文本 UITextAtlas 字体文本 UIText 图片字体文本 UITextBMFont 文本区域 UITextField 布局组件 UILayout 滚动组件 UIScrollView 页面切换组件 UIPageView 列表组件 UIListView 所有控件都继承 UIWidget
cocos2dx开发者指南：UI控件使用
学无止境! 无休无止!
02-01 4198
综述 Cocos2d-x提供了一套易于使用的UI API来满足你的GUI需求，其中包括：Label、Menu、MenuItems、Buttons和Views。 Label（标签） Cocos2d-x中提供了Label(标签)对象来创建TTF、BMFont和SystemFont文本。 Label BMFont（BMFont标签） BMFont是使用位图字体的标签类型。位
cocos2d-x UI组件
金溪的博客
03-20 624
标签（Label） 使用Label对象可以使用位图字体、TrueType字体、系统字体创建标签。这个单一个类能处理所有标签需求。 BMFont BMFont是一个使用位图字体创建的标签类型，位图字体中的字符由点阵组成。使用这种字体标签性能非常好，但是不适合缩放。标签中的每一个字符都是一个单独的Sprite，也就是说精灵的属性控制都适用于这里的每个字符。 创建BMFont标签需要两个文件：....
Cocos2d-x 3.0 开发（十）使用CocoStudio场景编辑器关联组件
热门推荐
阿修罗道
11-08 2万+
我们有了UI交互、有了动画人物、有了物理模拟，还差最后一步——将这些元素融合起来。这次我们使用cocoStudio中的场景编辑器，将先前做过的所有东西都放到一个场景中去。上图：......
cocos2d-x的面试题
zhou_yeh
03-23 438
昨天听了腾讯2015校招的在线宣讲会，看到了游戏技术大拿Steven，他总结了需要的达人得爱技术，能坚持，够挑剔。马上校招了，加油吧，骚年~ 　　网上关于cocos2d-x的面试题比较少，这里搜集和整理了一写网上关于cocos2d-x游戏开发的面试题。希望对找工作的同学有帮助。如有错误，请拍砖。 1、Cocos2d-x是怎样实现跨平台？ 　　AppDelegate 作为跨平台程序入口，在这之上做了另一层的封装，封装了不同平台的不同实现。比如我们通常认为一个程序是由 main 函数开始运行，那我们就去.
Cocos2d-x 3.x简介及环境搭建
Cocos2d-x是一个非常强大且受欢迎的游戏开发框架，被许多顶级游戏开发公司使用。 ## 1.2 Cocos2d-x的特点 Cocos2d-x具有以下几个重要特点： - 跨平台：Cocos2d-x可以在多个平台上运行，如iOS、Android、Windows等...
Cocos2d-x 3.x中的跨平台开发技巧
# 章节一：Cocos2d-x 3.x简介 ## 1.1 Cocos2d-x 3.x概述 Cocos2d-x 3.x是一个开源的跨平台2D游戏开发框架，它是Cocos2d家族的一部分，专注于提供高效、易用的开发工具和引擎，以帮助开发者快速地开发出高质量的2D...
Cocos2d-x多人游戏开发：实现实时多人对战
Cocos2d-x具有高效的渲染和动画效果，以及丰富的功能库，提供了许多游戏开发所需的工具和组件。 ## 1.2 多人游戏开发的概念和挑战 多人游戏开发是指两个或多个玩家可以在同一个游戏环境中进行互动。这种类型的游戏...
COCOS2D-X UI组件
DevXP的专栏
02-22 3232
cocos2d-x-extensions https://github.com/jandujar/cocos2d-x-extensions https://github.com/dualface/cocos2d-x-extensions https://github.com/darkfall/cocos2dx-extensions 水果忍者-by Cocos2d-X
CocoStudio UI编辑器自定义插件
诸葛飞
11-19 5527
今天搞定了 CocoStudio UI编辑器的自定义插件，总的来说虽说步骤有点繁琐，但还是很简单的 第一步，在 cocos2d-x 中
Cocos Studio制作UI总结
木木三的专栏
03-30 757
可以在cocos2d\cocos\cocos2d.cpp中查看2d-x的版本信息。 CC_DLL const char* cocos2dVersion() { return "cocos2d-x-3.10"; } Cocos Studio制作UI的总结： 1、充分利用好参考线，快速布局。 2、布局时注意适配，节点命名规范，首先将页面划分成几个大块，比如上边，中间，下边，左边，中间，右...
Cocos2dx之UI组件
weixin_40763897的博客
02-24 2518
Cocos2d-x提供了一套UI组件。包括 Label Menu Buttons Checkbox Loading Bar Slider TextField Label Cocos2d-x提供Label对象，可以用真值类型、bitmap（位图）或内置系统字体来创建。 Label BMFont BMFont是一种Label类型，它使用bitmap（位图）字体。位图中的字符由点的矩阵组...
cocosstudio 自定义控件
jeepxbf的博客
03-11 482
1 复制E:\cocos\Documents\Cocos\CocosStudio2\Samples目录，为了有重来的机会。 2 设置工程的输出目录为E:\cocos\Documents\Cocos\CocosStudio2\Addins_pugna，复制的是E:\cocos\Documents\Cocos\CocosStudio2\Addins，为了有重来的机会 3 使用vs2017编译，报错，因为E:\cocos\Documents\Cocos\CocosStudio2\Samples_pugna\Add
Cocos2d-xUI组件详解
田螺姑娘的博客
02-09 1525
Cocos2d-xUI组件详解 标签（Label）   Cocos2d-x提供Label对象给用户，可以使用位图字体，TrueType字体，系统字体创建标签。这个单一的类能处理你所有的标签需求。下面介绍使用各种字体，创建标签的方法。 BMFont   BMFont是一个使用位图字体创建的标签类型，位图字体中的字符由点阵组成。使用这种字体标签性能非常好，但是不适合缩放。由于点阵的原因，缩放会导致失真。标签中的每一个字符都是一个单独的Sprite，也就是说精灵的属性（旋转，缩放，着色等）控制都适用于这里的每个
Cocos2d-x 3.9教程：10.使用CocosStudio的UI编辑器从UI文件中加载布局和控件
tiancao222的博客
04-09 1万+
Cocos2d-x 3.9教程 10. 使用CocosStudio的UI编辑器从UI文件中加载布局和控件 1.1. 使用CocosStudio的UI编辑器 1.1.1. 安装和启动 从官网上下载2015年11月18日版本，Cocos studio 2.3.3。   安装完毕后，桌面出现两个图标。 Cocos Studio是我们的UI、动画等编辑器。Cocos是项目管理器，且它
Cocos2d-x之UI控件简介
weixin_30537451的博客
08-23 150
| 版权声明：本文为博主原创文章，未经博主允许不得转载。 　　在Cocos2d-x中提供了一种UI控件，UI控件是指用户交互界面的操作部件。UI控件可以是Button(按钮),CheckBox(选择框),Slider,LoadingBar(进度条),TextField,ScrollView,ListView,EditBox,TableView，之所以使用控件的第一个原因是因为控件容易使...
cocos2d-x高级UI控件详细介绍
Norton的专栏
06-26 6067
对应官网的CCControlExtention。可以通过TestCpp的EntentionTest查看效果。 http://cocos2d-x.org/projects/cocos2d-x/wiki/CCControlExtension 以下内容使用了扩展库，因此要添加库路径和命名空间 #include "cocos-ext.h"  USING_NS_CC_EXT;
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值