"Salted fish Tutorial" jszip Compression and decompression tutorial

Engine version 3.0.6

Tutorials Directory
Why should I use Jszip?
ii How to use Jszip
2.1 Download Jszip Library
2.2 Importing Jszip Libraries
2.3 Loading and decompression ZIP code
Three demo source download

Why should I use Jszip?
When there are a large number of configuration files in the game, in order to reduce the number of loads and transfers, the files are packaged in Zip, Loaded and decompressed in Egret to get the data.

In large games, there is inevitably a lot of game configuration files.




In order to reduce the number of loads and transfers, we packed these files into zip in advance, then loaded them in Egret and extracted the data using the Jszip library.






ii How to use Jszip

2.1 Download Jszip Library
Official gitbug:https://github.com/egret-labs/egret-game-library

2.2 Importing Jszip Libraries
Put the downloaded Jszip folder in the right place, I dropped it directly under the project directory


Open the project directory under Egretproperties.json, add Jszip to the configuration file

[AppleScript]Plain Text view copy code ?

010203040506070809101112131415161718

"modules": [    {      "name": "egret"    },    {      "name": "game"    },    {      "name": "tween"    },    {      "name": "res"    },        {                "name": "jszip",                "path": "jszip"        }  ]

Once the add is complete, remember to compile the engine once.


2.3 Loading and decompression ZIP code

[AppleScript]Plain Text view copy code ?

01020304050607080910

//加载zipRES.getResByUrl("resource/assets/assets.zip", function(data){              //解压数据              var zip = new JSZip(data);                             //读取技能数据              var skillJson = JSON.parse(zip.file("skill.json").asText());              console.log(skillJson);               },this, RES.ResourceItem.TYPE_BIN);

To update an uncompressed image:
Tutorials for reference: 1190000002669262

[AppleScript]Plain Text view copy code ?

12345678

//读取图片 var buffer = zip.file("fire.png").asArrayBuffer();var base64 = this.arrayBufferToBase64(buffer);base64 = "data:image/png;base64," + base64;              var img:eui.Image = new eui.Image();img.source = base64;this.addChild(img);

[AppleScript]Plain Text view copy code ?

123456789

private arrayBufferToBase64( buffer ) {    var binary = ‘‘;      var bytes = new Uint8Array( buffer );      var len = bytes.byteLength;      for (var i = 0; i < len; i++) {         binary += String.fromCharCode( bytes[ i ] );      }    return window.btoa( binary );  }

Three demo source download (Coding git)

"Salted fish Tutorial" jszip Compression and decompression tutorial