》Loading
幾乎每個遊戲都有 Loading 動畫，Loading 為了讓使用者知道他們需要等待多久時間；如沒有 Loading 動畫的話，使用者可能覺得是不是畫面壞掉。這次我們會配合昨天學到的 text 來做資訊的顯示。

》Javascript 內容

scene.preload = function() {
    // 載入一些圖檔
    this.load.image('bg', 'assets/bg.png')
    this.load.spritesheet('man', 'assets/man.png', { 
        frameWidth: 80, 
        frameHeight: 110 
    })
    
    // 測試大量圖檔
    for (let i = 0; i < 200; i++) {
        this.load.image('bg' + i, 'assets/bg.png')
    }

    // 創建 text
    let percentText = this.add.text(320, 160, '', {
        font: '24px Open Sans',
        fill: '#ffffff'
    }).setOrigin(0.5, 0.5)

    // 偵聽處理檔案
    this.load.on('progress', value => {
        percentText.setText(parseInt(value * 100) + '%')
    })

    // 偵聽載入檔案結束
    this.load.on('complete', () => {
        percentText.destroy()		// 載入完，把它從畫面上清除
    })
}

》結論
為了讓 Loading 更加完善，你可以添加一些畫面上的元素。今日學到了如何用 Phaser 來偵聽檔案載入的狀況，有 progress、fileprogress、complete 可以偵聽，可以試著把參數印出來看看有哪些資訊可以顯示。

今天就先到這裡，我們明天見。