[Cocos2d-x game engine development notes (13)] tiled map editor (1)

Original article, reproduced please indicate the source: http://blog.csdn.net/zhy_cheng/article/details/8308609

Tiled map editor is a Cocos2d-x-supported map editor, using tiled to edit the map can be easily used by the Cocos2d-x tiled official website is tiled map editor. The map editor I use is the QT version.

 

Now, let's try it.

1. edit a map

Select File -----> New File

Then select map -----> New Graph block, and select the image in examples under the tiled installation directory

Here, there is a black line in the middle and the far top of the picture, so the draw offset is 1 pixel, and the margin and spacing are all one.

Change the name of the layer to floor as the floor.

Lay the floor with bricks.

Create a new layer and change it to wall. Put your favorite things on it. I designed it as follows:

 

The next step is to set the main character, which is also a difficult step.

Select layer ------> Add Object layer, and change the Object layer to hero.

Now add an object to the Object layer. Click Add object on the toolbar and drag an object out of the map. Right-click the block and change it to the following:

We can see that we can add names and values below, which are actually Key-value pairs. It will be used in the future and is not necessary yet.

Now, the map is edited. Set the parameters first, click Edit -----> parameter, and set it

Save the map.

2. Use a map

Use the text editor to open the map you just edited.

<Image Source = "D:/application/tiled/examples/tmw_desert_spacing.png" width = "265" Height = "199"/>

Change

<Image Source = "tmw_desert_spacing.png" width = "265" Height = "199"/>

Create a project for a new Cocos2d-x to copy map files and open block files to the resource folder.

Add in header file

cocos2d::CCTMXTiledMap *_tileMap;

Delete the menu, Genie, and text code in the init function and add the following code:

_tileMap=CCTMXTiledMap::create("theMap.tmx");addChild(_tileMap);

Compile and run the program. The effect is as follows:

 

The following shows the location of the genie from the map and adds the declaration of the genie to the header file.

cocos2d::CCSprite *_player;

Add the following code to the source file:

Cctmxobjectgroup * objects = _ tilemap-> objectgroupnamed ("hero"); // obtain the object Layer ccdictionary * spawnpoint = objects-> objectnamed ("Pa "); // obtain the object const ccstring * x = spawnpoint-> valueforkey ("X"); // obtain the object coordinate const ccstring * Y = spawnpoint-> valueforkey ("Y "); //////////////////////////////////////// /////////// char * tempx = new char [30]; // The code here converts ccstring to intchar * Tempy = new char [30]; memset (tempx,); memset (Tempy,); sprintf (tempx, x-> getcstring (); sprintf (Tempy, Y-> getcstring (); int PX = atoi (tempx); int py = atoi (Tempy); Delete tempx; delete Tempy; //////////////////////////////////////// /// // _ player = ccsprite:: Create ("www.png"); _ player-> setposition (CCP (PX, Py); addchild (_ player );

Here, you can create a genie and obtain the genie location from the map to set the genie location. Below is

 

Next let this hero move, first add the mouse response, add the following code in init

CCDirector::sharedDirector()->getTouchDispatcher()->addTargetedDelegate(this,0,false);

Then overwrite the mouse Response Message of the parent class

bool HelloWorld::ccTouchBegan(cocos2d::CCTouch *pTouch, cocos2d::CCEvent *pEvent){return 1;}void HelloWorld::ccTouchEnded(cocos2d::CCTouch *pTouch, cocos2d::CCEvent *pEvent){cocos2d::CCPoint pp=pTouch->getLocation();if(fabs(pp.x-_player->getPosition().x)>=fabs(pp.y-_player->getPosition().y)){if(pp.x>=_player->getPosition().x){_player->setPosition(ccp(_player->getPosition().x+32,_player->getPosition().y));}else{_player->setPosition(ccp(_player->getPosition().x-32,_player->getPosition().y));}}else{if(pp.y>=_player->getPosition().y){_player->setPosition(ccp(_player->getPosition().x,_player->getPosition().y+32));}else{_player->setPosition(ccp(_player->getPosition().x,_player->getPosition().y-32));}}}

Here, return true in cctouchbegan to process the event in cctouchended.

The principle is to first determine whether the point clicked by the mouse is at a large distance from the current hero point in the X direction or in the Y direction. If the distance is large in the X direction, the left side of the X is changed, if the distance is large in the Y direction, the Y coordinate is changed. Then hero moves toward the click point.

Below is

 

Well, the effect has been reached. The next article continues the tiled map editor. Welcome to continue with your attention.

 

The source code is to be attached, of course, zero points: Click to download.