Coordinate System of Cocos2d-x 3.x, cocos2d-x3.x

Coordinate System of Cocos2d-x 3.x, cocos2d-x3.x

* *********************************** Please specify the source: bytes ********************************************

Continue to break down the basics,

Today's research -- Coordinate System

Content:

> UI coordinates

> OpenGLzuobiao

> World coordinates and model coordinates

1. About Coordinate System

Coordinate Systems are very important in the development of graphic images and game applications.

During application development on Android, iOS, and other platforms, the origin of the Two-dimensional coordinate system is in the upper left corner.

In the Cocos2d-x coordinate system, the origin is in the lower left corner, and Cocos coordinate system is divided into the world coordinate system and model coordinate system.

2. UI coordinates

UI coordinates refer to the coordinates used for Android, iOS, and other application development,

Like:

The origin of the UI coordinates is in the upper left corner, the right direction of the X axis is positive, and the downward direction of the Y axis is positive.

As mentioned above, the default Coordinate System of the cocos2d-x is not like this, but not all,

When you touch an event, the coordinates that you touch are the UI coordinates,

As shown in the following figure, Vec2 touchLocation = touch-> getLocationInView ();

Of course, we can also perform Coordinate Transformation to convert it into the default coordinates of the cocos2d-x:

Vec2 touchLocation2 = Director: getInstance ()-> convertToGL (touchLocation );

3. OpenGL coordinates

OpenGL coordinates are three-dimensional coordinates,

Because the underlying cocos2d-x uses OpenGL rendering, the default coordinate is OpenGL coordinates, but only two dimensions.

If the Z axis is not considered, the origin of OpenGL coordinates is in the lower left corner:

PS: the three-dimensional coordinates are divided into the left-hand coordinates (the Z axis points forward to the screen) and the right-hand coordinates (the Z axis points forward to the outside of the screen) based on the zaxis points to different ).

OpenGL coordinates are the right hand coordinates, and Microsoft platform Direct3D is the left hand coordinates.

4. World coordinates and model coordinates

Because OpenGL coordinates can be divided into world coordinates and model coordinates,
So cocos2d-x coordinates are also divided into world coordinates and model coordinates.
Two different coordinates are created for different objects,
For example:

Location of Point:
The coordinates of the world, that is, point A is (5, 5)

The model coordinates can be referenced by point B, that is)

Since the coordinates of these two different references must be converted to each other,
The cocos2d-x provides several functions:
> Convert world coordinates to model coordinates
Vec2 convertToNodeSpace (const Vec2 & worldPoint );
> Convert the touch point of the world coordinates to the model coordinates.
Vec2 convertTouchToNodeSpace (const Vec2 & worldPoint );
> Convert the model coordinates to the world coordinates.
Vec2 convertToWorldSpace (const Vec2 & nodePoint );

In the Cocos2d-x, each Node has an anchor,
This anchor is the same as the left-right-center point in the Word editing text,
It represents the center of the Node. Every time we set position, we actually put the position of the anchor.
For example, we set the anchor of an image in the center of the image to show it in the center of the background. The image is in the center of the image. If we set an anchor of an image in the upper left corner, display the image in the center of the background. The entire image is located in the lower right corner of the background, just like the following figure:
Center Position

// Add a Buttonauto node1 = Sprite: create ("button1.png"); node1-> setAnchorPoint (Vec2 (0.5, 0.5); node1-> setPosition (Vec2 (visibleSize. width/2, visibleSize. height/2); this-> addChild (node1, 0 );

Upper left corner

// Add a Buttonauto node1 = Sprite: create ("button1.png"); node1-> setAnchorPoint (Vec2 (0.0, 1.0); node1-> setPosition (Vec2 (visibleSize. width/2, visibleSize. height/2); this-> addChild (node1, 0 );

There are also conversions between two different coordinate systems relative to the anchor:
> Convert the world coordinate system to the model coordinate, relative to the anchor
Vec2 convertToNodeSpaceAR (const Vec2 & worldPoint );
> Convert the touch point of the world coordinates to the model coordinate, relative to the anchor
Vec2 convertTouchToNodeSpaceAR (const Vec2 & worldPoint );
> Convert the model coordinates to the world coordinates, relative to the anchor.
Vec2 convertToWorldSpaceAR (const Vec2 & nodePoint );

* *********************************** Please specify the source: bytes ********************************************