Laya FairyGui系列六 GLoader

装载器（GLoader）

FGUI规定需要切换图片的Texture时就需要使用装载器，所以装载器在FGUI中的使用也非常广泛，例如前面说到的GButton的图形标题。

创建装载器的方法和创建图形一样，在左侧工具栏点击装载器按钮创建一个装载器。

GLoader.png

装载器的属性：

• 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中改变图片颜色时通过滤镜实现，会产生效率问题。