UITableViewCell 分割線

前言

一直有個誤解荐绝,認(rèn)為設(shè)置UITableViewCell的分割線距離cell左邊的間距比較麻煩低匙,總是隱藏自帶的分割線旷痕,添加一個1像素的View。不過在只需適配iOS8以后努咐,發(fā)現(xiàn)并不是很復(fù)雜苦蒿。就寫個測試的Demo,看看在不同版本系統(tǒng)的效果渗稍。

主要的測試代碼

TestTableViewController.m

@implementation TestTableViewController
- (void)viewDidLoad {
    [super viewDidLoad];
    
    NSLog(@"systemVersion = %@",[UIDevice currentDevice].systemVersion);
    
    self.tableView.separatorInset = UIEdgeInsetsZero;
}
@end

ATableViewCell.m

@implementation ATableViewCell
- (void)awakeFromNib {
    [super awakeFromNib];
    // Initialization code
    
    self.separatorInset = UIEdgeInsetsMake(0, 20, 0, 0);
}
- (void)layoutSubviews{

    [super layoutSubviews];
    NSLog(@"ATableViewCell separatorInset = %@",NSStringFromUIEdgeInsets(self.separatorInset));
}
@end

BTableViewCell.m

@implementation BTableViewCell

- (void)awakeFromNib {
    [super awakeFromNib];
    // Initialization code
    
}

- (void)layoutSubviews{
    
    [super layoutSubviews];
    NSLog(@"BTableViewCell separatorInset = %@",NSStringFromUIEdgeInsets(self.separatorInset));
}
@end    

不同版本下的效果

iOS 10

運行后的Log及效果

systemVersion = 10.3.1
ATableViewCell separatorInset = {0, 20, 0, 0}
BTableViewCell separatorInset = {0, 0, 0, 0}
iOS 10

很顯然佩迟,是預(yù)期的效果。

iOS 9

運行后的Log及效果

systemVersion = 9.0
ATableViewCell separatorInset = {0, 20, 0, 0}
BTableViewCell separatorInset = {0, 8, 0, 0}
iOS 9

從Log 和運行的效果圖都可以看出竿屹,ATableViewCell的分割左邊有8個像素的間距报强,并沒有達到我們想設(shè)置為0的效果。

iOS 8

systemVersion = 8.1
ATableViewCell separatorInset = {0, 20, 0, 0}
BTableViewCell separatorInset = {0, 8, 0, 0}
iOS 8

和iOS9一樣拱燃,ATableViewCell的分割左邊有8個像素的間距秉溉,并沒有達到我們想設(shè)置為0的效果。

問題所在

layoutMargins

在iOS8 UIView增加了layoutMargins屬性

@property (nonatomic) UIEdgeInsets layoutMargins NS_AVAILABLE_IOS(8_0);

官方文檔解釋為

Use this property to specify the desired amount of space (measured in points) between the edge of the view and any subviews. Auto layout uses your margins as a cue for placing content. For example, if you specify a set of horizontal constraints using the format string “|-[subview]-|”, the left and right edges of the subview are inset from the edge of the superview by the corresponding layout margins. When the edge of your view is close to the edge of the superview and the preservesSuperviewLayoutMargins property is YES, the actual layout margins may be increased to prevent content from overlapping the superview’s margins.

The default margins are eight points on each side.

If the view is a view controller’s root view, the system sets and manages the margins. The top and bottom margins are set to zero points. The side margins vary depending on the current size class, but can be either 16 or 20 points. You cannot change these margins.

附上谷歌翻譯

使用此屬性指定視圖邊緣和任何子視圖之間所需的空間量(以點為單位)碗誉。 自動布局使用您的邊距作為放置內(nèi)容的提示召嘶。 例如,如果使用格式字符串“| - [subview] - |”指定一組水平約束哮缺,則子視圖的左邊緣和右邊緣將從超級視圖的邊緣插入相應(yīng)的布局邊距弄跌。 當(dāng)您的視圖的邊緣靠近超級視圖的邊緣并且preservesuperviewLayoutMargins屬性為YES時,可能會增加實際的布局邊距尝苇,以防止內(nèi)容與超級視圖的邊距重疊铛只。

