## How to Make Fruit Slicing in Egretia Pro

In this tutorial, you’ll learn how to create a fruit slicing game by using Egretia Pro. There’s a lot to cover — so let’s get started!

1. Creating fruits

— Recognize the meshes and materials that make up the model

Fruit →3D model →Game entity

These 3D models can be imported through another program (such as 3dmax or Maya) or the meshes created by program

After creating a cube in the scene or dragging and drop a 3d model in Egretia Pro, you will find that each model contains two components:

• MeshFilter records the mesh data you want to display

• MeshRenderer shows the mesh how to render, such as which shader to use, whether to accept shadows and other settings

In the fruit slicing game, you’ve noticed that the fruit is cut into pieces by us. Thus, it’s time to create the model via programming. Here is some information mainly about mesh creation.

Attributes of mesh

• Vertex coordinates (vertex)

• Normal

• Texture coordinates (uv)

• Vertex Index

Vertex coordinates: The vertex coordinate array stores the spatial coordinates of each vertex of the Mesh. If a mesh has n vertices and each vertex is a three-dimensional coordinate point, the length of vertices equals n*3

Normal: The normal array stores the normal of each vertex of the mesh, and the length of normal is equal to the length of vertex

• The normal is the vector perpendicular to the surface. We usually use a normal vector of unit length, and the dyadic vector points to the outside of the surface instead of the inside.

• The normal can be used to determine the angle between the light and the vertex.

Texture coordinates: It defines the information of the position of each point on the image. Combining with the 3D model, these points determine the location of the surface texture map. UV provides an accurate correspondence with each point of image for surface of the model object. uv[i] corresponds to vertex[i]

Vertex index: Each mesh is composed of several triangles, and the three points of the triangle are the points in the vertex coordinates. And the sequence of these points’ connection is the vertex index.

Next, let’s compile a component to print the information of log and view the mesh information of Plane and Cube.

Build Mesh

Firstly, create a 3d entity;

Secondly, add MeshFilter and MeshRender components to the entity;

Thirdly, implement the mesh property in the MeshFileter component with code;

Lastly, add materails material to MeshRender;

2. Slice the fruit

Firstly, determine the position and the surface to cut, and add the Cut component to the target when the space bar is clicked

Secondly, classify the vertices of the model into the upper and lower parts according to the cut surface;

Then, find out the triangular separated by cutting

Then, calculate the new vertices

Lastly, create two models by the vertices, normal, UVs and indexes

3. How to generate the new slicing

> Create a sliced entity

> Create the attribute of Mesh in MeshFilter components of the sliced entity

The several key attributes of Mesh:

• Vertex coordinates (vertex) — the point created by cutting

• UV

• Vertex normal — consistent with or opposite to the normal of the tangent point

• Vertex Index — form triangles by connecting the cutting points according to the counterclockwise attributes

Ø Create the attribute of material in MeshRender components of the sliced entity

Ø Repeat the slicing

4. Slice the fruits with flying knives

Add CutController component to the scene

Setting in onstart:

• Initialize the mesh information of all presets;

• Create the first entity to be cut;

• Initialize the position of the blade;

Setting in onUpdate:

• Add Cut components to the cutting object;

• When the position of blade reaches the bottom, update the blade position and update the next cutting object;

Several main categories:

CutFly, CutFlyPool — — slicing cube and slicing management

CutFillFace,CutFillFacePool- the sliced surface and its management

CutFlySystem — — -Process the animation of the flying slicing (including a cut and the newly generated cut surface and the last slicing) and recycling operations

CutEntityAttributesFactory — — Saves preset mesh information

There is a variety of fruits and multiple type of knives in the game, and we’ll put the information of these fruits and knives in the configuration table.

2. According to the information in the configuration table, load the information of fruit and knife;

Stay tuned for updates from the Egretia official channels below so that you can be involved in all the exciting things to come!

Egretia Telegram: https://t.me/Egretia

Egretia Website: https://egretia.io/

## Develop a Wheel of Fortune Game | Tutorial for Beginners

This is a fun and simple tutorial for game developers since we are going to build a wheel of fortune game. Let’s get started!

Demonstration

Development Procedures

1. Create a Luck class for the main logic

Luck class is inherited from container `egret.DisplayObjectContainer`

2. Data initialization

3. Create a red button to spin (creatbtn)

Center the button: change the default anchor point of the button in the upper left corner to the center of the button this.btn.anchorOffsetX = this.btn.width / 2; this.btn.anchorOffsetY = this.btn.height / 2; Then make the button position in the center of the entire stage. However, the width and height of the stage cannot be obtained by directly using this.stage.stageWidth since there is nothing on the stage when the button is created. As such, students can create a date class to store global data. In this tutorial, two static attributes STAGEWIDTH and STAGEHEIGHT are directly added to main.ts. The specific methods are as follows:

