---
description: '#HelloGameDev #HelloErmine #HelloWorld2021'
---

# Layer

## **Layer**

&#x20;             **layer** คือค่าความลึกของ object อันหนึ่ง ซึ่งถ้ามีค่ามาก object ก็จะไปอยู่ข้างหน้า

&#x20;              โดยน้อง ๆ สามารถตั้งค่าความลึกของ layer ได้โดยใช้คำสั่ง **`.setDepth`** เช่น

```javascript
create() {
        this.add.image(400,700,'football').setScale(0.10)
        .setDepth(5);
        this.add.image(500,750,'basketball').setScale(0.35)
        .setDepth(3);
        this.add.image(425,850,'volleyball').setScale(0.37)
        .setDepth(6);}
```

&#x20;              **ผลลัพธ์ที่ได**้

![จะเห็นได้ว่า Object เรียงตาม Layer ที่เรากำหนดไว้](https://1572294076-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-Me05uuZ2Kw6VszdHXnU%2F-MehtYOr5GF_ovHd3i3n%2F-MehzS8JLlyW9ymjsE4C%2Fimage.png?alt=media\&token=b54d0281-e619-4b66-9fe7-6b02144ff41d)

&#x20;              และ layer ยังสามารถใช้เพื่อจัดกลุ่ม 'Layer' ของ Game objects เข้าด้วยกันได้อีกด้วย

&#x20;              **ตัวอย่าง**

```javascript
create() {
    football = this.add.sprite(400,700,'football').setScale(0.10);
    basketball = this.add.sprite(500,750,'basketball').setScale(0.35);
    volleyball = this.add.sprite(425,850,'volleyball').setScale(0.37);

    groupLayer = this.add.layer();
    groupLayer.add([ football, basketball, volleyball ]);
}
```

> ถ้าจัดกลุ่ม **`GroupLayer.add([ Object1 , Object2, Object3 ]);`** Object ที่อยู่ชื่อแรกจะอยู่หลังสุด

&#x20;              **ผลลัพธ์ที่ได้**

![Object ที่อยู่ชื่อแรกจะอยู่หลังสุด](https://1572294076-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-Me05uuZ2Kw6VszdHXnU%2F-Mei0fVSmDs_eptMOsr9%2F-Mei1WDSC_xDf8bKCf4N%2Fimage.png?alt=media\&token=b07ded2f-4344-4795-9fb6-e815b1ade55b)