默認(rèn)邊距是每邊八點。

如果視圖是視圖控制器的根視圖糠溜,系統(tǒng)將設(shè)置和管理邊距淳玩。 頂部和底部邊距設(shè)置為零點。 側(cè)邊距根據(jù)當(dāng)前大小類別而變化非竿,但可以是16或20點蜕着。 您不能更改這些邊距。

大致的意思就是在布局子控件時红柱,子控件的frame會依據(jù)此屬性增加相應(yīng)的間距承匣。在Storyboardxib中,對應(yīng)的就是在添加約束時豹芯,一般都會取消勾選的屬性

storyborad.png

所以悄雅,在BTableViewCell中添加如下代碼就可以實現(xiàn)在iOS 8和iOS 9分割線左邊的間距為0

- (void)awakeFromNib {
    [super awakeFromNib];
    // Initialization code
    self.layoutMargins = UIEdgeInsetsZero;
}

添加后的Log及效果

systemVersion = 9.0
ATableViewCell separatorInset = {0, 20, 0, 0}
BTableViewCell separatorInset = {0, 0, 0, 0}
9.0_after.png

preservesSuperviewLayoutMargins

同樣是iOS 8增加的屬性

// default is NO - set to enable pass-through or cascading behavior of margins from this view’s parent to its children
@property (nonatomic) BOOL preservesSuperviewLayoutMargins NS_AVAILABLE_IOS(8_0); 

官方文檔的解釋為

When the value of this property is YES, the superview’s margins are also considered when laying out content. This margin affects layouts where the distance between the edge of a view and its superview is smaller than the corresponding margin. For example, you might have a content view whose frame precisely matches the bounds of its superview. When any of the superview’s margins is inside the area represented by the content view and its own margins, UIKit adjusts the content view’s layout to respect the superview’s margins. The amount of the adjustment is the smallest amount needed to ensure that content is also inside the superview’s margins.

The default value of this property is NO.

大致理解為,若設(shè)置該屬性為YES铁蹈,相當(dāng)與寫了這句代碼self.layoutMargins = super.layoutMargins

所以在修改BTableViewCell的代碼為如下后

- (void)awakeFromNib {
    [super awakeFromNib];
    // Initialization code
    self.preservesSuperviewLayoutMargins = YES;
    self.layoutMargins = UIEdgeInsetsZero;
}
- (void)layoutSubviews{
    [super layoutSubviews];
    NSLog(@"BTableViewCell layoutMargins = %@",NSStringFromUIEdgeInsets(self.layoutMargins));
    NSLog(@"BTableViewCell separatorInset = %@",NSStringFromUIEdgeInsets(self.separatorInset));
}

得到的Log和效果

systemVersion = 8.1
ATableViewCell separatorInset = {0, 20, 0, 0}
BTableViewCell layoutMargins = {0, 16, 0, 16}
BTableViewCell separatorInset = {0, 16, 0, 0}
preservesSuperViewLayoutMargins.png

和預(yù)期的一樣宽闲,BTableViewCelllayoutMargins并不為0众眨,而是父視圖的{0, 16, 0, 16}

layoutMargins的文檔中也提到

If the view is a view controller’s root view, the system sets and manages the margins. The top and bottom margins are set to zero points. The side margins vary depending on the current size class, but can be either 16 or 20 points. You cannot change these margins.

BTalbeViewCell的父控件時tableViewtableViewTestTableViewControllerroot view容诬,所以tableView的左右layoutMargin都為16

