Use CocosCreator to be a gold miner (1)

Posted May 28, 20202 min read

Recently I started to learn to use CocosCreator. I was suffering from not knowing what to do. I suddenly remembered the hottest game of 4399:Gold Miner.

First import the material I gave, open the newly created project, and create a folder
QQ screenshot 20200528091816.png
Ctrl + S save the scene, named main
image.png
Find this picture and drag it into the scene
image.png
In order to make the background fill the window, add a UI => Widget component to the background, as shown in the figure
image.png
Find all kinds of materials in the Atlas folder and build a scene like this
image.png
Let s talk behind the UI part, let s implement the ropes and hooks first
image.png
This part is such a hierarchical structure, I will explain step by step
image.png

The realization of the rope

Under the mineCar node, right click Create Node = "Render Node =" Monochrome, get a white rectangular block
Adjust color, anchor point and size as shown
image.png
The Y porridge of the anchor point is set to 1, the rope will use this point as the center of rotation
image.png
Create a new file Hook.ts in the Scripts folder and start writing the code for rope rotation
Hook.ts

//First define 2 variables
isRotating:boolean = true; //Whether the rope is rotating
rotateSpeed:number = 60; //rotation speed

//Rotate code
rotateHook(deltaTime) {
    if(! this.isRotating) {
        return;
    }
    //The angle here can be modified by yourself, not necessarily 60 degrees
    if(this.node.angle> = 60) {
        this.rotateSpeed   = -this.rotateSpeed;
    } else if(this.node.angle <= -60) {
        this.rotateSpeed   = Math.abs(this.rotateSpeed);
    }
    //The speed is 60 * deltaTime means 60 rotations per second
    this.node.angle + = this.rotateSpeed   * deltaTime;
}

Put in update

update(deltaTime) {
    this.rotateHook(deltaTime)
}

Click the run button
image.png
You will see that the rope has started to turn around
GIF.gif

Material link
https://gitee.com/ghjkg546/te...
After installing git, git clone the link
Don't take it for commercial use, just study and entertain yourself