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

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

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

可以發(fā)現(xiàn)界面的上bar覆蓋的紅色能模糊看到惶楼,是半透明效果。但是我們還是可以正痴锔耍看到第一個(gè)(上下滑動(dòng))歼捐,不會(huì)被半透明遮擋。

這是因?yàn)閷?duì)于滾動(dòng)視圖的特殊性:

對(duì)于滾動(dòng)視圖晨汹,系統(tǒng)默認(rèn)viewControllerautomaticallyAdjustsScrollViewInsets

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

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

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

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

我們就會(huì)看到下面的效果圖:


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

但是對(duì)于非滾動(dòng)視圖是沒有這種特殊性的

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

self.automaticallyAdjustsScrollViewInsets = YES;?


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

那么現(xiàn)在問題來了:對(duì)于非滾動(dòng)視圖衣式,我想讓它從(0,0)布局檐什,但是又正常顯示碴卧,不會(huì)被遮擋該怎么做呢?

首先乃正,這個(gè)需要分兩種效果:是否需要半透明的效果

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

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

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

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

則我們會(huì)看到下面的效果:

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


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

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

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

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

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)一個(gè)控制器要往父控制器添加的時(shí)候,上下左右填充滿整個(gè)屏幕有滑。

例如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,所以該屬性不會(huì)占據(jù)空間睛榄。

*/

例如2:

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

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

self.edgesForExtendedLayout = UIRectEdgeNone;

TabBar的y值 == CGRectGetMaxY(UITableViewController)

二 :

self.extendedLayoutIncludesOpaqueBars = YES;

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

sectionHeaderHeight 高度不一樣

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

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

_tableview.sectionFooterHeight = 0;

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末场靴,一起剝皮案震驚了整個(gè)濱河市啡莉,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌旨剥,老刑警劉巖咧欣,帶你破解...
    沈念sama閱讀 222,183評(píng)論 6 516
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場(chǎng)離奇詭異轨帜,居然都是意外死亡魄咕,警方通過查閱死者的電腦和手機(jī),發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 94,850評(píng)論 3 399
  • 文/潘曉璐 我一進(jìn)店門蚌父,熙熙樓的掌柜王于貴愁眉苦臉地迎上來哮兰,“玉大人,你說我怎么就攤上這事苟弛『戎停” “怎么了?”我有些...
    開封第一講書人閱讀 168,766評(píng)論 0 361
  • 文/不壞的土叔 我叫張陵膏秫,是天一觀的道長(zhǎng)右遭。 經(jīng)常有香客問我,道長(zhǎng)缤削,這世上最難降的妖魔是什么窘哈? 我笑而不...
    開封第一講書人閱讀 59,854評(píng)論 1 299
  • 正文 為了忘掉前任,我火速辦了婚禮亭敢,結(jié)果婚禮上滚婉,老公的妹妹穿的比我還像新娘。我一直安慰自己吨拗,他們只是感情好满哪,可當(dāng)我...
    茶點(diǎn)故事閱讀 68,871評(píng)論 6 398
  • 文/花漫 我一把揭開白布婿斥。 她就那樣靜靜地躺著,像睡著了一般哨鸭。 火紅的嫁衣襯著肌膚如雪民宿。 梳的紋絲不亂的頭發(fā)上,一...
    開封第一講書人閱讀 52,457評(píng)論 1 311
  • 那天像鸡,我揣著相機(jī)與錄音活鹰,去河邊找鬼。 笑死只估,一個(gè)胖子當(dāng)著我的面吹牛志群,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播蛔钙,決...
    沈念sama閱讀 40,999評(píng)論 3 422
  • 文/蒼蘭香墨 我猛地睜開眼锌云,長(zhǎng)吁一口氣:“原來是場(chǎng)噩夢(mèng)啊……” “哼!你這毒婦竟也來了吁脱?” 一聲冷哼從身側(cè)響起桑涎,我...
    開封第一講書人閱讀 39,914評(píng)論 0 277
  • 序言:老撾萬(wàn)榮一對(duì)情侶失蹤,失蹤者是張志新(化名)和其女友劉穎兼贡,沒想到半個(gè)月后攻冷,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 46,465評(píng)論 1 319
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡遍希,尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 38,543評(píng)論 3 342
  • 正文 我和宋清朗相戀三年等曼,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片凿蒜。...
    茶點(diǎn)故事閱讀 40,675評(píng)論 1 353
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡禁谦,死狀恐怖,靈堂內(nèi)的尸體忽然破棺而出篙程,到底是詐尸還是另有隱情枷畏,我是刑警寧澤别厘,帶...
    沈念sama閱讀 36,354評(píng)論 5 351
  • 正文 年R本政府宣布虱饿,位于F島的核電站,受9級(jí)特大地震影響触趴,放射性物質(zhì)發(fā)生泄漏氮发。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 42,029評(píng)論 3 335
  • 文/蒙蒙 一冗懦、第九天 我趴在偏房一處隱蔽的房頂上張望爽冕。 院中可真熱鬧,春花似錦披蕉、人聲如沸颈畸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 32,514評(píng)論 0 25
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽(yáng)眯娱。三九已至礁苗,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間徙缴,已是汗流浹背试伙。 一陣腳步聲響...
    開封第一講書人閱讀 33,616評(píng)論 1 274
  • 我被黑心中介騙來泰國(guó)打工, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留于样,地道東北人疏叨。 一個(gè)月前我還...
    沈念sama閱讀 49,091評(píng)論 3 378
  • 正文 我出身青樓,卻偏偏與公主長(zhǎng)得像穿剖,于是被迫代替她去往敵國(guó)和親蚤蔓。 傳聞我的和親對(duì)象是個(gè)殘疾皇子,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 45,685評(píng)論 2 360

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

  • 總所周知糊余,蘋果從iOS7開始采用扁平化的界面風(fēng)格昌粤,顛覆了果粉們“迷戀”的擬物化風(fēng)格。對(duì)于開發(fā)者而言啄刹,全新的風(fēng)格帶來...
    聰明的笨白閱讀 3,482評(píng)論 8 40
  • 先聲明:以下總結(jié)只對(duì)ios7及ios7之后才有效~~~ 之前開發(fā)過程中偶爾會(huì)遇到設(shè)置導(dǎo)航欄透明與否或者運(yùn)行系統(tǒng)版本...
    Qiu_W閱讀 1,321評(píng)論 0 1
  • 最近項(xiàng)目里有個(gè)需求和導(dǎo)航欄的樣式定制有關(guān)誓军,深入之后發(fā)現(xiàn)之前理解的一些概念有些模糊袱讹,剛好趁著這次機(jī)會(huì)全面整理了一下。...
    Kevin追夢(mèng)先生閱讀 503評(píng)論 0 0
  • 最近項(xiàng)目里有個(gè)需求和導(dǎo)航欄的樣式定制有關(guān)昵时,深入之后發(fā)現(xiàn)之前理解的一些概念有些模糊捷雕,剛好趁著這次機(jī)會(huì)全面整理了一下。...
    hi_xgb閱讀 5,085評(píng)論 4 39
  • 文 | 小迷圖 | cami 這幾天壹甥,我身邊幾個(gè)朋友喜報(bào)頻傳救巷,扎推升級(jí)成了新手奶爸寶媽。 作為一個(gè)單身少女句柠,自問自...
    東三環(huán)的財(cái)小迷閱讀 255評(píng)論 0 1