超簡單好用的監(jiān)聽滾動,導(dǎo)航條漸隱的UI效果實現(xiàn)(目前最流行的UI效果之一) ,源碼分享
打開你手里的App仔細觀察，你會發(fā)現(xiàn)很多都有實現(xiàn)這個功能。
效果圖如下
實現(xiàn)思路
1.首先來看一下導(dǎo)航條的層次結(jié)構(gòu)圖,先搞定背景圖片View的Alpha值,即黃色箭頭指向的view
?
怎么拿到黃色標(biāo)注出來的view呢,查看導(dǎo)航控制器的頭文件,并未發(fā)現(xiàn)有對外暴露屬性.通過運行時拿?沒必要,這里教大家一個簡單的方法.看下面代碼.
[[[self.navigationController.navigationBar subviews]objectAtIndex:0] setAlpha:alpha];
2.再設(shè)置左中右三個item視圖的Alpha值
代碼如下
//設(shè)置導(dǎo)航條上的標(biāo)簽是否跟著透明
self.navigationItem.leftBarButtonItem.customView.alpha = self.isLeftAlpha?alpha:1;
self.navigationItem.titleView.alpha = self.isTitleAlpha?alpha:1;
self.navigationItem.rightBarButtonItem.customView.alpha = self.isRightAlpha?alpha:1;
3.然而還有一個很重要的問題,既然是導(dǎo)航控制器,那就有push和pop操作,也就說會有多個控制器共用一個導(dǎo)航條.那怎么樣讓各個控制器中的導(dǎo)航條不相互影響呢?
解決方案如下
- (void)setInViewWillAppear{
static dispatch_once_t onceToken;
dispatch_once(&onceToken, ^{
self.navBarBackgroundImage = [self.navigationController.navigationBar backgroundImageForBarMetrics:UIBarMetricsDefault];
});
//設(shè)置背景圖片
[self.navigationController.navigationBar setBackgroundImage:self.navBarBackgroundImage forBarMetrics:UIBarMetricsDefault];
//清除邊框，設(shè)置一張空的圖片
[self.navigationController.navigationBar setShadowImage:[[UIImage alloc]init]];
[self getScrollerView].contentOffset = CGPointMake(0, self.keyScrollView.contentOffset.y - 1);
[self getScrollerView].contentOffset = CGPointMake(0, self.keyScrollView.contentOffset.y + 1);
}
- (void)setInViewWillDisappear{
[[[self.navigationController.navigationBar subviews]objectAtIndex:0] setAlpha:1];
[self.navigationController.navigationBar setBackgroundImage:nil forBarMetrics:UIBarMetricsDefault];
[self.navigationController.navigationBar setShadowImage:nil];
}
整體的思路就是這樣.具體的實現(xiàn)方案各有不同.大家可以參照筆者demo
下面介紹一下,我對外提供的分類接口
HYNavBarHidden分類的常用屬性方法
屬性
-
keyScrollView:當(dāng)控制器中有多個ScrollView時,要指明是監(jiān)聽哪個ScrollView的滾動
/** 需要監(jiān)聽的view */
@property (nonatomic,weak) UIScrollView * keyScrollView; -
導(dǎo)航條中item是否跟著漸隱,分別設(shè)置左邊,中間,右邊三個的BOOL值.默認為NO
/** 設(shè)置導(dǎo)航條上的標(biāo)簽是否需要跟隨滾動變化透明度,默認不會跟隨滾動變化透明度 */ @property (nonatomic,assign) BOOL isLeftAlpha; @property (nonatomic,assign) BOOL isTitleAlpha; @property (nonatomic,assign) BOOL isRightAlpha; scrolOffsetY:偏移大于等于scrolOffsetY時,導(dǎo)航條的alpha為1
@property (nonatomic,assign) CGFloat scrolOffsetY;
方法 (push或者pop控制器時,消除或回復(fù)導(dǎo)航條狀態(tài))
- (void)setInViewWillAppear;/** 恢復(fù)導(dǎo)航條的背景設(shè)置,在控制器的viewWillAppear:方法中調(diào)用*/
- (void)setInViewWillDisappear; /** 清除導(dǎo)航條的背景設(shè)置,在控制器的viewWillDisappear:方法中調(diào)用*/
- (void)scrollControl; /** ScrollView滾動時需要調(diào)用的方法*/
源碼分享：https://github.com/HelloYeah/HYNavBarHidden
覺得不錯的，請獻上你的star
