greensock又出重量级产品 - LoaderMax
2010-06-17 16:30 by hbb, 2960 visits, 收藏, 编辑地址:http://www.greensock.com/loadermax/
技巧与窍门:http://www.greensock.com/loadermax-tips/
本人不才,到现在也没用过类似BulkLoader、QueueLoader这样的东西。大概是实际需求并没有带来足够的学习动力,或者使用方法和自身风格有点出入吧...
LoaderMax的出现却让我为之一振,其作者greensock,个人认为是as界影响力最广的人了。没用过TweenLite、TweenMax的人,现在还有么?
自从前不久推出了Tweening Platform以后,紧接着就推出了LoaderMax。当然还有 TransformManager 。我感觉这丫要搞 online flash。
因为我没用过其它loader框架,所以没法比较,仅提一下几点感兴趣的特性,并给出自己写的demo。
1、线性化下载过程
一般的下载队列,是一口气推入n个loader,然后逐个下载,下载完了调用start,开始整个程序。
由于是线性过程,这个时候下载流程比较好控制。假如碰到被下载的一个swf中,又下载别的图片、音乐之类,就成了树形过程了。LoaderMax在这方面的处理是利用一个requireWithRoot 属性,指定该Loader隶属于哪个容器。一旦指定,那么这个Loader所下载内容,就当作容器的一部分。
比如 main.swf > (a.swf > a.mp3) > (b.swf > b.jpg), a.mp3 和 b.jpg都远大于两个swf。
当main在下载的时候,先下a.swf,完了下b.swf。而a.swf中会去下载a.mp3,b.swf则是下载b.jpg。所以很可能出现的情况是a,b.swf都下载好了,还在同时下载a.mp3和b.jpg。但这个时候main已经算下完了,要start了...
如果在a.swf下载a.mp3时设置requireWithRoot = root,b.swf也一样。那么main.swf在a.swf之后下a.mp3,直到a.mp3下载完了,才算a.swf下完。这样就把一个树形流程又改为线性的了。
2、预估文件大小
在下载文件时,都知道有个请求过程,这个过程中文件的总大小是不知道的。这样对显示进度就是个麻烦事儿。像以前碰到公司内网关上安了2b防火墙,进来的数据都隔那儿堵着,等cache满到一定大小才一下子返回。搞得每次在公司看loading都是一闪而过,这不是因为快,是因为前面堵着呢,只能傻等着....LoaderMax在这方面采用了预估文件大小,利用一个estimatedBytes 属性,先假设要下的文件大小是多少。这样一来,即使请求还没来,下载进度还是有的。如果网络不出问题,等到请求返回了,马上就拿精确的文件大小替换预估值,让进度始终保持在用户眼前,而不会傻等。这个属性的默认大小是 20000 (20k)。
3、tween式初始化
这个就不多说了,还是那句话,没用过TweenLite、TweenMax的人还有么?
4、显示对象的对齐
显示对象在下载后有个比较恼人的问题,就是定位和对齐。这个问题其实已经被TransformManager 很好的解决掉了。LoaderMax只是让操作更简单了。
只需在初始对象的属性里面增加width,heighth或scaleX,scaleY(前者优先权大于后者)再配合scaleModes属性就很轻松了。
5、选择性打包
实际上LoaderMax并不是一个万能下载器,他只是一个壳儿,具体的下载交给SWFLoader,XMLLoader,MP3Loader...等等,这样的话,项目中要啥就选啥,可以节约文件大小。编译的时候也不会浪费不必要的时间。
6、并行下载
一般的下载队列,就是逐个下载吧?LoaderMax有个maxConnections 属性,可以设置同时下载数。默认为2。
7、下载信息
还有件比较烦人的事情,就是在定义一个loader后,有时候还要再为之定义个变量,指向下载对象。该指向还必须得在下载好以后才能设置。
这点LoaderMax也封装掉了。LoaderMax.getContent(),而且由于Loader事先就是有类型信息的,像CSSLoader,MP3Loader,所以content在使用上有着很高的可读性。
还有很多,诸如下载流程控制、优先权设置、Loader嵌套性、XML驱动配置、Flex友好等很多特性。有兴趣的自己玩吧。
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
|
package
{
import
com.greensock.events.LoaderEvent;
import
com.greensock.layout.ScaleMode;
import
com.greensock.loading.ImageLoader;
import
flash.display.Sprite;
public
class
MyImage
extends
Sprite
{
private
var
ldr:ImageLoader;
public
function
MyImage()
{
trace
(
'MyImage::Constructor'
);
ldr =
new
ImageLoader(
'assets/image.jpg'
, {
name:
'image.jpg'
,
container:
this
,
width:
800
, height:
600
,
scaleMode : ScaleMode.PROPORTIONAL_INSIDE,
requireWithRoot : root,
onProgress:onProgress, onComplete:onComplete, onError:onError } );
ldr.load();
}
private
function
onError(e:LoaderEvent):
void
{
trace
(
'MyImage::onError'
);
trace
(e.toString());
}
private
function
onProgress(e:LoaderEvent):
void
{
trace
(
'MyImage::onProgress'
);
trace
(e.toString());
}
private
function
onComplete(e:LoaderEvent):
void
{
trace
(
'MyImage::onComplete'
);
trace
(e.toString());
}
}
}
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
|
package
{
import
com.greensock.events.LoaderEvent;
import
com.greensock.loading.MP3Loader;
import
flash.display.Sprite;
public
class
MyMusic
extends
Sprite
{
private
var
ldr:MP3Loader;
public
function
MyMusic()
{
trace
(
'MyMusic::Constructor'
);
ldr =
new
MP3Loader(
'assets/music.mp3'
, {
name:
'music.mp3'
,
autoPlay:
true
,
repeat: -
1
,
requireWithRoot : root,
onProgress:onProgress, onComplete:onComplete, onError:onError } );
ldr.load();
}
private
function
onError(e:LoaderEvent):
void
{
trace
(
'MyMusic::onError'
);
trace
(e.toString());
}
private
function
onProgress(e:LoaderEvent):
void
{
trace
(
'MyMusic::onProgress'
);
trace
(e.toString());
}
private
function
onComplete(e:LoaderEvent):
void
{
trace
(
'MyMusic::onComplete'
);
trace
(e.toString());
}
}
}
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
|
package
{
import
com.greensock.events.LoaderEvent;
import
com.greensock.loading.LoaderMax;
import
com.greensock.loading.SWFLoader;
import
flash.display.Sprite;
import
flash.events.Event;
public
class
MySWF
extends
Sprite
{
private
var
queue:LoaderMax;
public
function
MySWF()
{
trace
(
'MySWF::Constructor'
);
queue =
new
LoaderMax( {
name:
'loaderQueue'
,
requireWithRoot : root,
onProgress:onProgress, onComplete:onComplete, onError:onError
});
queue.maxConnections =
10
;
queue.append(
new
SWFLoader(
'myimage.swf'
, {container:
this
}) );
queue.append(
new
SWFLoader(
'mymusic.swf'
) );
queue.load();
}
private
function
onError(e:LoaderEvent):
void
{
trace
(
'MySWF::onError'
);
trace
(e.toString());
}
private
function
onProgress(e:LoaderEvent):
void
{
trace
(
'MySWF::onProgress'
);
trace
(e.toString());
}
private
function
onComplete(e:LoaderEvent):
void
{
trace
(
'MySWF::onComplete'
);
trace
(e.toString());
}
}
}
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
|
package
{
import
com.greensock.events.LoaderEvent;
import
com.greensock.loading.core.LoaderCore;
import
com.greensock.loading.SWFLoader;
import
flash.display.Sprite;
import
flash.events.Event;
public
class
Main
extends
Sprite
{
private
var
ldr:LoaderCore;
public
function
Main():
void
{
if
(stage) init();
else
addEventListener(Event.ADDED_TO_STAGE, init);
}
private
function
init(e:Event =
null
):
void
{
removeEventListener(Event.ADDED_TO_STAGE, init);
// entry point
ldr =
new
SWFLoader(
'myswf.swf'
, { container:
this
,
onProgress:onProgress, onComplete:onComplete, onError:onError
} );
ldr.load();
}
private
function
onError(e:LoaderEvent):
void
{
trace
(
'Main::onError'
);
trace
(e.toString());
}
private
function
onProgress(e:LoaderEvent):
void
{
trace
(
'Main::onProgress'
);
trace
(e.toString());
}
private
function
onComplete(e:LoaderEvent):
void
{
trace
(
'Main::onComplete'
);
trace
(e.toString());
}
}
}
|