4. Arrange all the prizes in a circle

You will get the prompt when using comments with /***/. When there are many parameters, you can use @param in the comment line to declare the function of each parameter.

5. Respond to click events

Remove the monitoring of the current click in the ‘click’ event to prevent multiple clicks on button.

In the timer, you can directly use timer.delay to change the delay of the timer in milliseconds.

Stay tuned for updates from the Egretia official channels below so that you can be involved in all the exciting things to come!

Egretia Telegram: https://t.me/Egretia

Egretia Website: https://egretia.io/

## Egretia Engine: Development procedure for accessing the Xiaomi Quick Games

1.Environment Configuration

>Egretia Launcher V1.0.62 or above

>Egretia Engine V5.2.17 or above

>Install npm

2. The game creation

1)After the creation via Egretia Launcher, the project will be shown on the list. Then developers can click the release settings

2) Select the Xiaomi Quick Game to create the game

3) After the creation, developers can click the button to release the game

a. Compile the game code to Xiaomi Quick Game: to execute command egret build — target qgame and compile the code in the Egretia project into the Quick Game project;

b. QR code: to install rpk by scanning the QR code on the Xiaomi Quick Game Debugger

c. Release: to execute the command npm run build and build rpk package

d. Debugging: use the USB cable to connect your computer to the Xiaomi device and click the debug button then the debugging interface will start automatically in Chrome

3. Publish to Xiaomi Quick Game by the command line

Method 1: Developers can use the command line to build and release Xiaomi Quick Game

>debug: egretia build — target qgame；

>release: egretia publish — target qgame

Method 2: Deploy the template: egretProperties.json

As it shows, developers can execute the command line egretia build or egretia publish to build and release Xiaomi Quick Game when property current is set to qgame in the configuration files of egretProperties.json

4. Package and release Xiaomi Quick Game by the command line

1)Execute the command line npm run build and generate a dist file. The file com.application.demo.debug.rpk is the Quick Game Project file, which can be debugged on the devices.

2) Generate the Quick Game to be released by executing the command line

npm run release

3) Listed below is the Quick Game structure

4) An overview of directory structure:

egret.qgame.js： Adaptation layer code of Egretia engine and Quick Game;

js folder: js code of the game;

library：the code of local cache of running Xiaomi Quick Game by Assetsmanager can be deleted；

main.js：the entry file of Quick Game;

manifest.js: to load all js codes;

manifest.json: the configuration file of Quick Game

resources: resource files such as pictures and audio of the game

5) manifest.json

6) Parameter:

Package: the name of package;

Name: Application name, within 6 Chinese characters, consistent with the name saved in the application store, used to display the application name on desktop icons, pop-up windows, etc.;

versionName: the application version;

versionCode: The application version number, which is incremented from 1. It is recommended to add 1 to the current version every time the package is re-uploaded;

minPlatformVersion: The minimum supported platform version number (1041), for compatibility check, can avoid the incompatibility caused by running on low version platforms after going online; if not filled in, it will be processed according to the internal test version;

icon: The path of the application icon, the size is 192×192;

orientation: the Supported screen orientation. Portrait is vertical screen, and landscape is horizontal screen. This parameter will be automatically obtained from index.html of the Egretia game project.

4. Debugging

Note: The debugging must be based on the physical device.

1) Install Xiaomi Quick Game Debugger and Xiaomi Quick Game Environment

2) Use a USB cable to connect your computer to your Xiaomi device and copy the generated quick game rpk file to the devices

3) Open the Xiaomi Quick Game Debugger, choose (com.miui.hybrid) and click Local Install, then select the uploaded rpk files to run the game

4) Input chrome://inspect/#devices on the Chrome browser and click Enter to generate com.miui.hybrid. the debugging information will pop out on the screen

Stay tuned for updates from the Egretia official channels below so that you can be involved in all the exciting things to come!

Egretia Telegram: https://t.me/Egretia

Egretia Website: https://egretia.io/

As Taobao Mini Program goes mainstream, brand owners have a growing need to increase their brand value and gain more users and market share through Alibaba. As such, Egretia engine allows developers to launch the game on Taobao quickly.

Development procedure for accessing Taobao Mini Program

1. Preparation

> Register a retailer account on Taobao

> Call APIs such as game sign-in and user information provided by Taobao

> Egretia engine V5.3.10 or above

> Egretia Launcher V1.2.22 or above

2. The game creation and package

1）Create a game via Egretia Launcher or import the existing project on Egretia

2) After creating or importing is done, it will be shown on the list. Then developers can click the release settings

