Cocos2d-x virtualJoystick

Hi Cocos2d-x Developers,
I need help on how to move a image/sprite by the joystick.

These are the codes, i did not write this.

Joystick.cpp

#include "Joystick.h"

#define PI 3.1415926

const std::string JoystickEvent::EVENT_JOYSTICK = "event_of_joystick";

JoystickEvent::JoystickEvent() {
	log(" JoystickEvent(), %p", this);
}

JoystickEvent::~JoystickEvent() {
	log("~JoystickEvent(), %p", this);
}

bool JoystickEvent::init() {
	return true;
}
//------------------------------------------------------------------------------------------------------------------------------------------------------
Joystick::Joystick() {
}

Joystick::~Joystick() {
	// 取消事件监听
	_eventDispatcher->removeEventListenersForTarget(this);
}

bool Joystick::init() {
	bool result = false;
	do {
		// 父类初始化
		if (!Layer::init()) {
			break;
		}
		// joystick的背景
		mJsBg = Sprite::create("joystick_bg.png");
		if (nullptr == mJsBg) {
			break;
		}
		mJsBg->setPosition(mJsPos);
		addChild(mJsBg);

		// joystick的中心点
		mJsCenter = Sprite::create("joystick_center.png");
		if (nullptr == mJsCenter) {
			break;
		}
		mJsCenter->setPosition(mJsPos);
		addChild(mJsCenter);

		// touch event监听
		auto touchListener = EventListenerTouchOneByOne::create();
		if (nullptr == touchListener) {
			break;
		}
		touchListener->setSwallowTouches(true);
		touchListener->onTouchBegan =
				CC_CALLBACK_2(Joystick::onTouchBegan, this);
		touchListener->onTouchMoved =
				CC_CALLBACK_2(Joystick::onTouchMoved, this);
		touchListener->onTouchEnded =
				CC_CALLBACK_2(Joystick::onTouchEnded, this);
		_eventDispatcher->addEventListenerWithSceneGraphPriority(touchListener,
				this);

		result = true;
	} while (0);

	return result;
}

bool Joystick::onTouchBegan(Touch *touch, Event *unused_event) {
	log("onTouchBegan");
	auto point = touch->getLocation();
	if (mJsCenter->getBoundingBox().containsPoint(point)) {
		// 若触摸点在joystick的中心点,则继续接受事件
		return true;
	}
	// 否则不接受后续事件
	return false;
}

void Joystick::onTouchMoved(Touch *touch, Event *unused_event) {
	log("onTouchMoved");

	// 1. 获得角度,
	//第一象限是0,90度
	//第二象限是90,180度
	//第三象限是-90,-180度
	//第四象限是-90,0度
	Vec2 point = touch->getLocation();
	double y = point.y - mJsPos.y;
	double x = point.x - mJsPos.x;
	double angle = atan2(y, x) * 180 / PI;
	int j, o;
	double xpos, ypos;
	j = (int)x;
	o = (int)y;
	xpos = x - j;
	ypos = y - o;
	log("---------------------------------          %f", xpos);
	log("------------------------------------          %f", ypos);
	// 2. 更新joystick中心点位置,目的是想让中心点始终在它的背景图范围
	// joystick背景图半径
	double jsBgRadis = mJsBg->getContentSize().width * 0.5;
	//触摸点到中心点的实际距离
	double distanceOfTouchPointToCenter = sqrt(
			pow(mJsPos.x - point.x, 2) + pow(mJsPos.y - point.y, 2));
	if (distanceOfTouchPointToCenter >= jsBgRadis) {
		//利用等比关系计算delta x y
		double deltX = x * (jsBgRadis / distanceOfTouchPointToCenter);
		double deltY = y * (jsBgRadis / distanceOfTouchPointToCenter);
		mJsCenter->setPosition(Vec2(mJsPos.x + deltX, mJsPos.y + deltY));
	} else {
		mJsCenter->setPosition(point);
	}

	//	 3. 分发joystick event
	JoystickEvent* jsEvent = JoystickEvent::create();
	jsEvent->mAnagle = angle;
	Director::getInstance()->getEventDispatcher()->dispatchCustomEvent(
			JoystickEvent::EVENT_JOYSTICK, jsEvent);
}

void Joystick::onTouchEnded(Touch *touch, Event *unused_event) {
	log("onTouchEnded");
	// 事件结束,还原joystick中心点位置
	mJsCenter->setPosition(mJsPos);
}

Joystick.h

#ifndef JOYSTICK_H_
#define JOYSTICK_H_

#include "cocos2d.h"
using namespace cocos2d;

class JoystickEvent: public Ref {
private:
	JoystickEvent();

public:
	virtual ~JoystickEvent();
	virtual bool init();CREATE_FUNC(JoystickEvent)
	;

public:
	static const std::string EVENT_JOYSTICK;
	double mAnagle;
//	double mX;
//	double mY;
};

class Joystick: public Layer {
private:
	Joystick();

protected:
	bool onTouchBegan(Touch *touch, Event *unused_event);
	void onTouchMoved(Touch *touch, Event *unused_event);
	void onTouchEnded(Touch *touch, Event *unused_event);

public:
	virtual ~Joystick();
	virtual bool init();CREATE_FUNC(Joystick)
	;

private:
	Sprite* mJsBg;
	Sprite* mJsCenter;
	Vec2 mJsPos = Vec2(100, 100);
};

#endif /* JOYSTICK_H_ */

Please help me.

Try this one

1 Like

Ohhh thanks,
But how can you move the sprite?, can you teach me because i don’t know how and im new in c++ programming.

Or how do you move the sprite/image by the ange.(Not to rotate)