UINavigationbar和UITabbar 的那些事

工作很長一段時間了俊犯,搭建框架的時候沒有搭好,然后者祖,需求又一直改變七问,其中導(dǎo)航條和標(biāo)簽欄的修改是比較難受的械巡,特別是完全使用系統(tǒng)的導(dǎo)航條和標(biāo)簽欄讥耗。
比如:
1.修改導(dǎo)航條的返回按鈕的的圖片
2.修改導(dǎo)航返回按鈕的文字顏色和大小
3.去掉導(dǎo)航條的返回文字
4.統(tǒng)一修改導(dǎo)航標(biāo)題的字體樣式和大小
5.修改標(biāo)簽欄的字體樣式和顏色
6.把標(biāo)簽欄的文字去掉只留下圖片
7.把導(dǎo)航條和標(biāo)簽欄的黑線去掉
8 在跳轉(zhuǎn)到下一個頁面的時候隱藏標(biāo)簽欄
這些東西不難,但是要是不熟悉籍琳,產(chǎn)品經(jīng)理要你改的時候趋急,覺得很惡心呜达,下面我就一一來說說這個怎么弄查近,然后我寫一個demo放在github 上提供大家參考霜威,也可以直接使用我寫好的TabbarController框架戈泼。
先看一下效果吧(順便加了大神寫的一個全屏側(cè)滑返回的方法)

tabbar.gif

先說一下導(dǎo)航條:

新建一個繼承字UINavigationController 的類大猛,在類的.m 文件中
<pre><code> 先設(shè)置導(dǎo)航條不透明
self.navigationBar.translucent = NO;
//設(shè)置導(dǎo)航條的背景顏色
self.navigationBar.barTintColor = Nav_background_Color;
//設(shè)置導(dǎo)航條的主色調(diào)顏色
self.navigationBar.tintColor = Nav_tintColor;</code></pre>

//設(shè)置返回按鈕為自定義圖片
<pre><code>
//設(shè)置返回的箭頭自定義圖片
//imageWithRenderingMode 這個是圖片的顯示模式膛壹,設(shè)置成其他的選項(xiàng)模聋,你的返回按鈕的顏色不是自己圖片顏色
UIImage *backimage =[Nav_back_icon imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal];
//注意:下面兩個屬性都得設(shè)置撬槽,只設(shè)置一個是無效的
[[UINavigationBar appearance] setBackIndicatorTransitionMaskImage:backimage];
[[UINavigationBar appearance]setBackIndicatorImage:backimage];
</code></pre>

//去掉導(dǎo)航條的返回文字,去掉這個還真的不好去掉,鉆了空子占调,設(shè)置了文字的PositionAdjustmen就可以了
<pre><code>
// 去掉返回按鈕文字
UIBarButtonItem *baritem =[UIBarButtonItem appearanceWhenContainedIn:[UINavigationBar class], nil];
UIOffset offset;
offset.horizontal = -500;
[baritem setBackButtonTitlePositionAdjustment:offset forBarMetrics:UIBarMetricsDefault];
</code></pre>
//導(dǎo)航條上文字設(shè)置
<pre><code>
//設(shè)置返回按鈕
[baritem setTitleTextAttributes:@{NSFontAttributeName:[UIFont systemFontOfSize:14]} forState:UIControlStateNormal];<code></code>
//改變導(dǎo)航的title 字體的樣式
<code>NSDictionary *titleAttributes = [NSDictionary dictionaryWithObjectsAndKeys:Nav_Title_Color,NSForegroundColorAttributeName,Nav_Title_Font,NSFontAttributeName, nil]; [[UINavigationBar appearance] setTitleTextAttributes:titleAttributes];
</code></pre>
// 這里重寫了系統(tǒng)的push到下一個頁面的方法,使用viewController.hidesBottomBarWhenPushed跳轉(zhuǎn)到下一個頁面的導(dǎo)航條
<pre><code>
-(void)pushViewController:(UIViewController *)viewController animated:(BOOL)animated
{
if (self.viewControllers.count>0) {
///第二層viewcontroller 隱藏tabbar
viewController.hidesBottomBarWhenPushed=YES;
}
[super pushViewController:viewController animated:YES];
}</code></pre>

