【咸鱼教程】JsZip压缩与解压教程

引擎版本3.0.6

教程目录
一 为什么要用jszip
二 如何使用jszip
    2.1 下载jszip库
    2.2 导入jszip库
    2.3 加载和解压zip代码
三 Demo源码下载

一 为什么要用jszip
在游戏中有大量配置文件时,为了减少加载次数和传输量,将文件打包成zip,在egret中加载并解压获取数据。

在中大型游戏,不可避免有大量的游戏配置文件。

 


为了减少加载次数和传输量,我们事先将这些文件压缩打包成zip, 然后在egret中加载,并使用jszip库解压获取其中的数据。



 


二 如何使用jszip

2.1 下载jszip库
官方gitbug下载地址:https://github.com/egret-labs/egret-game-library

2.2 导入jszip库
将下载的jszip文件夹放到合适位置,我这里直接丢在了项目目录下
 

打开项目目录下egretProperties.json,将jszip添加到配置文件中

[AppleScript]  纯文本查看 复制代码
?
01
02
03
04
05
06
07
08
09
10
11
12
13
14
15
16
17
18
"modules" : [
     {
       "name" : "egret"
     } ,
     {
       "name" : "game"
     } ,
     {
       "name" : "tween"
     } ,
     {
       "name" : "res"
     } ,
         {
                 "name" : "jszip" ,
                 "path" : "jszip"
         }
   ]



添加完成后,记得编译一次引擎。
 

2.3  加载和解压zip代码

[AppleScript]  纯文本查看 复制代码
?
01
02
03
04
05
06
07
08
09
10
/ / 加载 zip
RES.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 ) ;



更新一个解压图片的:
参考的教程: https://segmentfault.com/a/1190000002669262

[AppleScript]  纯文本查看 复制代码
?
1
2
3
4
5
6
7
8
/ / 读取图片
  var buffer = zip . file ( "fire.png" ) .asArrayBuffer ( ) ;
var base 64 = this.arrayBufferToBase 64 ( buffer ) ;
base 64 = "data:image/png;base64," + base 64 ;
               
var img : eui.Image = new eui.Image ( ) ;
img.source = base 64 ;
this.addChild ( img ) ;



[AppleScript]  纯文本查看 复制代码
?
1
2
3
4
5
6
7
8
9
private arrayBufferToBase 64 ( buffer ) { 
     var binary = ''; 
     var bytes = new Uint 8 Array ( buffer )
     var len = bytes.byteLength; 
     for ( var i = 0 ; i < len; i + + ) { 
          binary + = String.fromCharCode ( bytes[ i ] )
     } 
     return window .btoa ( binary )
}





Demo源码下载(coding git)

猜你喜欢

转载自www.cnblogs.com/gamedaybyday/p/9219978.html