32.TableView最合適的布局

影響TableView布局的問題主要是由其父類UIScrollView引起的。

影響UIScrollView布局的因素:

第一類: NavigationBar.translucent,VC.edgesForExtendedLayout,VC.extendLayoutIncludesOpaqueBars
第二類: ScrollView.contentInsetVC.automaticallyAdjustsScrollViewInsets,navigationBar/StatusBar的隱藏,NavigationBar/TabBar的有無TabBar隱藏的方式,第一個addSubview的是不是當(dāng)前的ScrollView。

Translucent

self.navigationController.navigationBar.translucent = NO; 時,self.view.frame的值為0.00_64.00_375.00_603.00 (iPhone 6為例)

默認(rèn)屬性下,向上滑動TableViewheader是可以透過NavigationBar的,修改translucent屬性為NO后,正是因為VCView布局不在NavigationBar底下了,所以這時看不到header的。

edgesForExtendLayout

枚舉值如下:

typedef NS_OPTIONS(NSUInteger, UIRectEdge) {
    UIRectEdgeNone   = 0,
    UIRectEdgeTop    = 1 << 0,
    UIRectEdgeLeft   = 1 << 1,
    UIRectEdgeBottom = 1 << 2,
    UIRectEdgeRight  = 1 << 3,
    UIRectEdgeAll    = UIRectEdgeTop | UIRectEdgeLeft | UIRectEdgeBottom | UIRectEdgeRight
} NS_ENUM_AVAILABLE_IOS(7_0);

既有TabBar又有NavigationBar的,默認(rèn)值UIRectEdgeAll下,當(dāng)前控制器就做了上面和下面的延展布局。

self.view.frame 的值為0.00_ 0.00_375.00_667.00

當(dāng)將此屬性改變?yōu)?code>UIRectEdgeNone時,上面和下面的延展全部禁止。self.view.frame的值為0.00_64.00_375.00_554.00,說明view從導(dǎo)航欄開始布局,而且高度為667-49(TabBar高度)-64(NavigationBar高度 )

這里footer顯示不全的原因就是VCview的高度比TableView的高度小。

extendedLayoutIncludesOpaqueBars

在導(dǎo)航欄不透明時,extendedLayoutIncludesOpaqueBars又為默認(rèn)值NO的情況下。self.view.frame的值為0.00_64.00_375.00_603.00

當(dāng)我們將此屬性改為YES

self.extendedLayoutIncludesOpaqueBars = YES;

此時,self.view.frame的值為0.00_0.00_375.00_667.00

ScrollView.contentInset

關(guān)于ScrollView的這個屬性,初始值為0,所有對contentInset值的自動調(diào)整都是在viewWillAppear和viewDidAppear之間進(jìn)行調(diào)整。默認(rèn)條件下,viewWillAppear中打印ContentInset--64.00_0.00_49.00_0.00

特別注意:

正常情況下想想要設(shè)置contentInset的值需要在viewDidLoad中進(jìn)行,需要注意的是,設(shè)置contentInset值并不是覆蓋了原值,而是與原值進(jìn)行了各項相加的處理。

比如,我在創(chuàng)建tableView的時候,添加這樣一行代碼:

tableView.contentInset = UIEdgeInsetsMake(-64,0,0,0);

默認(rèn)值top應(yīng)該是64,設(shè)置新值后并沒有覆蓋,而應(yīng)該是 -64 + 64 = 0;

這時,打印的結(jié)果為:viewWillAppear中打印ContentInset64.00_0.00_49.00_0.00,viewDidAppear中打印ContentInset0.00_0.00_49.00_0.00

automaticallyAdjustsScrollViewInsets

這個屬性為當(dāng)前控制器是否要自動調(diào)整contentInset,默認(rèn)為YES。
默認(rèn)條件下,viewWillAppear中打印ContentInset0.00_0.00_0.00_0.00,viewDidAppear中打印ContentInset64.00_0.00_49.00_0.00

當(dāng)修改其值為NO后,
self.automaticallyAdjustsScrollViewInsets = NO;

修改后控制器不會根據(jù)系統(tǒng)的默認(rèn)值自動調(diào)整ContentInset了,所以在viewWillAppear中打印ContentInset0.00_0.00_0.00_0.00,viewDidAppear中打印ContentInset0.00_0.00_0.00_0.00

NavigationBar / TabBar的有無

就如上面說過,NavigationBarTabBar的存在才是以上那些影響因素的前提。如果沒有它們這些屬性是無效果的,只有它們的存在才能通過這些屬性影響ScrollView的布局。

NavigationBar / StatusBar 的隱藏

NavigationBar隱藏后,在默認(rèn)自動調(diào)整ContentInset的情況下,其top的值為20。所以,想要做透明導(dǎo)航欄又不隱藏狀態(tài)欄的需求,需要注意下這里。當(dāng)然是用上面的設(shè)置ScrollView.contentInset的方法可以解決此問題。

TabBar的隱藏

一般的App在每個Tab首頁的VC才會展示出TabBar,而在第二層頁面開始就要隱藏TabBar了。但是TabBar不同的隱藏方式,會產(chǎn)生某些影響,從而影響ScrollView.contentInset.

使用系統(tǒng)的TabBar,通過hidesBottomBarWhenPushed方法進(jìn)行隱藏TabBarTabBar.hidden兩種方式來隱藏,會產(chǎn)生影響,從而影響ScrollView.contentInset.

使用系統(tǒng)的TabBar,通過hidesBottomBarWhenPushed方法進(jìn)行隱藏TabBartabBar.hidden兩種方式來對比。

hidesBottomBarWhenPushed

此方法下,viewWillAppear中打印ContentInset0.00_0.00_0.00_0.00viewDidAppear中打印ContentInset64.00_0.00_0.00_0.00

TabBar.hidden

此方法下,viewWillAppear中打印ContentInset0.00_0.00_0.00_0.00,viewDidAppear中打印ContentInset64.00_0.00_49.00_0.00

兩種方法的區(qū)別在于,執(zhí)行TabBar隱藏的時機(jī)不同,hidesBottomBarWhenPushed方法在viewDidLoad之前執(zhí)行,而TabBar.hidden是在viewWillAppear中執(zhí)行的。正是因為此,造成ScrollView.contentInset的不同,因為hidesBottomBarWhenPushed方法在布局配置前就隱藏了TabBar了,所以不會有內(nèi)嵌的影響了。

第一個addSubview的是不是當(dāng)前的ScrollView

當(dāng)前控制器,self.view上第一個addSubview的如果是ScrollView,則以上的所有因素才可以影響其布局。如果不是第一個添加的,則以上所有的屬性影響失效。
而且還有一個布局方面的問題,在默認(rèn)情況下只要是第一個添加的ScrollView,無論ScrollViewframe為多少,它的ContentInset是會一直存在的。

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

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

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