最终效果图
英雄联盟皮肤选择
设计说明
实现目标所需要的动作
移动(MoveTo),伸缩(ScaleTo),倾斜(OrbitCamera)
x/(x+a)
其中a为常量,用来计算上面三个动作的值
大小
与原版Menu不同,大小不是全屏的,默认是屏幕的(2/3),可以通过setContentSize()函数设置
_index变量
将所有的菜单项平铺构成一个长方形,_index表示目前在中间位置的点,如下图
显示方式
将菜单项距中心的距离(i-_indxe)作为函数变量x,具体内容查看LOLMenu::updatePosition();
操作说明
滑动四分之一菜单宽的距离为一个单位的_index,距离大于0.6小于1.0的部分进1
使用
1.构造函数:LOLMenu::create()(由CREATE_FUNC创建)
2.添加MenuItem:void addMenuItem(cocos2d::MenuItem *item);
LOLMenu.h
#ifndef__LOL__TE_MENU_H__
#define__LOL__TE_MENU_H__
#include"cocos2d.h"
/*
*模仿英雄联盟的皮肤选择菜单
*不同点在于,英雄联盟当皮肤过多时,部分皮肤会移出边缘,不显示
*/
class
LOLMenu:
public
cocos2d::Layer{
:
//构造方法
CREATE_FUNC(LOLMenu);
void
addMenuItem(cocos2d::MenuItem*item);
//位置矫正修改位置forward为移动方向当超过1/3,进1
//true为正向false负
rectify(
bool
forward);
//初始化
virtual
init();
//重置显示所引号设置为0
reset();
//设置当前显示索引
void
setIndex(
int
index);
float
getIndex();
//返回被选中的item
cocos2d::MenuItem*getCurrentItem();
private
:
//更新位置
updatePosition();
//更新位置,有动画
updatePositionWithAnimation();
//数学计算式width*index/(abs(index)+CALC_A),其中CALC_A为常数
float
calcFunction(
index,
width);
:
_index;
//上一次菜单项的索引号
_lastIndex;
//菜单项集合,_children顺序会变化,新建数组保存顺序
cocos2d::Vector<cocos2d::MenuItem*>_items;
//监听函数
onTouchBegan(cocos2d::Touch*touch,cocos2d::Event*event);
virtual
onTouchEnded(cocos2d::Touch*touch,cocos2d::Event*event);
onTouchMoved(cocos2d::Touch*touch,cocos2d::Event*event);
actionEndCallBack(
dx);
//当前被选择的item
cocos2d::MenuItem*_selectedItem;
};
#endif
|
#include"LOLMenu.h"
#include<math.h>
#definePIacos(-1)
@H_641_403@
//菜单的缩小比例最小的比例是1-MENU_SCALE