瘋狂ios講義之美化iOS應用

如果點選模拟器下方的Home按鍵或按下command+Shift+H快捷鍵Retina螢幕的模拟器沒有提供Home按鍵則隻能通過快捷鍵操作模拟器傳回應用程式清單此時将可以看到剛剛開發的應用程式但該應用的圖示隻是一個白色的圓角正方形。對于一個商業應用來說這太缺乏吸引力了接下來将介紹如何定制iOS應用圖示和啟動畫面。

9.6.1  定制iOS應用圖示

定制iOS應用圖示非常簡單其步驟如下。

①準備三張作為應用程式圖示的png格式的圖檔這三張圖檔的大小分别為57像素57像素丶114像素114像素丶120像素120像素。由于iPhone 4引入了Retina顯示螢幕這種顯示屏的分辨率是早期iPhone的兩倍是以需要分别制作兩張圖檔其中57像素57像素的圖示将适用于普通螢幕114像素114像素的圖示将适用于Retina螢幕。而iPhone5s使用iOS 7所用圖示的大小為60像素60像素而且由于iPhone 5s采用的是Retina螢幕是普通分辨率的兩倍是以iOS 7需要的圖示為120像素120像素。

 提示

       雖然iOS應用也支援使用其他格式的圖檔但由于Xcode在建構應用時會自動優化png圖檔這使得png圖檔是iOS應用中最快丶最有效的圖像格式。是以通常推薦采用png格式圖檔。

②按下command+1組合鍵打開Xcode的項目導航面闆在該面闆中展開要定制圖示的應用然後選擇該節點下的Images.xcassets子節點。接下來選中項目導航面闆右邊的Dock區中的AppIcon節點即可看到如圖9.42所示的編輯界面。

③從作業系統的Finder相當于Windows的資料總管中把三張圖檔分别拖入圖9.42所示的三個圖示處Xcode會自動将這三個檔案複制到該應用中并将這三張圖檔設為該應用的圖示。注意不要勾選iOS icon is pre-rendered複選框這樣系統會自動将該圖示調整為圓角邊框。除非你自己準備了非常精美的圖示而且不希望系統對圖示進行任何調整才應該勾選該複選框。

圖9.42  設定應用程式圖示

   重新運作該應用可能需要先删除模拟器原有的應用再次單擊模拟器的Home按鈕如果模拟器沒有Home按鍵可按下command+Shift+H快捷鍵傳回程式清單界面即可看到如圖9.43所示的程式圖示。

圖9.43 定義應用程式圖示

經過上面的步驟後即可成功定制應用程式圖示。

9.6.2  設定iOS應用的啟動畫面

定制iOS應用的步驟如下。

①準備三張作為應用程式圖示的png格式的圖檔大小分别為320像素480像素丶640像素960像素丶640像素1136像素。很明顯320像素480像素的圖檔将适用于普通螢幕而114像素114像素的圖檔将适用于Retina螢幕。又由于iPhone 5引入了更長的螢幕其分辨率已達到640像素1136像素是以Default -568h@2x .png圖檔将适用于iPhone螢幕。

② 按下command+1組合鍵打開Xcode的項目導航面闆在該面闆中展開要啟動畫面的應用然後選擇該節點下的Images.xcassets子節點。接下來選中項目導航面闆右邊的Dock區中的LaunchImage節點即可看到如圖9.44所示的編輯界面。

圖9.44  定制應用程式啟動畫面

   從作業系統的Finder相當于Windows的資料總管中把三張圖檔分别拖入圖9.37所示的5個圖示處640像素960像素的圖檔拖入2x圖示框内640像素960像素的圖檔拖入2x圖示框内640像素1136像素的圖檔拖入R4圖示框内。Xcode會自動将這三個檔案複制到該應用中并将這三張圖檔設為該應用的啟動圖檔。

重新運作該應用可能需要先删除模拟器原有的應用在應用啟動但還未真正開始運作的加載過程中将可以看到該應用顯示如圖9.45所示的啟動畫面。

圖9.45  定制應用的啟動畫面

本文節選自《瘋狂ios講義上》

本文轉自 

fkJava李剛 51CTO部落格，原文連結： http://blog.51cto.com/javaligang/1353394，如需轉載請自行聯系原作者