HTML5 開發進度#3

自從我們在九月釋出以 Cocos2D 製作的 HTML5 版本後收到不少反饋,以及各種關於遊戲進行上的困難。在經過技術團隊的評估之後,決定轉換到 Unity3D 繼續後續的開發。

原本受限於 Unlight 原有機制無法在 Unity3D 的 WebGL(HTML5)版本支援的問題,已經在這幾個月內排除,透過我們在 Cocos2D 中應用的技術轉移,現在開發中的 Unity3D 版本已經可以同時支援 HTML5 以及手機版的連線,目前正在完善原本 Cocos2D 無法還原的 Flash 上所具備的介面跟效果。

不過 Unity3D 在 HTML5 的支援本身仍然是很受限的,這次就向大家稍微介紹一下我們是怎麼處理在 HTML5 和手機版兩個版本之間減少重複開發的問題。

因為手機版跟 HTML5 版本的連線方式不同,如果沒有設計好就會造成要寫兩次程式碼的狀況。

在 HTML5 中很多在手遊開發中會使用的 Unity3D 擴充功能會受到限制,因此我們需要以 JavaScript 來替換,除此之外一些連線相關的功能在 Unity3D 中被抽離替換成 Unity 自家的雲端服務,我們也需要讓這些機制恢復運作。因此我們一共有兩個目標要實現:

  • 在 HTML5 和手機版使用各自支援的方式實現
  • 在遊戲端開發中減少重複的部分

要解決這兩個問題,我們需要使用在軟體開發常用的處理方式 Adapter(配接器)來解決這樣的問題,大家可以想像成 USB-C 接頭的概念,在過去 iPad 都是使用 Apple 自己的接頭,但這幾年改成 USB-C 之後就能夠用各種不同的線來連接,實際上 Android 平板跟 iPad 是怎麼連接和處理充電、傳輸的不需要統一,只要連接的孔能夠統一就能夠通用。

namespace Phantom {
  public interface ISocket {
    public IEnumerator Connect(string hostname, int port);
    public IEnumerator Disconnect();
  }
}

在這邊以連接伺服器的處理為例,我們希望能夠支援 HTML5 的 WebSocket 協定以及 Unlight 原本使用的 TCP 協定,因此先定義了一個標準化的介面叫做 ISocket 任何符合這個規格的實現都能夠被套用。

基於這樣的機制,我們就可以實現像是這樣的程式處理。

ISocket socket;
#if UNITY_WEBGL && !UNITY_EDITOR
socket = new WebSocket();
#else
socket = new TCP();
#endif

socket.Connect("example.com", 1234);

利用判斷 Unity 的所處的狀態,選擇要產生以 WebSocket 模式或者 TCP 模式的 ISocket 實現,來連接伺服器就能夠在後續的程式直接使用相同的方式處理,而不會需要重複撰寫大量類似的程式碼。

不過只有這樣還是會有很多問題,因此我們還實作了簡易版本的 IoC(控制反轉)的機制,因為相對的複雜因此在這邊就不會特別說明,但是我們可以利用這樣的機制將上面的程式碼轉換成下面的形式。

ISocket socket = Phantom.Container.Instance.Get<ISocket>();
socket.Connect("example.com", 1234);

利用控制反轉將產生的物件統一管理,當我們需要連線的時候只需要統一向容器(類似司令塔的概念)請求分配就可以獲取到我們所需的資訊,因此我們不再需要去區分是哪種版本的連線,區分的工作會由容器決定並且回傳正確的數值。

雖然 Cocos2D 的表現沒有我們預期中的理想,但過程中的經驗促使我們順利完成 Unity3D 的轉換,透過新的機制跟架構設計雖然在現階段需要花時間重新製作遊戲場景,但是卻對未來提供手機、平板支援的速度有了更進一步的加快。

感謝各位玩家的耐心等候,開發團隊正在盡快的重新製作遊戲的系統以及逐步加入未來能夠支援我們營運計劃的各項新系統到遊戲中。

最後附上開發中畫面的影片:

發表迴響

這個網站採用 Akismet 服務減少垃圾留言。進一步了解 Akismet 如何處理網站訪客的留言資料