If I create new “Empty (2d)” project then a scene with 1 camera is pre-created there.
The camera default position and rotation is more like 3d scene though: position=-10,10,10 rotation=-35,-45,0 projection=“Perspective”.
If I add a label in the scene then new Canvas is created with another camera with these properties: (pos=0,0,1000, rot=0,0,0, projection=ortho). This camera is more like 2d way.
The default project settings is: design size=960x640 with fixed width.
Now, the label is shown in the middle of the canvas/screen even though the label’s position=0,0.
Canvas grid shows the origin at bottom-left corner.
I assume that only the second camera with ortho projection is used because it has higher priority. The main camera is of no use at this moment. Is this correct? Is there any purpose for the main camera in 2d application?
why is the label shown in the center of the canvas? It’s center position is at (480,320). The label is direct child of the canvas. What controls the origin in the canvas?
if I create a node and place another label (pos=0,0) in that node then again the label is in the center of the node. Where do I set the parent node coordinate system origin?
little off topic question: where do I set the scene which is shown at app startup?
I learned in docs that Canvas coordinates origin is always in the center. Suggestion there is to delete the canvas and use root node - of you resist on bottom-left origin. This did not work for me. I guess I’ll just get used to the new coordinates origin in the centre - not a big deal
Perhaps, could you point out a few advantages of this approach? What made you make this decision?
For 2d, the origin of the coordinates system are actually left bottom based, the reason you are seeing everything put in middle is because the canvas’s anchor point is centered. The design purpose is for user to easier adapt to different screens, our canvas will automatically adapt to the current running screen, and you can use widget to position your UI elements related to Canvas in percentage.
In a pure 2d project, you don’t need a 3d camera, feel free to remove it.
Normal node have UITransform component and anchor point can be changed
For 2d, the origin of the coordinates system are actually left bottom based, the reason you are seeing everything put in middle is because the canvas’s anchor point is centered.
Is not the anchor point used to position the canvas inside its parent rather than influencing the coordinates origin for its children? I did set the canvas anchor point to (0,0) and it had no influence on children positions.
It would be nice to have to bottom-left origin especially from legacy code prospective. The centered coordinate origin is carried from canvas to all its children which makes life a bit more complicated.
So what you say is the if I upgrade to Creator 3.5 then the bottom-left origin is already there?
For 2d-x engine the anchor point influence on children. Since Cocos Creator is a 3D engine, 3D Model rely heavily on anchor to represent its pivot. So in Cocos Creator anchor mainly used to influence it self. If we want to align it inside parent, we can use widget component rather than anchor.
You can create a containr to adjust the UI root anchor.
Set the anchor to (0, 0), and use a widget to ensure it aligned with Canvas.
