iOS SDK詳解之UITabbar（仿新浪微博的Demo）

iOS SDK詳解之UITabbar（仿新浪微博的Demo）

 

 前言：UITabBarController和UINavigationController是大多數App選擇的導航模式。而UITabBarController的UITabBar又是其呈現給使用者的UI部分，所以瞭解其屬性，以及如何自訂非常重要。本文模仿新浪微博寫一個簡單的Tabbar，感興趣的同學可以下載來看看，Demo的實現我會在本文最後簡單提一下。

Demo 效果（表徵圖文字隨便寫的）
靜態圖

動圖

Demo的具體代碼就不講解了，感興趣的同學下載下來看看就知道怎麼回事，而且，我的資源都是不要積分就可以下的。
下載連結
http://download.csdn.net/detail/hello_hwc/9068705

UITabbar的常用屬性

tintColor//定義TabBarItems的選種顏色

例如,設為紅色

幾個Image相關的屬性

backgroundImage

設定UITabbar的背景圖片，例如，設定上文最開始的Demo的背景圖片為漸層

shadowImage //陰影圖片selectionIndicatorImage //選種後再tabbar之上，再baritem之下的圖片。

translucent //是否透明

UIBarItem的幾個常用屬性

image/selectedImage //圖片，和選中後的圖片

例如，我的Demo中，對中間的Item進行了如下設定
保證怎麼點擊都使用我想要的圖片

 item.image = [midImage imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal]; item.selectedImage = [midImage imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal];

調整title和Icon的位置

titlePositionAdjustment/imageInsets

例如，我的Demo中，中間的是大圖，沒有title的，要調整Icon的位置

item.imageInsets = UIEdgeInsetsMake(5.0, 0, -5.0, 0);

調整之前

之後

設定字型樣式<喎?http://www.bkjia.com/kf/ware/vc/" target="_blank" class="keylink">vcD4NCjxwcmUgY2xhc3M9"brush:java;">setTitleTextAttributes:forState:

例如，使用如下代碼把字型設為藍色

 [item setTitleTextAttributes:@{NSForegroundColorAttributeName:[UIColor blueColor]} forState:UIControlStateNormal];

設定前後對比

Demo的講解模糊使用UIVisualEffectView 動畫我嘗試了Keyframe，UISnapBehaviour，以及Demo中的代碼，發現還是Demo中的更加清楚一點。 使用tag來傳遞第幾個icon被點擊