Cocos2d-x自定义UI控件:时间选择控件

UI设计的想弄一个像IOS上时间选择样的控件,可无奈Cocos2d-x中没有这个控件,只好手动撸一个了。

在Cocos2d-x所有的UI控件中,PageView控件跟这个时间选择样的控件最为相似,都是上下滑动选择不同的Item,当滑动距离没超过半个Item时,自动回退到原来的位置,超过半个Item时,自动滑动到下一个Item。区别在于PageView控件只能显示一个Item,时间选择控件能够同时显示多个Item,并且中间有一个标示框标示选中的Item。

Cocos2d-x消息处理机制

原理

在Cocos2d-x V3.0以上,使用事件监听机制来处理触摸消息。引擎启动后会有一个全局的EventDispatcher来负责接收设备的输入消息并将这些消息分发给向其注册的Node对象。Node对象向EventDispatcher注册自己感兴趣的消息类型后,EventDispatcher就会将相应的消息分发给这个Node。

使用

下面是C++中Node对象监听触摸事件的方法。

auto listener = EventListenerTouchOneByOne::create();
listener->setSwallowTouches(true);
listener->onTouchBegan = CC_CALLBACK_2(YourNode::onTouchBegan, this);
listener->onTouchMoved = CC_CALLBACK_2(YourNode::onTouchMoved, this);
listener->onTouchEnded = CC_CALLBACK_2(YourNode::onTouchEnded, this);
_eventDispatcher->addEventListenerWithSceneGraphPriority(listener, this);

Cocos2d-x UI使用问题总结

基础

1. 更新位置和大小信息

当使用widgetFromBinaryFile或者widgetFromJsonFile创建UI后,某些百分比控件的位置和尺寸并不是正确的,可以使用updateSizeAndPosition来更新。

2. 控件尺寸百分比和位置百分比

当在一个控件的尺寸或者位置指定为百分比类型时,那么再对它使用setPositionsetContentSize是没有用。当发现一个控件进行位置和大小设置后没有变化,就应该先去查一查是不是设置为百分比类型了。