其實在網上已經有不少人寫過類似的教程,但是Xcode本身升級比較快,網上的一些入門教程還是基於Xcode 3的。工作之餘花點時間整理了一個簡單的教程,希望對準備投身加入iOS開發行列的程式員朋友有所協助。
很多開發軟體的教程開篇第一個例子通常都是Hello world。有人戲稱這是一個程式員魔咒“從Hello world開始能夠讓你快速地掌握一門語言”嘿嘿。那麼也讓我們從Hello world開始iOS開發之旅吧。:]
本篇文章僅供第一次接觸iOS開發的程式員參考使用,你會發現,iOS的開發是如此的簡單!目標本文將闡述以下內容:
- 熟悉iOS IDEIntegration Environment;
- 建立第一個項目;
- 整理項目結構;
- 增加Hello World文字標籤;
- 設定應用方向;
- 隱藏狀態列。
看起來很多的樣子哈,其實在整個過程,你幾乎不用寫任何一行代碼,就能夠完成上述所有工作,讓我們現在開始吧。:]
一. 熟悉iOS IDEIntegration Environment如所示,這就是Xcode的Integration Environment:
對於熟悉ms visual studio或者eclipse的朋友來說,這個IDE環境並不難理解和接受,大家只要記住幾個功能區域即可。至於這個環境中存在哪些技巧我會在後續的文章中逐漸補充,畢竟我們現在還什麼事情都沒開始做,沒有必要在這個上面浪費太多的時間。小提示:在Xcode中很多地方只要用按一下滑鼠就可以了,這個對於初次接觸Xcode的人可能會有些不習慣。二. 建立第一個項目1. 開啟XCode,選擇File->New Project,然後選擇iOS->Application->Single View Application,然後點Next,如所示:
說明:除OpenGL Game模板外,其他幾個模板的程式都非常簡單,有興趣的朋友,可以使用這些模板分別建立空的項目,然後花上幾分鐘閱讀一下代碼即可,在本文,我們選擇“Singl View Application”這個模板做為樣本模板。 2. 在彈出的下一個頁面中,在Product Name中輸入“HelloWorld”,其他設定部分參照:
說明:
- Company Identifier: 公司標示,此處輸入一個唯一標示即可,也可以在項目中統一修改;
- Class Prefix: 預設類首碼,為了避免與其他類混淆,此處最好輸入一個首碼名稱,預設使用全大寫字母,保留為空白也可以,本樣本中使用JOY做為類的首碼名稱;
- Device Family: 裝置類型,可以選擇“iPhone”“iPad”或者“Universal”(通用,同時支援iPhone和iPad) ;
- Storyboard: 是Xcode 4.x新增特性,是以前版本的xib的一個擴充升級,讓程式的UI設計更加的簡化;
注意:基於Storyboard的應用只能在iOS5以上版本的裝置上運行。
- ARC: 是Xcode 4.x新增特性,對於以前版本的iOS程式員每alloc一個對象,都會下意識地先去release它,這是一個非常討厭的事情。現在有了 ARC,一切都變得更加簡單,程式員可以更加專註地處理自己應用的表現。
有關ARC和Storyboard的相關內容,後續我會寫一些專門的文章討論,有興趣的朋友也可以自己Google一下,相關細節問題,本文中暫時不做詳細論述。 3. 點擊“Next”,然後在下一個彈出的視窗中,選擇一個檔案夾,儲存項目,然後點擊“Create”按鈕。好了,到現在我們第一個項目就建立完成了,點擊左上方的“Run”按鈕,看看效果吧。如所示:
現在,我們只是通過了簡單的設定就建立了一個能夠獨立啟動並執行應用,一切就是這麼的簡單:)。三. 整理項目結構此部分內容在開發中不是必須要做的事情,如果你著急看下面要做的事情,可以略過此部分內容。不過,隨著我們開發的遞進,檔案越來越多,對項目結構的整理是非常必要的一件工作,也是一個非常好的習慣。:]首先我們看一下導航地區,如所示:
1. 在“HelloWorld”上點擊滑鼠右鍵,在彈出的菜單中選擇“New Group”;
2. 將建立的組重新命名為“GUI”;
3. 將我們現在看到的這幾個檔案拖到“GUI”組中,如所示:
提示:先在第一個檔案JOYAppDelegate.h上點一下滑鼠,然後按住SHIFT,再在最後一個JOYViewController.m上點一下滑鼠,即可選中這些檔案,然後按住滑鼠不放,拖放到GUI上面即可。
四. 增加Hello World文字標籤
下面我們來增加一個文字標籤,顯示Hello World。
1. 在導航地區點擊並開啟“MainStoryBoard.storyboard”檔案,如所示:
這是一個空白的StoryBoard,還沒有任何的控制項。
2. 從右下方的對象地區找到Label控制項,並將其拖放到預設的空白View上;
3. 雙擊這個Label控制項,當Label控制項中的文字高亮選中時,我們輸入一個Hello World!
4. 重新調整一下Label的位置,使其保持在螢幕中央。
現在我們再點擊一下左上方的運行按鈕,或者按command + R,看一下運行效果。
感覺如何?還不錯吧,哈哈,貌似很簡單的樣子哈,讓我們繼續。:]
五. 設定應用方向
現在的行動裝置大多是支援旋轉螢幕的,很多應用程式在使用者旋轉裝置時都會根據使用者當前方向,重新布局應用程式介面。在模擬器中,我們可以通過 comand + 左右鍵旋轉模擬器方向,從而達到類比使用者使用過程中旋轉裝置的效果。
現在我們嘗試一下看看效果,如所示:
糟糕,剛才的標籤現在並不在螢幕中央了。對於複雜UI的應用,可能需要編寫一些代碼單獨根據螢幕的方向重新排列一下各個控制項的位置。不過對於現在這個範例,我們完全不用這麼做。看看我們如何處理吧。
1. 在導航地區點擊並開啟“MainStoryboard.storyboard”檔案;
2. 在“Hello World”這個標籤上點擊選中該控制項;
3. 點擊工具區的“Show the Attributes inspector(顯示內容檢查器)”,將標籤的 Alignment 屬性設定為置中,如所示:
4. 點擊工具區的“Show the Size inspector(顯示尺寸檢查器)”,將標籤的 Autosizing 屬性按照設定:
下面我們再來運行一次看看,我轉,我轉,我轉轉轉⋯⋯哈哈,現在無論怎麼轉Hello World始終都在螢幕的中間位置了。:]
不過細心的朋友此時可能會發現一個問題,那就是當Home鍵在上方時,Hello World是橫屏顯示的,而不是我們所期望的那樣,這是什麼原因呢?
1. 在導航地區點擊並開啟“JOYViewController.m”檔案;
2. 找到shouldAutorotateToInterfaceOrientation方法,原來是在這裡限定住了;
3. 把唯一一條語句注釋掉,加上一句 return YES; 如下所示:
1 - (BOOL)shouldAutorotateToInterfaceOrientation:(UIInterfaceOrientation)interfaceOrientation2 {3 // return (interfaceOrientation != UIInterfaceOrientationPortraitUpsideDown);4 return YES;5 }
現在我們在運行一下看看效果,OK啦!:]
補充說明
在項目屬性設定中有一個支援裝置方向的設定屬性。
在導航地區點擊HelloWorld項目,然後在編輯地區的TARGETS下的HelloWorld點擊一下,我們可以看到:
原來預設是不支援“Upside Down”這個方向的。不過這個屬性修改後,只會影響到我們今後添加的ViewController,而不會對之前的ViewController有任何影響。所以,如果要讓HelloWorld支援Upside Down這個方向,我們還是需要手動調整一下代碼的。
六. 隱藏狀態列
儘管現在iPhone和新iPad的解析度都很高,但是其螢幕相比傳統的PC的螢幕還是要小很多,在開發iOS應用時,螢幕上的空間可謂是“寸土寸金”,我們需要儘可能地利用螢幕上的每一處空間。現在很多iOS的應用在運行時,都是不顯示狀態列的,這是怎麼做到的呢?
1. 在導航地區點擊並開啟“HelloWorld-Info.plist”檔案;
2. 在編輯地區的空白處點擊滑鼠右鍵,然後在快顯功能表中選擇“Add Row”;
3. 在“Key”欄目中使用下拉式清單找到“Status bar is initially hidden”,並將其屬性設定為“YES”;
運行一下,狀態列不見了!:]
結束語
OK,到此為止“Hello World”項目已經完成。感覺如何?簡單吧!
之後我們將逐步深入,開始快樂的iOS開發之旅