3) Select Taobao Mini Program to create the game

4) After the creation, developers can click the button to release the game

5) The type of game code: compile the code in the Egretia project into Taobao project;

• debug: js code is not obfuscated by uglify, which is convenient for debugging;

• release: the uglify obfuscation and compression for js code;

6) Taobao Mini Program structure:

· app.css ：files of application, no modification in general

· app.js：register app, to receive the notification of running, display and hiding

· app.json：the configuration file

· js directory：js code of game

· manifest.js：to load dependent js files

· mini.project.json：to configure the files format.(set the special format here)

· package.json：description file

· pages/index files：

· egret.tbgame.js：Adaptation layer code of Egretia

· index.axml：the page of entry

· index.js：entry files

· tools files：tools (no editing)

· resource : resource files such as pictures and audio of the game

• Click to select the app for retailer, and then install it on the phone

• Select the application

Associate the application on the upper left and click the real-device test on the upper right. After the compilation is completed, please scan the code for debugging via Taobao mobile APP

4. Notes

1). Due to security issues, the platform does not support the API of my.request network request. However, it supports most of the network request methods through other APIs. If you still have problems with your game, please use cloud development

2). When loading remote resources, the resources must be placed under the domain name of Ali, please consult Taobao’s technical support for details;

3). The text input function provided by the platform is very weak, please test first to check the effect;

4). The created egret.Sound must be destroyed by calling the sound.close() method when it’s not in use;

5). Horizontal screen games is not available;

6). iOS does not support websock real-device debugging, but preview mode can be used;

7). iOS does not support local sound playback for the time being, and the sound loaded on the network is available;

8). You cannot directly call the window object without \$global.window;

9). The emulator does not support functions such as sound playback, please refer to the real-device test.

Stay tuned for updates from the Egretia official channels below so that you can be involved in all the exciting things to come!

Egretia Telegram: https://t.me/Egretia

Egretia Website: https://egretia.io/

## Egretia Engine Update: Support Huawei Quick Game

Development procedure for accessing the Huawei Quick Game:

1. Preparation

>Register as a developer on Huawei Quick Game

>Call APIs such as game sign-in and user information provided by Huawei

> Note that the size of released rpk file is less than 10MB

2. The game creation and package

1）Create a game via Egretia Launcher or import the existing project on Egretia

2) After creating or importing is done, it will be shown on the list. Then developers can click the release settings

3) Select the Huawei Quick Game to create the quick game

4) After the creation, developers can click the button to release the game

Compile the game code to Huawei Quick Game: compile the code in the Egretia project into the Quick Game project;

• The type of game code -debug: js code is not obfuscated by uglify, which is convenient for debugging;

• The type of game code -release: the uglify obfuscation and compression for js code;

5） After release, the rpk files will be generated in dist files

6） Huawei Quick Game Structure

• Build directory:

o egret.fastgame.js: Adaptation layer code of Egretia engine and Quick Game;

o game.js: the entry file of Quick Game;

o icon directory: game icons;

o js directory: js code of the game;

o manifest.js: to load dependent js files;

o manifest.json: the configuration file of Quick Game

o resources: resource files such as pictures and audio of the game;

o dist directory: to store compiled rpk files;

o sign: to store signature files;

o signtool: a compilation tool for Quick Game;

7） Through the “Modify Configuration” tab of the Launcher, developers can modify the relevant parameters of Huawei quick game

• Note that developers need to republish the rpk for the new parameters to take effect after modifying the parameters;

• The minimum platform version number is 1075;

• Click to select the compiled rpk package, and then install it on the phone

There are two types of the signature of Huawei Quick Game: debug and release. We provide a default debug signature for developers to package and debug. But if developers want to use platform functions such as log-in and user information, they must use the release signature.

• On the release tab of the Launcher, developers can select Release as the signature type, and click the “Open” button on the right to open a folder, and then import the generated signature file;

• After re-release, the generated rpk package is signed with release;

• Note: For signatures generated by Huawei tools, the fingerprint of the certificate must be filled in the project settings in the background of Quick Game.

Stay tuned for updates from the Egretia official channels below so that you can be involved in all the exciting things to come!

Egretia Telegram: https://t.me/Egretia

Egretia Website: https://egretia.io/

## Egretia Engine Upgrade: Support Bytedance’s Mini Games

Support Bytedance’s Mini Games

Kind reminder:

To execute, developers shall use the latest version of Egretia engine and Egretia Launcher

# Egretia Compiler

In this case, developers only need to install the latest version of Launcher and download Egretia Compiler in the [Tools] tab, which can be used more easily without executing the npm install command in each project.

Besides, here is an update on webpack:

• legacy mode

o Fix the decorator sorting problem;

