瘋狂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講義上》