高效使用你的Xcode

標籤：blog   http   ar   io   os   使用   sp   for   strong   

（via：VongLo‘s Dev Space  原文：Supercharging Your Xcode Efficiency）

 好萊塢電影裡經常看到駭客們手指在鍵盤上飛速跳躍,同時終端上的代碼也隨著飛舞。如果你也想像電影裡那樣,那麼你來對地方了。這篇教程將會教你在Xcode編程中更像程式員,你可以稱之為魔法、瘋狂的技術、好運當頭或者駭客。毫無疑問,在學習完本教程之後,不管你怎麼認為,都會感覺很酷,同時能更高效地運用Xcode,甚至可以通過這些新發現使你的代碼免於毀滅。 本章內容包括：開始日常Xcode任務快速鍵Xcode的行為小測驗加速讓設計師高興提升和超越程式碼片段何去何從 1.開始要看起來很酷,所以有一些必不可少的因素.下面列出來的是其中一部分：（1）快速執行任務（2）精準（3）簡潔美觀的代碼 要表現地更酷,你可以試著不用滑鼠或者觸摸板來完成教程中的每一個任務。學習之旅將從學習一些實用的Xcode功能開始,然後通過修複一些在CardTilt中的一些bug來訓練。最後你將整理一下你的代碼,使整個介面看起來更整潔。在學習該教程時,要記住:它不是教你做一個app,而是教你比以前更有效地利用Xcode來開發app。這篇教程建立在你對Xcode有一個基本的瞭解的基礎上,然後著重於提高你的工作效率。每個人都有自己的編程習慣,本教程並非強制你形成某種風格。自始至終,本教程中你會看到某些命令的替代品,隨著本教程的學習,請集中精力在提煉和形成你自己的編程風格,不要讓微小的錯誤影響你。Note: 如果你對於Xcode不是很熟悉,建議先學習下面兩篇教程。 教程1 和 教程2 下載  CardTilt-starter ,然後就可以愉快地寫代碼了。 2.日常Xcode任務有一些在Xcode中你經常使用的技巧,這一部分讓你更近距離的接觸這些技巧,然後講解一些瀟洒應對它們的一些妙招。在這個過程中,你會在這些妙招的基礎上發現使用它們的新方法。這些技巧將成為你編程工具腰帶上的忍者之星。在Xcode中開啟之前下載好的工程CardTilt,先不要急著去看代碼,先將你Xcode的視窗和來一一對應 是不是發現你的視窗和圖中並不對應,先別著急。在下面介紹的快速鍵部分,你將會學到如何輕鬆地顯示以及隱藏這些對應的視窗。 下面是組成視窗的每一個獨立地區的快速探索:The Toolbar(工具列): 你選擇視圖,運行app,在不同布局介面切換的地方The Navigation Area(導航區): 導航你整個工程,警告,報錯等的地方The Editing Area(編輯區): 所有奇蹟誕生的地方,包括它上方的Jump barThe Utility Area(工具區): 包含檢測器和一些庫The Debugging Area(調試區): 包括調試視窗和變數檢測器 上面列出的所有視圖地區都是Xcode的必要組成部分,它們也是在你開發過程中可能需要用到的,開發過程中通常不需要將他們一次性同時顯示出來,下面將介紹一些快速鍵,將會教你快速顯示/隱藏這些視圖地區。 3.快速鍵在這一部分,你將首先學到怎麼掌握這些快速鍵,得益於一些模式,最有效快速鍵非常容易記。 第一個需要知道的是Xcode的各地區與修飾鍵的關係,下面是一個快速探索：用來導航,控制導航地區控制右邊的一些東西,比如Assistant Editor,utility editorControl: 編輯地區上的Jump bar的一些互動 第二個需要知道的時數字鍵和標籤欄的關係,將數字鍵和上面提到的修飾鍵組合可以在標籤頁之間來回切換。通常數字鍵對應標籤頁的索引位置(從1開始),0通常用來顯示/隱藏地區。它還能再直觀一點嗎?下面是最常用的按鍵組合:Command 1~ 8: 跳轉到導航區的不同位置Command 0 :顯示/隱藏導航區Command Alt 1~ 6:在不同檢測器之間跳轉Command Alt 0: 顯示/關閉工具區.Control Command Alt 1~4: 在不同庫之間跳轉Control 1~ 6: 在Jump bar的不同標籤頁的跳轉。 最後也是最簡單的就是斷行符號鍵,當它和Command組合使用時,可以是你在Xcode中不同編輯器來回切換。Command + Enter: 顯示標準單視窗編輯器Command Alt Enter:你可以猜下它的作用,它的功能是開啟Assistant editorCommand Alt Shift Enter: 開啟版本控制編輯器 同樣重要的是顯示/隱藏調試區的快速鍵是 Command + Shift + Y ,要記住這個你可以通過這句話來記憶 “Y is my code not working?” (譯者注:Y諧音Why)。如果你忘記了一些快速鍵,你可以在Xcode的功能表列Navigate一項中找到大部分快速鍵。在即將完成這一部分的學習之時,你會驚奇的發現你僅僅只是用了鍵盤就讓Xcode發生這各種變換。4.Xcode的行為使用快速鍵來管理Xcode的介面卻是挺棒,有沒有想過更棒的事情?比如讓 Xcode 自動轉換到你想看到的介面。接下來我們將學到更酷的東西。 幸運的是, Xcode 提供的 Behaviors(行為) 可以讓你輕易地實現上面的事情。它們是一組定義好的有指定事件觸發的動作,比如 build 一個工程。這裡的動作的範圍從改變介面到運行一個自訂指令檔。來看一個例子,快速修改下載好的工程的 CTAppDelegate.m 檔案,使其運行時會產生調試視窗輸出,用下面的方法替代  didFinishLaunchingWithOptions 方法