o Fix the error of namespace;

o Fix the problem that the global enumeration cannot be accessed;

o Fix the compilation error caused by .d.ts in the src folder;

o Modify the .ts matching rules in legacy mode and adopt the configuration in tsconfig.json instead of hard-coded the src folder;

• Linux platform support;

• Fix the problem that Egretia.is returns incorrect results after compilation;

• Optimize the output volume which has been reduced about 20%

# Egretia UI Editor

• Add right click to resource library -> copy resource name;

• Exml source code supports formatting;

• Support drag the skin by pressing the right button;

• The resource manager supports deleting files through the Delete key;

• The right-click menu item displays the corresponding shortcut keys;

• The interface can be zoomed by the mouse wheel in the preview state;

• Adjust the step length of the size & position part of the attribute item to 1, which is more user-friendly;

•To change the shortcut skin of Button by dragging and dropping resources to the input box

• The custom components are sorted alphabetically for easy search;

• The component frame is drawn by canvas, and the skin editing is smoother;

• Fix that clicking may cause the component level to be changed in some cases

• Fix that frequent changes to the component location may cause the editor to crash;

• Fix the issue that the list in the Ctrl+P shortcut to open the file is not updated synchronously after the file is changed

• Fix the problem that the interface is not updated in real time after changing the component skin;

# Document

• Optimize the page loading speed from an average of 2 seconds to an average of 300 milliseconds

• Upload multiple documents and remove some outdated documents

• All the sample codes in the document are written in ES2015 version, e.g. declare Variables with let and const

Stay tuned for updates from the Egretia official channels below so that you can be involved in all the exciting things to come!

Egretia Telegram: https://t.me/Egretia

Egretia Website: https://egretia.io/

## Create A Space Shooter Game | Egretia Engine Tutorial For Beginners Part 7

This is the seventh part of Egretia Engine tutorial, showing how to build a space shooter game!

Part 1 https://bit.ly/32xy7r3

Part 2 https://bit.ly/2CV2CfC

Part 3 https://bit.ly/39uicLD

Part 4 https://bit.ly/3jJui8p

Part 5 https://bit.ly/31boR9Q

Part 6 https://bit.ly/31mFM9j

Demonstration

Main

Main

public canvasIndex:number; // Interface index

Construct：

this.game= null;

Main

Add the following codes to touchdown,touchMove,touchup and update：

switch(this.canvasIndex)

{

case 10:

break;

case 20:

this.game.touchDown(e);

break;

}

try {

//menu belongs to the name of group and its background is saved in its group

}

catch (e) {

console.error(e);

}

}

public async touchDown(e:egret.TouchEvent)

{

//remove the interface

this.main.game = new MainGame(this.main);

}

this.main.removeChild(this);

this.main.game.reset(0); // 0 is the game level

this.main.canvasIndex = 20;

}

//remove the interface

Main

> Singleton Pattern and Create JSON

An implementation of the singleton pattern must:

ensure that only one instance of the singleton class ever exists;

JSON is an open standard file format, and data interchange format, that uses human-readable text to store and transmit data objects consisting of attribute–value pairs and array data types (or any other serializable value). It is a language-independent data format and a very common data format, with a diverse range of applications.

> Basic concepts of game design and game development：Separate data and logic

{
“playV”: 30, ”:”player’s speed”,
“zdV”: 10, ” :” Bullet rotational speed”
}

Create JSON file and import resources

What are the coolest projects you saw from people using Egretia engine?

Stay tuned for updates from the Egretia official channels below so that you can be involved in all the exciting things to come!

Egretia Telegram: https://t.me/Egretia

Egretia Website: https://egretia.io/

## Create A Space Shooter Game | Egretia Engine Tutorial For Beginners Part 6

This is the sixth part of Egretia Engine tutorial, showing how to build a space shooter game!

Part 1 https://bit.ly/32xy7r3

Part 2 https://bit.ly/2CV2CfC

Part 3 https://bit.ly/39uicLD

Part 4 https://bit.ly/3jJui8p

Part 5 https://bit.ly/31boR9Q

Demonstration

>Lasers

public dx:number;

public dy:number; // Offset value based on player coordinates

public static fi:number = 0 ; // animation frames of laser

//Type

case 10:

//build a picture frame

this.im=Main.createBitmapByName(“pzd4”+ZD.fi+”_png”);

/insert a picture after every shooting

ZD.fi++;

if(ZD.fi >= 10) ZD.fi = 0;

//shoot once every pass of main loop, the distance is 80

this.vy = -80; //-80 upwards

this.vx = 0 ;

this.dx = this.dy = 0 ;

this.n = 0;

break;

update()：

//the special one will be scheduled in advance and automatically executed. The “return” will show up when it finishes.

