2013年8月29日 星期四

在Starling中,如何製作符合各種不同規格裝置的場景 - 以IOS為例子 (ㄧ)

原文出處
Managing multiple iOS resolutions with Starling – real world example

製作iOS遊戲時,你要處理各種不同類型的設備(從iPhone 3GS到iPhone 5... 之後可能還會更多)
雖然每個設備都有自己的螢幕規格,但是你應該只需要製作一個版本的遊戲,他必須可以自動將場景調整成必要的規格。
本篇內容將介紹將為各為介紹,使用Starling框架時,如何製作這種機制。

首先我們建立一個基本的Starling專案,並對場景初始化。


第6行定義的場景,這是針對3GS作設定 (480 x 320)
再來是場景 Game.as

建立好了之後輸出看看各種不同規格的樣子..
首先看ㄧ下3GS,沒有任何問題。
在來看ㄧ下iPhone 4..

iPhone 4,規格960x640,畫面只剩下場景的1/4..
再來看看iPhone 5,情況又更糟了..


iPhone5的規格1136x640,不但大小不同,比例也不一樣..

像這樣的情況下,我們介紹如何直接應用ㄧ開始的場景大小(480x320)來符合各種不同規格的螢幕的方法,不管是不是視網膜螢幕都可以直接應用。
修改ㄧ下Main.as

首先重新定義ㄧ下你的viewPort,把stage直接拉大到螢幕的大小。
這種直接拉大stage的方法,可以很快解決上述的問題。
現在我們再來看ㄧ次iPhone 4的情況。
現在遊戲畫面可以涵蓋整個螢幕了,不過解析度確很糟糕..
同樣的,在iPhone 5上面也是一樣的問題。
雖說畫面也正常(也沒有人逼你ㄧ定得解決畫面品質不佳的問題),但擁有視網膜的iPhone使用者也會給你不好的評價。
你可能會用另一種方法,直接把素材解析度增加2倍,好讓遊戲在視網膜螢幕上的效果好ㄧ些,不過這反而對沒有視網膜螢幕的裝置造成負擔,由於素材過於龐大,導致效能不佳,動畫也變得不順暢。
所以我們在加ㄧ些判斷,好讓程式可以針對不同的裝置,使用適當的素材。
程式中,嵌入了ㄧ般用的素材與高解析度的素材,然後去判斷viewPoint的大小來決定用哪一種素材,這種方法不管是3GS或是iPhone4上都可以顯示最適當的素材。
再次輸出到iPhone 4
現在他支援iPhone 4的視網膜螢幕了。
接著輸出到iPhone 5
iPhone 5應用了適當的素材,畫面品質也提高了,不過由於iPhone 5與3GS和iPhone 4比例不一樣,導致畫面兩旁補了黑邊。
下一篇我們再來解決這個問題。

補充:Srarling 1.3 以後設定 viewPoint 可以直接使用RectangleUtil.fit方法設定縮放大小,有機會在介紹。

沒有留言: