1. 程式人生 > >iOS 幾句程式碼實現導航欄透明漸變

iOS 幾句程式碼實現導航欄透明漸變

首先我們來看下效果:
在這裡插入圖片描述

下面有幾種方案:

1.設定漸變圖片

根據上面設定為透明的方法,我們最直接能想到的還是setBackgroundImage,根據滑動距離去設定圖片的alpha。是的,我們是去設定圖片,而不是設定UIView,這樣的話就需要你不停的去生成新圖片賦給BackgroundImage,這樣感覺是不是會不太好?

2.執行時動態繫結

我們可以在執行時動態繫結他的背景檢視,然後設定他的背景透明度,網上有一個通過類別方式動態繫結實現導航欄顏色漸變的三方框架,感興趣的朋友可以自行去研究研究LTNavigation。

3.直接獲取那張ImageView,然後設定他的透明度。

其實我們從結構圖中可以看出來,它是NavigationBar的子檢視,我們可以通過for…in迴圈遍歷navigationBar.subviews,然後獲得這個view。

當然,更簡單的,它其實就在subviews的第一個,即我們可以這樣:

barImageView = self.navigationController.navigationBar.subviews.firstObject;

我們可以用一個全域性的imageView引用他,以免我們每次都要寫一長串。

最後,我們僅僅只需要在scrollViewDidScroll裡面,根據偏移量來動態改變barImageView的背景顏色(或者透明度)就行了。

例如我們需要在-64(預設的最小偏移量)到200之間變化:

- (void)scrollViewDidScroll:(UIScrollView *)scrollView {
    CGFloat minAlphaOffset = - 64;
    CGFloat maxAlphaOffset = 200;
    CGFloat offset = scrollView.contentOffset.y;
    CGFloat alpha = (offset - minAlphaOffset) / (maxAlphaOffset - minAlphaOffset);
    _barImageView.alpha = alpha;
}

就這樣你就可以實現我在文章一開始那個圖片的效果了(其實並不是,tintColor和satusBarStyle還沒變)。

Tips

1)你也可以動態的更改的狀態列和標題的顏色以和導航欄更匹配

//狀態列
[[UIApplication sharedApplication] setStatusBarStyle:UIStatusBarStyleLightContent];
//標題顏色
self.navigationController.navigationBar.titleTextAttributes = @{NSForegroundColorAttributeName : [UIColor someColor]}
//導航欄子控制元件顏色
self.navigationController.navigationBar.tintColor = [UIColor someColor];

2)注意釋放tableView 的 delegate(不然你進進出出時候會發現哪裡好像不太對)

- (void)viewWillAppear:(BOOL)animated {
    [super viewWillAppear:animated];
    self.tableView.delegate = self;
}
- (void)viewWillDisappear:(BOOL)animated {
    [super viewWillDisappear:animated];
    self.tableView.delegate = nil;
}

3)導航欄是公有的

所以你可能需要在ViewWillDisappear裡面再把導航欄設定為你需要的樣子
我自己封裝了一些導航欄變化效果,使用簡單,歡迎大家嘗試:HQShopDemo