if(this.id == 10){

//the distances between planes and them

this.dx +=this.vx;

this.dy +=this.vy;

//offset value：base value+offset

// coordinates of laser is base coordinates and changes

this.x = this.game.player.x + this.dx;

this.y = this.game.player.y + this.dy;

// test whether it’s off-screen

if(this.y < -100 ){

this.vis = false;

}

return;

}

>Tracking bullet

Demonstration

Version:1.0 StartHTML:000000275 EndHTML:000053955 StartFragment:000021508 EndFragment:000053873 StartSelection:000021508 EndSelection:000053869 SourceURL:https://medium.com/egretia/create-a-space-shooter-game-egretia-engine-tutorial-for-beginners-part-6-a93d80fc08de Create A Space Shooter Game | Egretia Engine Tutorial For Beginners Part 6 | by Egretia Io | Egretia | Aug, 2020 | Medium

1）NPC：

NPCManager

//obtain NPC

public getNPC():NPC{

//length>0,NPC exists; if no, bounce off

if(this.nm.length > 0 ){

//if there is npc, choose one randomly

let npc = this.nm[Math.floor(Math.random()* this.nm.length)]

// decide whether NPC stays in the screen or not

if(npc.x > 0 && npc.x < 480 && npc.y > 0 && npc.y < 800){

return npc;

}

}

//no findings, null

return null;

}

2）calculate the angle to hit NPC
3）update the angle

Apply
public npc:NPC; //the target

/track the bullet

case 20:

this.im = Main.createBitmapByName(“pzd1_3_png”);

this.npc = null;

break;

update()

// the special one will be scheduled in advance and automatically executed. The “return” will show up when it finishes.

if(this.id == 20){

let bn = 0 ; //target angle: upward

if(this.npc == null){

this.npc = this.game.nm.getNPC();

}else{

bn = Math.atan2(this.npc.x -this.x,this.y-this.npc.y);

// This angle is in radians, which will be converted into angle values

bn = bn * 180/ Math.PI;

}

//N angle limit: -180°~180°

while(this.n <= -180)

this.n += 360;

while(this.n > 180)

this.n -= 360;

//if the angle difference is below 5, the two angles are approximately identical

if(Math.abs(this.n — bn) < ZD.VN){

this.n = bn;

}else{

//

if(this.n < bn){

if(this.n < bn — 180)

this.n -= ZD.VN;

else

this.n += ZD.VN;

}else{

if(this.n > bn + 180)

this.n += ZD.VN;

else

this.n -= ZD.VN;

}

}

// convert into angle values

// refresh the speed and angle

this.vx = this.v * Math.sin(this.n * Math.PI / 180);

this.vy= -this.v * Math.cos(this.n * Math.PI / 180);

this.im.rotation = this.n;

this.x +=this.vx;

this.y +=this.vy;

//test the border

if(this.x < -100 || this.x > 580 || this.y < -100 || this.y > 900){

this.vis = false;

}

return;

}

while(this.n <= -180)

this.n += 360;

while(this.n > 180)

this.n -=360;

//track the bullet

this.t++;

if(this.t >= 10){

this.game.zm.create(20,this.x,this.y,15,135,this.game);

this.game.zm.create(20,this.x,this.y,15,-135,this.game);

this.game.zm.create(20,this.x,this.y,15,45,this.game);

this.game.zm.create(20,this.x,this.y,15,-45,this.game);

this.t = 0 ;

}

## > The cases of players

0 exit the game
1 playing the game
10 win the game and wait
11 win the game and exit

switch(this.m){

case 0 :

this.y -=this.v;

if(this.y <= 400){

this.m =1;

this.t = 0 ;

}

break;

case 1 :

this.fire();

this.movePlayer();

break;

case 10:

this.t++;

if(this.t >= 20){

this.t = 0;

this.m = 11;

}

break;

case 11:

this.y -=this.vy;

this.vy +=3;

if(this.y < -200){

// the switch of winning the game

}

break;

}

MovePlayer

public movePlayer(){

if(this.isDown == true ){

let a = this.ny — this.oy;

let b = this.nx — this.ox;

let c = Math.sqrt(a*a + b*b);

if( c > this.v){

this.vx = this.v*b/c;

this.vy = this.v*a/c;

this.ox += this.vx;

this.oy += this.vy;

}else{

this.vx = b;

this.vy = a;

this.ox = this.nx;

this.oy = this.ny;

}

// plane will set off at the speed

this.x +=this.vx ;

this.y +=this.vy ;

//test the border

if(this.x < 0)

this.x = 0;

else if(this.x > 480)

this.x = 480;

if(this.y < 0)

this.y = 0;

else if(this.y > 800)

this.y = 800;

}

else{

this.vx = 0;

}

if(this.vx < 0 ){

//fly towards the left side：

if(this.fi > -2)

this.fi — ;

}else if(this.vx > 0)

{

if(this.fi < 2)

this.fi++;

}

else{

this.fi = 0 ;

}

this.resetFI();

}