導(dǎo)航欄說完了剿涮,下面說下標(biāo)簽欄了取试。

新建一個繼承自UITabBarController的類
<pre><code>
//設(shè)置背景顏色
self.tabBar.barTintColor = Tab_BAR__BACK_CLOLOR;
//設(shè)置標(biāo)簽不透明
self.tabBar.translucent= NO;
//常規(guī)設(shè)置
NSArray *classNameArray =[NSArray arrayWithObjects:@"FirstViewController",@"SecondViewController",@"ThirdViewController", nil];
NSArray *titleArray =[NSArray arrayWithObjects:@"first",@"second",@"third", nil];
NSArray *normalImageArray =[NSArray arrayWithObjects:@"feed_tab_butten_normal.png",@"movie_tab_butten_normal.png",@"me_tab_butten_normal.png",nil];
NSArray *selectImageArray =[NSArray arrayWithObjects:@"feed_tab_butten_press.png",@"movie_tab_butten_press.png",@"me_tab_butten_press.png", nil];

NSMutableArray  *navigationArray =[[NSMutableArray alloc]init];
for (int i=0; i<classNameArray.count; i++) {
    UIViewController  *vc =(UIViewController *)[[NSClassFromString(classNameArray[i]) alloc] init];
    vc.title=titleArray[i];
    UIImage  *normalImage =[UIImage imageNamed:normalImageArray[i]];
    UIImage  *selectImage =[UIImage imageNamed:selectImageArray[i]];
    vc.tabBarItem.image =[normalImage imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal];
    vc.tabBarItem.selectedImage=[selectImage imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal];

去掉標(biāo)簽欄的文字蓬坡,也是跟導(dǎo)航欄的文字一樣的道理屑咳,設(shè)置便宜兆龙,巧妙的去掉了標(biāo)簽欄文字,這里設(shè)置后臣缀,下面設(shè)置字體樣式就沒有意義了精置。
UIOffset offoset = UIOffsetMake(0, 300);
[vc.tabBarItem setTitlePositionAdjustment:offoset];
BaseNavigationViewController *na =[[BaseNavigationViewController alloc]initWithRootViewController:vc];
[navigationArray addObject:na];
}
self.viewControllers=navigationArray;
//標(biāo)簽欄的文字設(shè)置
UITabBarItem *item = [UITabBarItem appearance];
//正常狀態(tài)的文字
[item setTitleTextAttributes:@{NSForegroundColorAttributeName:Tab_TITLE_NORMAL_COLOR, NSFontAttributeName:Tab_TITLE_FONT} forState:UIControlStateNormal];
//選擇的文字
[item setTitleTextAttributes:@{NSForegroundColorAttributeName:Tab_TITLE_SELECTED_COLOR, NSFontAttributeName:Tab_TITLE_FONT} forState:UIControlStateSelected];</code></pre>
//差點(diǎn)忘了說怎么修改導(dǎo)航條和標(biāo)簽欄下面黑線的顏色了,這個imageWithColor:是我寫的把顏色轉(zhuǎn)化成圖片的類脂倦。
<pre>[self.navigationController.navigationBar setShadowImage:[UIImage imageWithColor:VLight_GrayColor_apla]];
[self.tabBarController.tabBar setShadowImage:[UIImage imageWithColor:VLight_GrayColor_apla]];
</pre>
好了,到這里火欧,高度自定義的導(dǎo)航條和標(biāo)簽欄就完成了苇侵,而且我們完全使用系統(tǒng)的企锌,由于本人技術(shù)有限陡鹃,所有希望大家有什么問題斧正啊抖坪。
代碼我放在了github上 地址是
ZFYTabbarController

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末猿推,一起剝皮案震驚了整個濱河市蹬叭,隨后出現(xiàn)的幾起案子秽五,更是在濱河造成了極大的恐慌坦喘,老刑警劉巖瓣铣,帶你破解...
    沈念sama閱讀 217,406評論 6 503
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件梦碗,死亡現(xiàn)場離奇詭異洪规,居然都是意外死亡斩例,警方通過查閱死者的電腦和手機(jī)念赶,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 92,732評論 3 393
  • 文/潘曉璐 我一進(jìn)店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人驻民,你說我怎么就攤上這事回还∧叮” “怎么了蝗柔?”我有些...
    開封第一講書人閱讀 163,711評論 0 353
  • 文/不壞的土叔 我叫張陵,是天一觀的道長胁编。 經(jīng)常有香客問我嬉橙,道長市框,這世上最難降的妖魔是什么拾给? 我笑而不...
    開封第一講書人閱讀 58,380評論 1 293
  • 正文 為了忘掉前任级及,我火速辦了婚禮饮焦,結(jié)果婚禮上县踢,老公的妹妹穿的比我還像新娘伟件。我一直安慰自己斧账,他們只是感情好咧织,可當(dāng)我...
    茶點(diǎn)故事閱讀 67,432評論 6 392
  • 文/花漫 我一把揭開白布渠抹。 她就那樣靜靜地躺著,像睡著了一般篮幢。 火紅的嫁衣襯著肌膚如雪为迈。 梳的紋絲不亂的頭發(fā)上三椿,一...
    開封第一講書人閱讀 51,301評論 1 301
  • 那天缺菌,我揣著相機(jī)與錄音,去河邊找鬼搜锰。 笑死伴郁,一個胖子當(dāng)著我的面吹牛,可吹牛的內(nèi)容都是我干的焊傅。 我是一名探鬼主播,決...
    沈念sama閱讀 40,145評論 3 418
  • 文/蒼蘭香墨 我猛地睜開眼狈涮,長吁一口氣:“原來是場噩夢啊……” “哼狐胎!你這毒婦竟也來了?” 一聲冷哼從身側(cè)響起歌馍,我...
    開封第一講書人閱讀 39,008評論 0 276
  • 序言:老撾萬榮一對情侶失蹤握巢,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后松却,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體暴浦,經(jīng)...
    沈念sama閱讀 45,443評論 1 314
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 37,649評論 3 334
  • 正文 我和宋清朗相戀三年晓锻,在試婚紗的時候發(fā)現(xiàn)自己被綠了歌焦。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點(diǎn)故事閱讀 39,795評論 1 347
  • 序言:一個原本活蹦亂跳的男人離奇死亡砚哆,死狀恐怖独撇,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情躁锁,我是刑警寧澤券勺,帶...
    沈念sama閱讀 35,501評論 5 345
  • 正文 年R本政府宣布,位于F島的核電站灿里,受9級特大地震影響,放射性物質(zhì)發(fā)生泄漏程腹。R本人自食惡果不足惜匣吊,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 41,119評論 3 328
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望寸潦。 院中可真熱鬧色鸳,春花似錦、人聲如沸见转。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,731評論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽斩箫。三九已至吏砂,卻和暖如春撵儿,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背狐血。 一陣腳步聲響...
    開封第一講書人閱讀 32,865評論 1 269
  • 我被黑心中介騙來泰國打工淀歇, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留,地道東北人匈织。 一個月前我還...
    沈念sama閱讀 47,899評論 2 370
  • 正文 我出身青樓浪默,卻偏偏與公主長得像,于是被迫代替她去往敵國和親缀匕。 傳聞我的和親對象是個殘疾皇子纳决,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 44,724評論 2 354

推薦閱讀更多精彩內(nèi)容