總結(jié)

  • 設(shè)置self.tableView.separatorInset = UIEdgeInsetsZero;可調(diào)整tableView中所有的cellseparatorInset
  • cell設(shè)置了separatorInset則會依據(jù)cellseparatorInset來調(diào)整
  • 在iOS 9 和iOS 8 中需要設(shè)置self.layoutMargins = UIEdgeInsetsZero娩梨,才能達到邊距為0的效果

以上是本人測試后所得出的結(jié)論,并且是第一次寫博客览徒,不對之處還請多多包涵狈定、指正。

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末习蓬,一起剝皮案震驚了整個濱河市纽什,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌躲叼,老刑警劉巖芦缰,帶你破解...
    沈念sama閱讀 221,576評論 6 515
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場離奇詭異枫慷,居然都是意外死亡让蕾,警方通過查閱死者的電腦和手機,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 94,515評論 3 399
  • 文/潘曉璐 我一進店門或听,熙熙樓的掌柜王于貴愁眉苦臉地迎上來探孝,“玉大人,你說我怎么就攤上這事誉裆《俾” “怎么了?”我有些...
    開封第一講書人閱讀 168,017評論 0 360
  • 文/不壞的土叔 我叫張陵找御,是天一觀的道長元镀。 經(jīng)常有香客問我绍填,道長霎桅,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 59,626評論 1 296
  • 正文 為了忘掉前任讨永,我火速辦了婚禮滔驶,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘卿闹。我一直安慰自己揭糕,他們只是感情好,可當(dāng)我...
    茶點故事閱讀 68,625評論 6 397
  • 文/花漫 我一把揭開白布锻霎。 她就那樣靜靜地躺著著角,像睡著了一般。 火紅的嫁衣襯著肌膚如雪旋恼。 梳的紋絲不亂的頭發(fā)上吏口,一...
    開封第一講書人閱讀 52,255評論 1 308
  • 那天,我揣著相機與錄音,去河邊找鬼产徊。 笑死昂勒,一個胖子當(dāng)著我的面吹牛,可吹牛的內(nèi)容都是我干的舟铜。 我是一名探鬼主播戈盈,決...
    沈念sama閱讀 40,825評論 3 421
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼谆刨!你這毒婦竟也來了塘娶?” 一聲冷哼從身側(cè)響起,我...
    開封第一講書人閱讀 39,729評論 0 276
  • 序言:老撾萬榮一對情侶失蹤痊夭,失蹤者是張志新(化名)和其女友劉穎血柳,沒想到半個月后,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體生兆,經(jīng)...
    沈念sama閱讀 46,271評論 1 320
  • 正文 獨居荒郊野嶺守林人離奇死亡难捌,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 38,363評論 3 340
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發(fā)現(xiàn)自己被綠了鸦难。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片根吁。...
    茶點故事閱讀 40,498評論 1 352
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖合蔽,靈堂內(nèi)的尸體忽然破棺而出击敌,到底是詐尸還是另有隱情,我是刑警寧澤拴事,帶...
    沈念sama閱讀 36,183評論 5 350
  • 正文 年R本政府宣布沃斤,位于F島的核電站,受9級特大地震影響刃宵,放射性物質(zhì)發(fā)生泄漏衡瓶。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點故事閱讀 41,867評論 3 333
  • 文/蒙蒙 一牲证、第九天 我趴在偏房一處隱蔽的房頂上張望哮针。 院中可真熱鬧,春花似錦坦袍、人聲如沸十厢。這莊子的主人今日做“春日...
    開封第一講書人閱讀 32,338評論 0 24
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽蛮放。三九已至,卻和暖如春奠宜,著一層夾襖步出監(jiān)牢的瞬間包颁,已是汗流浹背缝其。 一陣腳步聲響...
    開封第一講書人閱讀 33,458評論 1 272
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留徘六,地道東北人内边。 一個月前我還...
    沈念sama閱讀 48,906評論 3 376
  • 正文 我出身青樓待锈,卻偏偏與公主長得像漠其,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子竿音,可洞房花燭夜當(dāng)晚...
    茶點故事閱讀 45,507評論 2 359

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