## >public isHit(x:number , y:number):boolean{}

public isHit(x:number , y:number):boolean{

// this.x this.y is the center of a circle， 60 is radius

// Formula of the distance between two points

if(this.bhT > 0 ){

if((this.x -x )*(this.x -x ) + (this.y -y )*(this.y — y ) < 60*60){

return true;

}

return false;

}

if(this.m !=1)

return false;

if(Math.abs(this.x — x) < 20 && Math.abs(this.y -y )<20){

//death of players

return true;

}

return false;

}

for(let i = 0 ; i < 10 ; i++){ //ring

let dn =Math.random()*Math.PI * 2;

for(let j = 0 ; j < 15 ; j ++) //the bombs of each ring

{

this.game.tm.create(0,

this.x + (i+1)*30* Math.sin(dn+Math.PI*2*j/15),

this.y + (i+1)*30* Math.cos(dn+Math.PI*2*j/15),

i,Math.random() * 10 +5,this.game);

}

}

this.x = 240;

this.y = 1000;

this.m = 0 ;

this.t = 0;

}

## > Players’ Shield

public bh:egret.Bitmap; // shield photo
public bhT:number; // shield timer: last 3 seconds
this.bh.anchorOffsetX = this.bh.width/2;
this.bh.anchorOffsetY =this.bh.height/2;
this.bh.scaleX = this.bh.scaleY = 0.5;
this.bhT = 60; // three seconds for 60 passes of main loop

Update;
//shield effective time>0. Visible = false when it comes to 0

if(this.bhT > 0 ){

this.bhT — ;

if(this.bhT <=0){

this.bh.visible = false;

}

}

NZDManager

if(this.game.player.isHit(one.x , one.y) ==true ){

one.vis = false;

if(this.game.player.m == 1 && this.game.player.bhT <= 0 ){

}

}

this.bhT = 60;
this.bh.visible = true;

## > Win the game and Game level switch

BOSS0

for(let i = 0 ; i < 10 ; i++){ //ring

let dn =Math.random()*Math.PI * 2;

for(let j = 0 ; j < 15 ; j ++) //the number of bombs of each ring

{

this.nm.game.tm.create(0,

this.x + (i+1)*30* Math.sin(dn+Math.PI*2*j/15),

this.y + (i+1)*30* Math.cos(dn+Math.PI*2*j/15),

i,Math.random() * 10 +5,this.nm.game);

}

}

this.nm.game.player.win();

}

//pass

public win(){

this.t = 0 ;

this.m = 10; //Player will fly off the screen after victory

}

2）Level switch
Maingame:

apply public level:number; // to figure out the current level
construct：this.level = 0;

Maingame:

public reset(level:number)

{

this.level = level;

this.player.reset();

this.bg.reset();

this.nm.reset();

}

BG

public reset(){

switch(this.game.level){

case 0:

for(let i = 0 ; i < 2; i ++){

this.bg[i].texture = RES.getRes(“bg11_jpg”);

}

break;

case 1:

for(let i = 0 ; i < 2; i ++){

this.bg[i].texture = RES.getRes(“bg31_jpg”);

}

break;

}

}

NPCManager

//clean out

public reset(){

//the total length. To find out all the bullets by circulation

for(let i = 0 ; i < this.nm.length ; i++){

//find out every bullet

let one = this.nm[i];

this.removeChild(one);

this.nm.splice(i ,1);

i — ;

}

this.t =0;

this.cID = 0;

}

Player

for(let i = 0 ; i < 10 ; i++){ //rings

let dn =Math.random()*Math.PI * 2;

for(let j = 0 ; j < 15 ; j ++) //the number of bombs for each ring

{

this.game.tm.create(0,

this.x + (i+1)*30* Math.sin(dn+Math.PI*2*j/15),

this.y + (i+1)*30* Math.cos(dn+Math.PI*2*j/15),

i,Math.random() * 10 +5,this.game);

}

}

this.x = 240;

this.y = 700;

this.m = 0 ;

this.t = 0;

this.bhT = 60;

this.bh.visible = true;

}

public reset(){

this.isDown = false;

this.x = 240;this.y = 1000;

this.m = this.t = 0;

this.bhT = 60; //it will take 3 seconds for 60 passes of main loop

}

What are the coolest projects you saw from people using Egretia engine?

Stay tuned for updates from the Egretia official channels below so that you can be involved in all the exciting things to come!

