iPhone 自訂navigation bar全攻略 包含按鈕,高度及圖片背景

在blogspot上面看了篇文章不错, 转一下http://jingjong404.blogspot.com/2010/11/iphone-navigation-bar.html

iPhone的UI真的有很多小細節,我想也累積一些東西了就po上來吧.

自製化的navigation bar到底有多彈性呢?
我想改變navigation bar上面按鈕的樣式, 可以!
想改變navigation bar的高度, 可以!
想給navigation bar上個圖片, 可以!
那..那navigation bar上按鈕的位置呢?  還是可以!!

如果技巧太鼈三就包涵一下啦:P
navigation bar中的按鈕參照UIBarButtonItemStyle所定義項目少了custom這項
不過可以透過 initWithCustomView 的方式建立自訂的按鈕
詳細作法如下:
1. 先建立一個UIButton,設定其大小位置以及各狀態對應的圖片,最後還要一個action的指向
UIButton * fooButton = [UIButton buttonWithType:UIButtonTypeCustom];
fooButton.bounds = CGRectMake(0, 0, 40.0, 40.0);
[fooButton setImage:[UIImage imageNamed:@"foo.png"] 
forState:UIControlStateNormal];
[fooButton addTarget:self 
       action:@selector(fooFired:) 
     forControlEvents:UIControlEventTouchUpInside];


2. 接著new一個UIBarButtonItem後,加入navigationItem(這邊以右邊為例)
UIBarButtonItem *fooBarButtonItem = [[UIBarButtonItem alloc]initWithCustomView:fooButton];
self.navigationItem.rightBarButtonItem = fooBarButtonItem;
[fooBarButtonItem release];


(trick 1)  接下來講講navigation bar的高度怎麼改變,
網路上可以找到一些方法,不過直接改變高度似乎不可行(至少我自己試過不行)
self.navigationController.navigationBar.frame.size.height
另外一個就正常啦,set自己想要的大小位置
[self.navigationController.navigationBar 
setFrame:CGRectMake(0, 0, self.view.width, height)];


(trick 2)  給navigation bar上個圖片也不會太難
1. 首先new一個UIImageView
UIImageView * banner = [[UIImageView alloc]
initWithFrame:CGRectMake(0, 0, width, height)];


2. 指定這個ImageView載入的圖片
banner.image = [UIImage imageNamed:@"banner.png"];

3. 透過addsubview的方式加進navigation bar(這裡額外指定layer在最底層)

[self.navigationController.navigationBar insertSubview:banner atIndex:0];

self.navigationController.titleView = banner;

上面這個作法會讓titleView蓋過title的字 (very important)


咳~醜媳婦終究還是要見公婆
改變navigation bar按鈕位置的方法有點投機
如果想要達到下圖的樣子要善用trick1跟trick2


首先在我們改變navigation bar高度的過程中
一定會發現按鈕的位置都偏下,就像下面的圖


沒關係,我們在navigation bar上面放一個高度較高,size較大的圖片蓋過去
如此一來navigation bar上面的按鈕怎麼看都會在中間啦!

順帶一提:
自訂的navigation bar剛開始跑起來都還好端端的,
但是隱藏過後又要顯示時,
按鈕設定全跑了,navigation bar高度也會回復預設值.
後來解決的方法還滿暴力的,
就是要再度顯示之前,再設定一次navigation bar的frame size
[self.navigationController.navigationBar 
setFrame:CGRectMake(0, 0, width, height)];
[self.navigationController setNavigationBarHidden:NO 
                                       animated:NO]; 

Update:
如果rotate會導致navigation bar上面的button位置跑掉,
表示其高度被設定回預設值,
解決的方法也是在rotate完成後,再設定一次navigation bar的frame size
- (void)didRotateFromInterfaceOrientation:(UIInterfaceOrientation)fromInterfaceOrientation {
  //set your frame size here
}
  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值