装载器(GLoader)
FGUI规定需要切换图片的Texture时就需要使用装载器,所以装载器在FGUI中的使用也非常广泛,例如前面说到的GButton的图形标题。
装载器的属性:
-
URL URL指向的资源可以是图片、动画或者组件
-
自动大小 设置装载器是否根据内容的大小自动调整自身的大小。例如,如果图片的大小是120x120,则装载器的大小自动变成120x120。
-
填充处理 当内容大小和装载器大小不同时的缩放策略,如果设置了自动大小那么填充处理就无效了。
GLoader_0.png
-
仅允许缩小 勾选后,装载器加载的内容将永远不被放大,但可以被缩小
-
对齐 设置装载器内容的对齐方式。
装载器时继承自GObject,但是自身并不会处理图片的显示过程,自身只处理指定的显示内容的加载:
__proto.loadContent=function(){
this.clearContent();
if (!this._url)
return;
if(ToolSet.startsWith(this._url,"ui://"))
this.loadFromPackage(this._url);
else
this.loadExternal();
}
__proto.loadExternal=function(){
AssetProxy.inst.load(this._url,Handler.create(this,this.__getResCompleted),null,"image");
}
__proto.onExternalLoadSuccess=function(texture){
this._content.texture=texture;
this._content.scale9Grid=null;
this._content.scaleByTile=false;
this._contentSourceWidth=texture.width;
this._contentSourceHeight=texture.height;
this.updateLayout();
}
通过源码可以看到,在设置装载器的url属性时会判断如果设置的值是"ui://"开头则同FGUI资源包中寻找指定的资源,或者则通过Laya.loader加载指定的资源。加载完成后将加载的内容赋值给MovieClip,由MovieClip来负责内容的显示。
这里不说MovieClip如何处理内容显示的,如果有兴趣可以点击这里。
装载器的使用
- 动态创建装载器
const testLoader = new fairygui.GLoader();
//一定要设置装载器大小,或者显示不出来
testLoader.setSize(100,100);
testLoader.autoSize = true;
testCom.addChild(testLoader);
- 设置装载器url属性
//设置资源包中的图片(URL)
testLoader.icon = "ui://pz4zm4twoxk59";
//设置资源包中的图片(包名/图片或者组件名)
testLoader.icon = "ui://Package1/skill015";
//设置本地res目录下的资源(res下完成路径)
testLoader.icon = "res/skill014.png";
//设置本地图集中的资源(图集名称/图片名称)
testLoader.icon = "skillIcon/skill015.png";
设置装载器的url是本地资源时会先去内存里面查找资源是否已经加载,如果未加载则会执行Laya.loader的加载过程,如果指定的是图集那么加载整个图集。
- 装载器的点击事件
testLoader.onClick(this,()=>{
console.log("点击了GLoader");
})
- 装载器的url指定的如果时其他组件,在代码中可以这样或者这个组件
const testLoader2 = testCom.getChild("n22").asLoader;
const testButton = testLoader2.component.asButton;
testButton.onClick(this,()=>{
console.log("点击了GLoader中的Button");
})
注:
-
直接释放装载器正在使用的资源后,装载器的url属性并未重置,然后将这个资源加载后再设置给装载器的url时会失效。
-
装载器,图片组件都可以再编辑器中直接修改颜色,但是再Laya中不建议使用,因为Laya中改变图片颜色时通过滤镜实现,会产生效率问题。
网友评论