導(dǎo)航欄適配--translucent屬性設(shè)置的問題

iOS7及以上版本有改動,UITabBar類添加了一個translucent屬性,UINavigationBar類中的translucent屬性也默認(rèn)修改為YES。也就是說默認(rèn)使用了這兩個bar之后,顯示的是半透明的效果,能夠模糊看到被bar遮蓋的東西。這會導(dǎo)致一些問題,比如配色的色差以及控件位置起點(diǎn)的問題。

默認(rèn)情況下,我們使用UINavigationController和UITabBarController,而且不修改其中的translucent等屬性,在頁面中添加tableView,設(shè)置tableview距離四面【0,0,0,0】并設(shè)置tableview的背景色為red,則界面顯示如下:

可以發(fā)現(xiàn)界面的上bar覆蓋的紅色能模糊看到,是半透明效果。但是我們還是可以正??吹降谝粋€(上下滑動),不會被半透明遮擋。

這是因?yàn)閷τ跐L動視圖的特殊性:

對于滾動視圖,系統(tǒng)默認(rèn)viewControllerautomaticallyAdjustsScrollViewInsets

屬性為YES,所以默認(rèn)會做下面這件事:

本來我們的cell是放在(0,0)的位置上的,但是考慮到導(dǎo)航欄、狀態(tài)欄會擋住后面的主視圖,而自動把我們的內(nèi)容(cell、滾動視圖里的元素)向下偏移離Top64px(下方位置如果是tarbar向上偏移離Buttom49px、toolbar是44),也就是當(dāng)我們把navigationBar給隱藏掉時(shí),滾動視圖會給我們的內(nèi)容預(yù)留部分的空白Top(所有內(nèi)容向下偏移20px,因?yàn)闋顟B(tài)欄的存在)。

我們修改這一屬性,在viewDidLoad方法中添加以下代碼:

self.automaticallyAdjustsScrollViewInsets = NO;//取消自動滾動調(diào)整,默認(rèn)為YES

我們就會看到下面的效果圖:


也就是說系統(tǒng)沒有再做上面那件事了,所以滾動視圖沒有為里面 的內(nèi)容留下對應(yīng)的空間,所以我們看不到最上面的內(nèi)容了(滾動也會滾回去)。 ?

但是對于非滾動視圖是沒有這種特殊性的

如果我們在tableview上方加一塊青綠色的Button“緊貼著”tableview(也就是設(shè)置四邊【0,0,0,0】),并且我們還是使用的默認(rèn)的這一屬性:

self.automaticallyAdjustsScrollViewInsets = YES;?


也就是說對于非滾動視圖并沒有這樣的特殊性,頂部的內(nèi)容會被bar遮擋掉。但是在半透明(translucent屬性為YES)的前提下,automaticallyAdjustsScrollViewInsets屬性還是為YES的時(shí)候,滾動視圖還是會自動空出64px的位置,也就是我們看到的紅色背景。

那么現(xiàn)在問題來了:對于非滾動視圖,我想讓它從(0,0)布局,但是又正常顯示,不會被遮擋該怎么做呢?

首先,這個需要分兩種效果:是否需要半透明的效果

1,依舊保留半透明效果:也就是說tabBar和navigationBar的translucnet還是默認(rèn)的YES時(shí):

方法1:你可以不從(0,0)開始布局,而是從(0,64)開始布局(同理,底部的tabBar也要留下位置)

方法2:你一定要從(0,0)開始布局,則修改viewController的一個屬性:

self.edgesForExtendedLayout = UIRectEdgeNone;//iOS7及以后的版本支持,self.view.frame.origin.y會下移64像素至navigationBar下方。

則我們會看到下面的效果:

2,不保留半透明效果:也就是將tabBar和navigationBar的translucnet屬性都改為NO,其他不做修改,這種情況,我們看到的效果圖如下:


可以看到,上下的bar已經(jīng)是白色,而不是半透明。底色是白色, 那么在設(shè)置顏色的時(shí)候就不會再有色差了!

但是對于,不保留半透明效果,但是又是從(0,64)開始布局的,我還不知道怎樣處理能正常顯示!

ios7下的app都是全屏的,意思就是所有控制器的view默認(rèn)都是從屏幕的(0,0)開始。

為了達(dá)到全屏效果的app,官方為UIviewController增加了幾個屬性:

1 @property(nonatomic,assign) UIRectEdge edgesForExtendedLayout NS_AVAILABLE_IOS(7_0); // Defaults to UIRectEdgeAll

2 @property(nonatomic,assign) BOOL extendedLayoutIncludesOpaqueBars NS_AVAILABLE_IOS(7_0); // Defaults to NO, but bars are translucent by default on 7_0.

3 @property(nonatomic,assign) BOOL automaticallyAdjustsScrollViewInsets NS_AVAILABLE_IOS(7_0); // Defaults to YES

一:

屬性edgesForExtendedLayout,意思大概是邊緣向四周展開

edgesForExtendedLayout 值是結(jié)構(gòu)體,默認(rèn)值是 UIRectEdgeAll,

也就是說,當(dāng)一個控制器要往父控制器添加的時(shí)候,上下左右填充滿整個屏幕。

例如1:

UIViewController添加到uiNavController上時(shí),uiviewcontroller的y值 == 狀態(tài)欄的的y

這時(shí)候設(shè)置

self.edgesForExtendedLayout = UIRectEdgeNone;

uiviewcontroller的y值 == 導(dǎo)航欄y + 導(dǎo)航欄height

/*

這種情況還可以設(shè)置,導(dǎo)航欄的bar的透明度屬性translucent為no

self.navigationController.navigationBar.translucent = NO;

translucent屬性在ios6之前默認(rèn)為no,

而在ios7下的導(dǎo)航欄默認(rèn)卻是半透明的,為yes,所以該屬性不會占據(jù)空間。

*/

例如2:

UITableViewController添加到UITabBarController上時(shí),UITableViewController的底部一部分cell會被TabBar擋住

這時(shí)候設(shè)置

self.edgesForExtendedLayout = UIRectEdgeNone;

TabBar的y值 == CGRectGetMaxY(UITableViewController)

二 :

self.extendedLayoutIncludesOpaqueBars = YES;

意思展開包括狀態(tài)欄

sectionHeaderHeight 高度不一樣

若要達(dá)到每個group頭部等高效果,

_tableview.sectionHeaderHeight = 10;(頭部的等高我設(shè)置的10)

_tableview.sectionFooterHeight = 0;

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容