纹理的填充方式

位图的填充方式有两种，

• 拉伸图像以填充区域
• 重复图像以填充区域

1.拉伸图像填充

创建 Bitmap 对象时会默认选择第一种填充方式。

下面是的示例中，使用默认填充方式。使用的纹理图片为一张100*100的图片。图像宽度设置为2倍，高度设置为3倍。

class  BitmapTest  extends  egret.DisplayObjectContainer  {
  public  constructor()  {
    super();
    this.addEventListener(egret.Event.ADDED_TO_STAGE,  this.onAddToStage,  this);
  }
  private  onAddToStage(event: egret.Event)  {
    RES.addEventListener(RES.ResourceEvent.GROUP_COMPLETE,  this.onGroupComp,  this);
    RES.loadConfig("resource/resource.json",  "resource/");
    RES.loadGroup("preload");
  }
  private  onGroupComp()  {
    const img: egret.Bitmap  =  new  egret.Bitmap();
    img.texture  =  RES.getRes("box");
    img.width  *=  2;
    img.height  *=  3;
    this.addChild(img);
  }
}

编译后运行，效果如图：

2.重复图像填充

设置填充方法需要改变 Bitmap 中的 fillMode 属性。

img.fillMode  = egret.BitmapFillMode.REPEAT;

具体示例代码如下：

class  BitmapTest  extends  egret.DisplayObjectContainer  {
  public  constructor()  {
    super();
    this.addEventListener(egret.Event.ADDED_TO_STAGE,  this.onAddToStage,  this);
  }
  private  onAddToStage(event: egret.Event)  {
    RES.addEventListener(RES.ResourceEvent.GROUP_COMPLETE,  this.onGroupComp,  this);
    RES.loadConfig("resource/resource.json",  "resource/");
    RES.loadGroup("preload");
  }
  private  onGroupComp()  {
    const img: egret.Bitmap  =  new  egret.Bitmap();
    img.texture  =  RES.getRes("box");
    img.fillMode  = egret.BitmapFillMode.REPEAT;
    img.width  *=  2;
    img.height  *=  3;
    this.addChild(img);
  }
}

编译后运行，效果如图：