1.Twitter使用定制的UITabBar。
2.Instagram使用定制的UITabBar和UINavigationBar。
3.Epicurous (iPad版)使用標準拆分視圖的自定義元素。
在iOS5推出之前，開發者想要實現標準界面的定制化設計並不是那麽簡單。雖然創建drawRect的子類或者重寫drawRect類是個好主意，但是開發人員會被這樣的事情搞糊塗。
現在有了iOS5，開發者終於看到了曙光！IOS5包含許多新的API，可以輕松定制不同UIKit界面控件元素的外觀。
為了演示這些功能，本文將使用壹個名為“Surf's Up”的示例項目，使界面更具“海灘風格”。
當然，在學習本教程之前，妳需要了解iOS開發的基礎知識。
現在這個應用勉強可用，但是從界面上完全感受不到沙灘沖浪的氛圍。
我們從詳情頁開始。現在看起來挺標準的。
首先是頂部UINavigationBar(導航欄)上的普通UIBarButtonItem，然後是底部的幾個UITabBar元素，最後是幾個標準的數據輸入元素:
1.使用系統Helvetica字體的UILabel(標簽)。
2.UITextField(文本輸入框)
3.UISlider(滑塊)
4.UISwitch(轉換開關)
5.分段控制
我們要做的就是把這些完全“標準”的界面改造成風格獨特的定制界面。
添加背景圖片
事實上，我們已經將所有需要的圖片放在資源中，所以我們所要做的就是添加代碼。
images文件夾裏有壹張bg_sand.png圖片。我們打算用它作為詳細視圖的背景圖片。
打開DetailViewController.m並創建壹個viewDidLoad方法，如下所示:
-(void)viewDidLoad{
[superviewDidLoad]；
[[self view]set background color:[uicolorcolowithpatterniimage:[UIImageimageNamed:@ " BG _ sand "]]；
}
自定義UINavigationBar
在images文件夾中，我們將使用以下兩張圖片來自定義導航欄:surf_gradient_textured_32.png和surf _ gradient _ textured _ 32.png。
我們希望在導航欄中從左到右重復放置這些圖片。它們都使用兩種不同的高度，因為當切換到橫向模式時，導航欄會縮小。
為了達到上述效果，iOS提供了兩個新的API:
1.UINavigationbar現在可以設置backgroundImage屬性。
2.UIImage提供了壹種新的resizableImageWithCapInsets方法，便於創建可調整大小的圖片。
當然，我們可以進入細節視圖，用上面的API直接設置導航欄的背景圖片。但是如果這樣做，就必須在應用程序的列表視圖或其他視圖中手動修改。
幸運的是，iOS5允許我們壹次性定制用戶界面元素，這樣“處於同壹級別”的界面元素就可以使用類似的定制。
在SurfsUpAppDelegate.m文件中，在應用程序上方添加壹個新方法:did finishlaunching with options:method，如下所示:
-(void)定制外觀{
//創建可調整大小的圖像創建可調整大小的圖像。
ui image * gradient image 44 =[[UIImageimageNamed:@ " surf _ gradient _ textured _ 44 "]resizableImageWithCapInsets:UIEdgeInsetsMake(0，0，0，0)]；
ui image * gradient image 32 =[[ui image image named:@ " surf _ gradient _ textured _ 32 "]resizableImageWithCapInsets:uiedgeinsets make(0，0，0，0)]；
//設置* all * uinavigationbars的背景圖像設置所有導航欄的背景圖像。
[[UINavigationBarappearance]set background image:gradient image 44 for barmetrics:UIBarMetricsDefault]；
[[UINavigationBarappearance]set background image:gradient image 32 for barmetrics:UIBarMetricsLandscapePhone]；
//自定義* all * uinavigationbars的標題文本設置所有導航欄的標題文本。
[[UINavigationBarappearance]setTitleTextAttributes:
[NSDictionarydictionaryWithObjectsAndKeys:
[uicolorcolowithred:255.0/255.0綠色:255.0/255.0藍色:255.0/255.0alpha:1.0]，
UITextAttributeTextColor，
【uicolorcolowithred:0.0綠色:0.0藍色:0.0alpha:0.8】，
UITextAttributeTextShadowColor，
[nsvaluewithfuioffset:UIOffsetMake(0，-1)]，
UITextAttributeTextShadowOffset，
[UIFontfontWithName:@ " Arial-Bold " size:0.0]，
UITextAttributeFont，
nil]]；
}
在上面的代碼中，前兩行的功能是通過使用resizableImageWithCapInsets方法創建壹個可縮放的圖像。需要註意的是，該方法替代了之前版本中使用的stretchableimagewithlefcapwidth:top cap height:方法(已刪除)。
關於cap insets，我們只需要簡單地在頂部、左端、右端和下部設置指定圖像的固定區域。在這裏，我們希望整個圖片縮放，所以我們為每壹端設置0。
接下來的兩行代碼使用外觀代理將可縮放圖片設置為背景圖片，並指定導航欄的測量方法。
最後幾行代碼指定了詳細視圖中的標題樣式。我們傳入了標題文本屬性字典，相關的可用鍵值包括:
UITextAttributeFont
UITextAttributeTextColor
UITextAttributeTextShadowColor
UITextAttributeTextShadowOffset
好了，差不多完成了，只需要在應用程序的頂部添加壹行代碼:did finish launching with options:method:
【self customize appearance】；
編譯並運行應用程序，切換設備的方向。
自定義UIBarButtonItem
打開圖片，找到兩個文件，button_textured_24.png和button_textured_30.png，我們將用它們來設置導航欄中按鈕的外觀。
註意，我們需要使按鈕圖像可調整大小，因為按鈕的寬度取決於其中的文本。
對於這些按鈕，我們不需要縮放最左邊和最右邊的五個像素，所以我們需要將left和rightcaps設置為5。
在Customizability方法的末尾添加以下代碼:
//自定義UIBarButtonItems的外觀
ui image * button 30 =[[UIImageimageNamed:@ " button _ textured _ 30 "]resizableImageWithCapInsets:UIEdgeInsetsMake(0，5，0，5)]；
ui image * button 24 =[[UIImageimageNamed:@ " button _ textured _ 24 "]resizableImageWithCapInsets:UIEdgeInsetsMake(0，5，0，5)]；
[[uibarbuttonitemcappearance]set background image:button 30 for state:UIControlStateNormalbarMetrics:UIBarMetricsDefault]；
[[uibarbuttonitemcappearance]set background image:button 24 for state:uicontrolstatenormalbarrmetrics:UIBarMetricsLandscapePhone]；
[[uibarbuttonitempearance]setTitleTextAttributes:
[NSDictionarydictionaryWithObjectsAndKeys:
[uicolorcolowithred:220.0/255.0綠色:104.0/255.0藍色:1.0/255.0 alpha:1.0]，
UITextAttributeTextColor，
[uicolorcolowithred:1.0 green:1.0 blue:1.0 alpha:1.0]，
UITextAttributeTextShadowColor，
[nsvaluewithuifoffset:UIOffsetMake(0，1)]，
UITextAttributeTextShadowOffset，
[UIFontfontWithName:@ " American typewriter " size:0.0]，
UITextAttributeFont，
無]
for state:UIControlStateNormal]；
上面的代碼實際上類似於自定義導航欄。首先，我們為按鈕創建了壹個可縮放的圖像，並將其設置為背景圖像。然後我們指定文本的格式。
“後退”按鈕需要特殊定制，因為它需要看起來不同。
讓我們將以下代碼添加到Customizability方法的末尾，以便對back按鈕進行特殊處理:
//自定義UIBarButtonItems上“後退”的外觀
ui image * button back 30 =[[UIImageimageNamed:@ " button _ back _ textured _ 30 "]resizableImageWithCapInsets:uiedgeinsets make(0，13，0，5)]；
ui image * button back 24 =[[UIImageimageNamed:@ " button _ back _ textured _ 24 "]resizableImageWithCapInsets:uiedgeinsets make(0，12，0，5)]；
[[uibarbuttonitempearance]setBackButtonBackgroundImage:button back 30 for state:UIControlStateNormalbarMetrics:UIBarMetricsDefault]；
[[uibarbuttonitempearance]setBackButtonBackgroundImage:button back 24 for state:uicontrolstatenormalbarmmetrics:UIBarMetricsLandscapePhone]；
需要註意的是，我們為back按鈕設置了不同的值。同時，UIBarButtonItem還有壹個特殊的backButtonBackgroundImage屬性可以使用。
編譯運行，可以看到下圖:
自定義UITabBar
iOS5中提供了壹個API來設置UITabBar的背景圖片，並表示選中的圖片。
在customizeAppearance方法的底部添加以下代碼:
//自定義UITabBar的外觀
ui image * tab background =[[UIImageimageNamed:@ " tab _ BG "]resizableImageWithCapInsets:uiedgeinsets make(0，0，0，0)]；
[[uitabbarpearance]set background image:tab background]；
[[uitabbarpearance]setSelectionIndicatorImage:[UIImageimageNamed:@ " tab _ select _ indicator "]]；