Egretia Telegram: https://t.me/Egretia

Egretia Website: https://egretia.io/

## Create A Space Shooter Game | Egretia Engine Tutorial For Beginners Part 5

This is the fifth part of Egretia Engine tutorial, showing how to build a space shooter game!

Part 1 https://bit.ly/32xy7r3

Part 2 https://bit.ly/2CV2CfC

Part 3 https://bit.ly/39uicLD

Part 4 https://bit.ly/3jJui8p

Demonstration

Programming

>Explosion

1）TX

public id:number; //Type

public vis:boolean; //vis is necessary in Factory pattern

public fi:number; //which animation frame it will play

public t:number; //timer, such as three passes of main loop

public m:number; //state

public l:number; //how long it will last

public tm:TXManager; // parent pointer

Constructor:

if(this.t > 0){

// it will be invisible in the storage system

//0 means “Get ready”， 1 means “Play”

this.visible = false;

this.m = 0;

}else{

this.visible = true;

this.m = 1 ;

}

TX

“`c

class TX extends egret.Sprite{

public im:egret.Bitmap;

public id:number; //Type

public vis:boolean; // vis is necessary in Factory pattern

public fi:number; // which animation frame it will play

public t:number; // timer, such as three passes of main loop

public m:number; //state

public l:number; // how long it will last

public tm:TXManager; // parent pointer

public constructor(id:number,x:number, y:number,

t:number,l:number,tm:TXManager) {

super();

this.id = id;

this.x = x ;

this.y = y;

this.t = t;

this.l = l;

this.m = 0;

this. fi = 0 ;

this.vis = true; // =false , the objects will disappear in the factory

this.tm = tm;

this.im = Main.createBitmapByName(“tx1_1_png”);

this.anchorOffsetX = this.im.width/2;

this.anchorOffsetY = this.im.height/2;

if(this.t > 0){

//it will be invisible in the storage system

//0 means “Get ready”， 1 means “Play”

this.visible = false;

this.m = 0;

}else{

this.visible = true;

this.m = 1 ;

}

}

public update(){

switch(this.m ){

//

case 0:

//timer

this.t — ;

if(this.t <=0 ){

//explode

this.visible = true;

this.m = 1; //play

}

break;

case 1 :

//start the animation

this.fi++;

//

if(this.fi >= this.l){

this.vis =false; //object destruction

}else{ //if it’s not over, switch frame

//switch frame: fi from 0 to 9，

//10 is the number of photos, fi is the animation frame, 1 is the length

this.im.texture = RES.getRes(“tx1_”+Math.floor(this.fi*10/this.l + 1)+”_png”);

}

}

}

}

TXManager

class TXManager extends egret.Sprite{

public tm:Array<TX>; //Array: to add or remove objects

public game:MainGame;

public constructor(game:MainGame) {

super();

this.game = game;

this.tm = new Array();

}

//each create needs one new

public create(id:number,x:number,y:number,t:number,l:number,game:MainGame){

//create bullet

let one = new TX(id,x,y,t,l,this);

//put it at the end of array

this.tm.push(one);

}

//find out and update all the bullets

public update(){

//the total length of storage system. Find out all of bullets by loop

for(let i = 0 ; i < this.tm.length ; i++){

// find out each bullet

let one = this.tm[i];

one.update();

//the extra bullets need to be removed

// bullets are out of screen ，vis == false.remove

if(one.vis == false){

//remove it from the scene firstly

this.removeChild(one);

//then remove it from storage system

this.tm.splice(i ,1);

//remove an object，length -1

i — ;

}

}

}

}

ZDManager

if(npc.hp <= 0 ){

for(let k = 0 ; k < 10 ; k ++){ //-50 to +50

this.game.tm.create( 0, npc.x + Math.random()*100 -50 ,

npc.y + Math.random()*100 -50 ,

Math.floor(Math.random() * 5), 10,this.game);

}

npc.vis = false;

>Effects of explosion

Add the following codes to NPC0，1

for(let k = 0 ; k < 10 ; k ++){

this.nm.game.tm.create( 0, this.x + Math.random()*100–50 ,

this.y + Math.random()*100–50 ,

Math.floor(Math.random() * 5), 10,this.nm.game);

}

}

then

>BOSS0

class BOSS0 extends NPC{

public im:egret.Bitmap;

public m:number;

public t:number;

public constructor(x:number,y:number,nm:NPCManager) {

super(nm);

this.x = x ;this.y = y;

this.im = Main.createBitmapByName(“boss50_png”);

this.im.anchorOffsetX = this.im.width/2;

this.im.anchorOffsetY = this.im.height/2;

this.m = this.t = 0;

this.hp = 1000;

}

public update(){

}

public isHit(x:number,y:number):boolean{

return false;

}

}

}

switch(this.m){

//where boss stops

case 0:

this.y+=10;

if(this.y >= 150){

this.t = 20 ;

this.m = 1;

}

break;

//break

case 1:

this.t — ;

if(this.t <=0){

this.m = 10;

this.t = 0 ;

}

break;

//set off the bullet

case 10:

this.t++;

// fire a single bullet every three passes of main loops

if(this.t % 3 == 0 ){

for(let i = 0 ; i < 5 ; i++){

//bullets in five rows

//160+i*10 fire a single bullet every angle of 10

this.nm.game.nzm.create(1, this.x, this.y, 10 ,160+i*10,this.nm.game );

}

}

if(this.t >= 20){

this.t = 10;

this.m = 1;

}

break;

}

Single bullet

Round-shaped bullet

//fire the bullet

case 10:

this.t++;

//fire a single bullet every three passes of main loop

if(this.t % 3 == 0 ){

for(let i = 0 ; i < 36 ; i++){

//bullets in five rows

//160+i*10 fire a single bullet every angle of 10

this.nm.game.nzm.create(1, this.x, this.y, 10 ,160+i*10,this.nm.game );

}

}

if(this.t >= 20){

this.t = Math.random()* 20 + 10;

this.m = 1;

}

break;

Swirl Bullet

case 11:

this.t++;

// the angle of bullets will change as t++ alters

this.nm.game.nzm.create(1, this.x, this.y, 10 ,180+this.t*10,this.nm.game ); //

Counterclockwise

this.nm.game.nzm.create(1, this.x, this.y, 10 ,180 — this.t*10,this.nm.game ); // clockwise

//fire the bullet every angle of 10

if(this.t >= 36){

this.t = Math.random()* 20 + 10;

this.m = 1;

}

break;

Matrix bullet

case 12:

this.t++;

//15，16，17，18，19 fire 5 bullets

if(this.t % 20 > 14){

for(let i = 0 ; i < 5 ; i++){

// fire a row every 20 degrees, 5 bullets from 130 degrees

//this.t/10，the result of top ten:10，11，12，13 when it comes to 1，the length = roundness*20

this.nm.game.nzm.create(1,this.x,this.y,10,Math.floor(this.t/20)*20 +130+i*5,this.nm.game );

// fire 5 bullets at 135 degree

}

}

if(this.t >= 100){

this.t = Math.random() * 20 + 10;

this.m =1 ;

}

break;

Whip-shaped bullets

// Whip bullet

case 13:

this.t++;

// the speed will increase as the time changes

this.nm.game.nzm.create( 1, this.x — 50, this.y, 6 + this.t *2 ,190 — this.t,this.nm.game );

this.nm.game.nzm.create( 1, this.x+50, this.y, 6 + this.t *2 ,170 + this.t,this.nm.game );

if(this.t >= 10){

this.t = Math.random() * 20 + 10;

this.m =1 ;

}

break;

Bullets Based on Orientation

Code:

// if n is null or empty, there is no value assigned

if(!n){

n = Math.atan2(this.game.player.x — x,y — this.game.player.y);

//note: convert the radians to degrees

n = n * 180/Math.PI;

}

BOSS0

//bullets based on orientation

case 14 :

this.t++;

// fire the bullets every ten passes of main loop

if(this.t % 10 > 4){

this.nm.game.nzm.create( 1, this.x — 50, this.y, 15);

}

if(this.t >= 50){

this.t = Math.random() * 20 + 10;

this.m =1 ;

}

break;

Random bullets

case1 this.m = Math.floor(Math.random() * 5 ) + 10; //random bullets

>Collision detection of irregular shapes

W 146 H166 73，83 pixels

What are the coolest projects you saw from people using Egretia engine?

Stay tuned for updates from the Egretia official channels below so that you can be involved in all the exciting things to come!

Egretia Telegram: https://t.me/Egretia

Egretia Website: https://egretia.io/

## Create A Space Shooter Game | Egretia Engine Tutorial For Beginners Part 4

This is the fourth part of Egretia Engine tutorial, showing how to build a space shooter game!

Part 1 https://bit.ly/32xy7r3

Part 2 https://bit.ly/2CV2CfC

Part 3 https://bit.ly/39uicLD

Demonstration

# Programming

>Use the factory pattern when NPC are unknown numbers of objects

1）Create NPC and NPCManager

2) NPCManager

> Finite State Machine (FSM)

Create id:number

Update

> Create array of NPCs

1）Randomly generated NPC

2）Time-related generation

3）Generated with arrays

>The relationship between factories

1）NPC bullets

Numbers of NPC bullets shots