1. - (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions 
2. { 
3.     [[UIApplication sharedApplication] setStatusBarHidden:YES]; 
4.     // Override point for customization after application launch. 
5.     NSLog(@"Show me some output!"); 
6.     return YES; 
7. } 

 運行程式,然後仔細觀察調試區,你會發現調試區隨著 app 運行而出現,如下所示： 來看看是什麼定義了上面的事件,在 Xcode->Behaviors->Edit Behaviors 開啟 Behavior 喜好設定,在左側你將看到所有事件集合,在右邊是該事件可以觸發的一些列動作。點擊 Running 欄下的 Generates output,然後發現它被設定成用來顯示調試區。 4.1 一些推薦的行為Note: 根據你的開發環境,我推薦的兩種不同的`Generates output`事件觸發動作集。如果你有多個螢幕,試著使用第一種,如果是單顯示器,試著調到第二種方法。 4.1.1 方法一如果你在兩個或者多個螢幕上開發,把調試區放到第二個螢幕是不是更加方便,你可以向下面這樣設定 現在,運行程式,然後你會看到一個分離的視窗出現,將它放到你的第二個螢幕上,是不是效率高了不少? 4.1.2 方法二如果是單屏,通過隱藏工具板以及設定輸出視窗佔據整個調試區使輸出視窗的有效地區最大化,設定如下 然後運行程式,然後觀察 Xcode ,看它是不是按照你的命令在執行。 當程式暫停時候,你可能也想改變 Xcode 的行為,到 Running 欄下的 Pauses 事件,然後改變其設定,向下面這樣:現在無論何時你設定了斷點,你將會得到一個新的名為fix的展示變數和輸出視窗的標籤頁,然後自動導航到第一個issue。 你將要建立的最後一個行為是我個人最喜歡的一個,它是一個自訂行為—設定一個快速鍵。當被觸發的時候,它使 Xcode 轉變到我指定的為下一次開發而最佳化的布局,名為 Dev Mode。我們可以通過點擊Behavior喜好設定的左下角的“+”,然後將其取名為Dev Mode,雙擊 Dev Mode 右邊的符號然後輸入 Command . 來定義一個快速鍵。接下來為該事件設定相應動作:現在,只要你按下command .就會觸發上面設定的動作,即出現一個相同的整潔的開發介面。 下面將介紹 Xcode tab name,和行為配合起來使用堪稱完美。 Note: Xcode Tab Names(Xcode標籤名):可以通過雙擊標籤頁的標題來修改標籤頁的名稱,對於它本身來說是一個無用的功能,但是當它和行為結合起來使用時就變得非常強大了。在上面的第二個例子中,當改變Pauses行為時,命名了一個叫fix的標籤頁,這就意味著當行為被觸發時,Xcode將會使用fix標籤頁(如果存在),如果不存在,它會建立一個名為fix的標籤頁。另一個例子就是多屏Starts行為,如果一個名為Debug的標籤頁在之前運行時被開啟,它將會複用這個標籤頁而不是重新建立一個。用這種方式,你可以建立非常有趣的行為。 到現在為止,我們可以花點時間來回顧一下剛才的行為,不要著急,本教程會等著你。 5.小測驗在接下來的部分,你將在測驗中用到上面所學到的技巧,然後在CardTilt項目中學到一些新的技巧。 運行CardTilt項目中，你看到如下畫面 它不是你期待看到的畫面？是時候消滅這些bug了！ 5.1鎖定bugapp似乎在載入資料時出現了問題，你的任務就是消滅它們。開啟 CTMainViewController.m 檔案然後進入開發模式 Dev Mode，快速鍵為之前設定的 command .。注意 viewDidload 方法中的前幾行 

1. self.dataSource = [[CTTableViewDataSource alloc] init]; 
2. self.view.dataSource = self.dataSource; 
3. self.view.delegate = self; 

 看起來 CTTableViewDataSource 實現了 UITableViewDataSource 協議，為 tableview 提供了資料。是時候展現你 Xcode 的技術了，按住 command 鍵，同時點擊 CTTableViewDataSource 在編輯器中開啟CTTableViewDataSource.h。CTTableViewDataSource.m 應該已經在你的 Assistant Editor，如果不是這樣的話，開啟頂部的 Jump Bar，像一一樣切換到 Assistant Editor 的 counterparts 模式。 翻看代碼，你會發現數組 members 裝載資料，loadData 方法從 bundle 中載入資料至數組 members。在assistant editor 右邊任意位置滑鼠右擊，選擇 Open in Primary Editor，就會在 Primary Editor 中開啟 CTTableViewDataSource.m 檔案，下面動畫是該步驟的展示：Note: 為了看起來更酷炫，你可以在不用滑鼠的情況下完成上面的所有事情，步驟如下： 1.同時按住Command + Shift + O，在輸入框中輸入CTMainViewController.m，然後斷行符號來開啟該檔案。2.Command + . 進入Enter Dev模式 。3.將滑鼠放在 CTTableViewDataSource 上，然後按住Command + Control + J，跳轉至CTTableViewDataSource定義處。4.按住 Command + J, -> 然後按下斷行符號，來轉換 assistant editor 的焦點5.按住 ctrl +4 來下拉 Jump Bar，然後使用方向鍵和斷行符號鍵來選擇 counterparts6.按住 Command + Alt，在 primary editor 中開啟 CTTableViewDataSource.m 檔案7.上面的結果步驟看起來不呢麼高效，但是它讓你看起來很酷。 5.2 修複bug在 self.members = json[@"Team"]; 打上斷點來確定資料是否都被裝載到數組 members 當中，然後運行程式。 如果對於基本的設定斷點和調試不太熟悉，可以先看看這篇教程。 就像你之前在 Xcode 行為看到的一樣，Generates output 將首先被觸發，緊接著Pause行為被觸發。因為你之前在 Pause 有過自訂設定，所以 Xcode 會建立一個名為 fix 的標籤頁，它專為調試而設。將目光切換到變數檢測器variable inspector，你會發現數組members是nil，在loadData方法數組members被填充，代碼如下 

1. NSDictionary *json = [NSJSONSerialization JSONObjectWithData:data options:kNilOptions error:&error]; 
2. self.members = json[@"Team"]; 

 在變數檢測器中查看json，看其是否被正確載入，你會探索資料中的第一個值是 @"RWTeam" 而不是 @"Team" ，當載入數組 members 時，這個值是錯的，找到了一個bug。 讓我們按下面步驟來修複這個bug：(1)使用 Command + .來進入開發模式(2)按住 Command + Option + J跳至filter bar然後輸入 teammember(3)然後按住Alt同時點擊 TeamMembers.json 在 assistant editor 來開啟它(4)最後，使用 "Team" 來替換 "RWTeam" 是上面四步的一個動畫  現在移除斷點，然後運行程式，它看起來應該像這個樣子。  是不是看起來比之前要好一點了，但是還是有一些bug，比如Ray和Brian的標題描述列不見了。接下來我們通過修複這些bug來學到更多酷炫的技巧。 6.加速你應該已經知道 UITableViewCells 在 tableView:cellForRowAtIndexPath: 方法中被載入，所以用 Open Quickly 來導航到該方法，然後按照下面步驟：(1)按下Command + Shift + O來呼出 Open Quickly(2)輸入cellForRow(3)按下斷行符號來開啟它 按住 command 然後點擊 setupWithDictionary 來跳轉至其定義處，然後你會發現一些用來載入描述的代碼 

1. NSString *aboutText = dictionary[@"about"]; // Should this be aboot? 
2.  self.aboutLabel.text = [aboutText stringByReplacingOccurrencesOfString:@"\\n" withString:@"\n"]; 

 它使用 dictionary[@"about"] 中的資料來載入 label。 接下來呼出 Open Quickly，然後開啟 TeamMembers.json，使用 alt + command 在 Assistant Editor 中開啟。檢查 about 的值，然後你會發現有人將 about 拼字成了 aboot，我們可以使用全域的Find and Replace 來修複這個bug。當然你可以在檔案中直接做這件事，但是使用 find navigate 看起來更酷。開啟 find navigate，然後通過頂部的 jump bar 切換到替換(replace)模式，輸入aboot,然後斷行符號。 在 TeamMembers.json 檔案之外還有一個地方使用到了aboot，別擔心，選中 CTCardCell.m 的搜尋結果，然後按下 Delete，將滑鼠移至 replace filed，然後輸入about，點擊 Replace All，一切完成。整個過程看起來是這個樣子的： Note: 進階技巧:使用 Command + Shift + Option + F 來開啟 Find navigator 的替換模式，如果你嫌麻煩，也可以使用 Command + Shift + F 來開啟 Find navigator 的尋找模式，如果你還嫌麻煩，使用 command + 3 來開啟 Find navigator，然後開啟尋找或者替換模式，選擇一種最適合自己的方式就好。 運行程式，看起來是這樣的 7.讓設計師高興今天的調試任務到此就結束了，給自己一點掌聲，然後開始運行程式。在你將它展示給別人之前，需要先確定app的介面是完美的。尤其當這個人是非常認真的設計師的時候，這一部分教你一些關於interface builder的技巧，讓你變得更酷。 開啟 Mainstoryboard.storyboard，通常你想在開啟 interface builder 的同時開啟 standard editor 和工具區(utilities area)，所以我們可以自訂一個新的叫做 IB Mode 的行為，當你在看下面的自訂發放之前，試著自己建立一個然後自訂，不必要完全一致。 我將這個模式的快速鍵設定為Command Option .，現在你將看到一個舒服的 Interface Builder 介面，看看 CTCardCell。首先你想讓 mainView 處於 ContentView 的正中央。有兩種技巧可以完成這個需求：按住Control + Shift，然後在 mainView 的任意位置滑鼠左擊，你將看到一個彈出視圖讓你選擇在游標下的所有視圖，如所示： 這個方法讓你輕鬆的就能選中 mainView，儘管 cardbg 遮住了它。選中 mainView 之後，按住Alt然後在 ContentView 的邊緣移動滑鼠，來看它們之間的間隔。下面是這個過程的一個動畫： 原來對其並不是那麼優雅，看起來也不是很酷。為瞭解決這個，我們可以調整視圖的大小。點擊Editor->Canvas->Live Autoresizing來使子視圖在父視圖尺寸改變的時候強制調整大小。按住Alt同時拖拽mainView的一角，直到每邊的距離為15. Note: 拖拽是像素點層級的技巧，你可以嘗試不同的調整的處理方法，就像下面動畫一樣。在很多情況下，更傾向於使用`Size Inspector`來調整複雜的布局，而非用滑鼠來拖拽。 試著使用相同的技巧來對齊titleLabel、locationLabel、aboutLabel,讓他們豎直方向上的間隔為0。按住Alt來查看滑鼠移動時，三個label之間的間隔。有發現三個label的左邊緣並沒有對齊嗎？設計師肯定想讓nameLabel和webLabel靠左對齊。使用Vertical Guide可以昂我們輕鬆完成這個任務。選中cardbg，然後點擊功能表列的Editor->Add Vertical Guide，這個步驟的快速鍵是Command |，horizontal guide的快速鍵是Command -，這兩個快速鍵是最可視化的。當視圖上有了vertical guide之後，將其從cardbg的左邊緣拖10個點。然後所有視圖將會緊貼vertical guide，對的非常整齊，繼續為其他的label進行對其操作。Note: Xcode並不那麼完美，有時候可能在你建立guideline的時候出現一些問題，可以開啟其他檔案然後再切回到storyboard頁面，然後storyboard會被重新載入，這個時候問題一般會自動解決。讓你更酷的建議：所有的視圖能緊貼在guideline上才是最好的，guideline沒有必要在同一個層級。 是上面對齊過程的一個回放： 我敢打賭你現在迫不及待的想把你做的展示給你的設計師看！ 8.提升和超越上面的步驟讓你得到了一個實用的app，同時讓你的設計師也感到很滿意，那麼接下來我們要做的就是讓代碼變得更為簡潔。 快速開啟(Command + Shift + O)CTCardCell.m，記得進入Dev Mode(Command .)，你應該不會忘了這些快速鍵吧。 看下 CTCardCell.m 頂部淩亂的屬性列表 

1. @property (weak, nonatomic) IBOutlet UILabel *locationLabel; 
2. @property (strong, nonatomic) NSString *website; 
3. @property (weak, nonatomic) IBOutlet UIButton *fbButton; 
4. @property (weak, nonatomic) IBOutlet UIImageView *fbImage; 
5. @property (strong, nonatomic) NSString *twitter; 
6. @property (weak, nonatomic) IBOutlet UIButton *twButton; 
7. @property (weak, nonatomic) IBOutlet UILabel *webLabel; 
8. @property (weak, nonatomic) IBOutlet UIImageView *profilePhoto; 
9. @property (strong, nonatomic) NSString *facebook; 
10. @property (weak, nonatomic) IBOutlet UIImageView *twImage; 
11. @property (weak, nonatomic) IBOutlet UILabel *aboutLabel; 
12. @property (weak, nonatomic) IBOutlet UIButton *webButton; 
13. @property (weak, nonatomic) IBOutlet UILabel *nameLabel; 
14. @property (weak, nonatomic) IBOutlet UILabel *titleLabel; 

 在這部分，你將建立一個自訂服務以執行指令碼命令來實現屬性的快速整齊地排列。 Note: 如果對於這些指令碼命令還不熟悉，它們是相當好理解的。排序(sort)是按照字母順序來的，`uniq`是會刪除所有重複的行數。`uniq`在這裡可能派不上用場，但是用它來管理`#import`，那是極好的。Mac OS X允許你建立整個作業系統全域通用的服務，你將用它來建立一個用在Xcode中的指令碼服務，按如下步驟來設定：（1）使用Spotlight來搜尋Automator，並開啟它（2）然後點擊File->New，並選擇服務(service)一項（3）在Actions篩選欄，輸入shell，然後雙擊運行shell指令碼Run Shell Script（4）在新添加的服務的功能表列上,檢查Output replaces selected text（5）將指令碼內容切換至sort | uniq（6）同步選取command s，將服務儲存為 Sort & Uniq 最終的視窗看起來是這個樣子：  切回到Xcode，然後選中 CTCardCell.m 中的那片混亂的屬性地區，右擊，選擇 Services -> Sort & Uniq，然後觀察執行之後代碼是多麼的整潔。你可以看下面的一個： 9.程式碼片段進行到這裡，意味著那些基本的可以讓你看起來酷酷的調試任務已經告一段落了，接下來我希望你覺得更酷。你可定想學更多技巧，幸運的是，這是最後分享的一個技巧。 你之前可能已經使用過Xcode的程式碼片段(Code Snippets)功能了，一些常見的是for in片段和dispatch_after片段。在這一部分，你將學會如何建立自訂的程式碼片段，當你重用這些程式碼片段時，看起來非常棒。你將建立的是擷取單例的程式碼片段。 如果你不熟悉單例模式，可以看看這個教程。 下面可能是你使用單例模式的常用代碼模板 

1. + (instancetype)sharedObject { 
2.   static id _sharedInstance = nil; 
3.   static dispatch_once_t oncePredicate; 
4.   dispatch_once(&oncePredicate, ^{ 
5.     _sharedInstance = [[self alloc] init]; 
6.   }); 
7.   return _sharedInstance; 
8. } 

 非常酷的是這份片段也包含了dispatch_oncep片段。 在工程CardTilt建立一個名為繼承自NSObject名為SingletonObject的新類，你不需要為它做任何事，除了作為拖拽程式碼片段的一個地方。 按下面步驟：（1）在 @implementation 的下一行粘貼上面的代碼到 SingletonObject.m（2）用快速鍵Command Option Control 2來開啟程式碼片段庫，在程式碼片段庫中你會看到預設的包含在Xcode中的程式碼片段庫。（3）選中整個+sharedObject方法，將其拖拽到程式碼片段庫中。 看起來是這樣的： 新建立的程式碼片段將會在程式碼片段庫的最底部，你可以將其拖拽到任何你想拖拽的檔案當中去，讓我們來嘗試一下。 雙擊剛剛建立的程式碼片段，然後點擊edit.彈出的視圖非常使用，實際上它們都很重要，所以做個簡短的解釋。 （1）Title and Summary：程式碼片段庫中該程式碼片段的名字和簡述（2）Platform and Language:程式碼片段匹配的平台和程式設計語言（3）Completion Shortcut:在Xcode中輸入的快速鍵（4）Completion Scopes:程式碼片段作用的範圍，這對於保持程式碼片段庫整潔來說十極好的。 向下面一樣填充裡面的屬性： 9.1令牌當你加入令牌時，程式碼片段將會變得非常強大，因為它允許你在片段中標記代碼，而不需要寫入程式碼。通過使用Tab鍵使得他們非常容易修改，就像自動補全一樣。 在片段中僅僅只要輸入 <#TokenName#> 就可以添加一個令牌，建立一個令牌使用 shared<#ObjectName#>替代sharedObject ，看起來像這樣： 點擊 Done 來儲存該片段，然後來用用它。 在 SingletonObject.m 檔案中輸入 singleton accessor，然後當它出現的時候使用自動補全 對於經常使用的代碼來說，建立一個程式碼片段是非常實用的。 10.何去何從總結一下在這個教程中你所學到的東西：（1）使用快速鍵來改變Xcode的布局（2）使用自訂的行為來改變Xcode的布局（3）使用assistant editor（4）在Xcode中快速開啟某檔案（5）在Find navigator刪除搜尋到的結果（6）在Interface Builder使用快速鍵和guideline來對齊視圖（7）建立一個在Xcode中使用的服務（8）建立並使用自訂的程式碼片段（9）最重要的是你知道怎麼去成為一名Xcode大師 上面列出來的內容都很簡單對吧？在你的朋友面前展示這些炫酷的技巧，你的朋友一定會驚呆也會理解你的興奮。還有很多方法可以提高你的Xcode的效率，比如：使用Doxygen風格的注釋使用Xcode外掛程式 下一步就是去尋找新的酷炫的技巧，我希望你能享受整個教程的學習過程，如果你有任何問題、評論、或者想分享你所知道的炫酷技巧，請在下面評論中指出。

高效使用你的Xcode