本篇博客的內(nèi)容也不算太復(fù)雜蝴猪，算是AutoLayout的一些高級(jí)的用法肾请。本篇博客我們主要通過(guò)一些示例來(lái)看一下AutoLayout中的Content Hugging Priority以及Content Compression Resistance Priority這兩個(gè)優(yōu)先級(jí)窄潭。下方我們先來(lái)簡(jiǎn)單的看一下這兩個(gè)優(yōu)先級(jí)的涵義：
Content Hugging Priority：直譯成中文就是“內(nèi)容擁抱優(yōu)先級(jí)”帆卓，從字面意思上來(lái)看就是兩個(gè)視圖痢毒，誰(shuí)的“內(nèi)容擁抱優(yōu)先級(jí)”高，誰(shuí)就優(yōu)先環(huán)繞其內(nèi)容向挖。稍后我們會(huì)根據(jù)一些示例進(jìn)行介紹蝌以。
Content Compression Resistance Priority：該優(yōu)先級(jí)直譯成中文就是“內(nèi)容壓縮阻力優(yōu)先級(jí)”。也就是視圖的“內(nèi)容壓縮阻力優(yōu)先級(jí)”越大何之，那么該視圖中的內(nèi)容越難被壓縮跟畅。而該優(yōu)先級(jí)小的視圖，則內(nèi)容優(yōu)先被壓縮帝美。稍后我們也會(huì)通過(guò)相應(yīng)的實(shí)例來(lái)看一下這個(gè)優(yōu)先級(jí)的具體表現(xiàn)碍彭。
接下來(lái)我們就通過(guò)相應(yīng)的實(shí)例來(lái)看一下這兩個(gè)優(yōu)先級(jí)的使用場(chǎng)景以及作用晤硕。
一悼潭、總述
首先在第一部分我們先來(lái)整體的看一下Content Hugging Priority與Content Compression Resistance Priority這兩個(gè)AutoLayout的優(yōu)先級(jí)屬性。這兩個(gè)屬性是可以在Storyboard中直接設(shè)置的舞箍，選中要設(shè)置的控件舰褪，在右邊約束一欄里邊就有Content Hugging Priority以及Content Compression Resistance Priority的設(shè)置地方。Content Hugging Priority的水平和豎直方向的默認(rèn)值都是250疏橄，而Content Compression Resistance Priority的水平和豎直的默認(rèn)值是750占拍。我們可以在此對(duì)該值進(jìn)行設(shè)置。
當(dāng)然捎迫，在代碼中也是可以設(shè)置這兩個(gè)代碼的優(yōu)先級(jí)的晃酒。下方是使用代碼的方式為我們的控件設(shè)置相應(yīng)的優(yōu)先級(jí)并且我們可以獲取到相應(yīng)優(yōu)先級(jí)的值。具體代碼如下所示：
二窄绒、Content Hugging Priority
接下來(lái)我們就來(lái)結(jié)合實(shí)例來(lái)看一下Content Hugging Priority的使用場(chǎng)景以及使用方式贝次。
假如我們有一個(gè)需求，需要兩個(gè)Label并列顯示彰导，我們暫且稱(chēng)之為Label1和Label2蛔翅。Label1和Label2中的顯示內(nèi)容是從網(wǎng)絡(luò)獲取的，并且內(nèi)容長(zhǎng)度不定位谋。我們要求優(yōu)先顯示Label1山析。也就是說(shuō)以Label1的寬度為準(zhǔn)，不過(guò)Label1會(huì)有一個(gè)最大寬度掏父，當(dāng)Label1顯示到最大寬度時(shí)笋轨，Label1的內(nèi)容會(huì)被壓縮，剩下的部分顯示Label2。當(dāng)然爵政，當(dāng)Label1沒(méi)有顯示到最大值時(shí)鸟款，剩下的部分仍然顯示Label2。Label2顯示不全的也會(huì)被壓縮茂卦。
接下來(lái)我們按照上述的描述添加相應(yīng)的約束何什，首先我們?yōu)長(zhǎng)abel1添加約束，如下所示等龙。我們?yōu)長(zhǎng)abel1添加了Top处渣、Left、Width和Height四個(gè)約束蛛砰，這四個(gè)約束足以來(lái)確定該Label的位置了罐栈。不過(guò)需要注意的一點(diǎn)該Label的Width是小于等于某一個(gè)值得，此處我們指定的Width <= 200泥畅。也就是該Label的Width的最大值為200荠诬。約束添加后如下所示：
接下來(lái)我們來(lái)為并列第二個(gè)Label添加約束。因?yàn)橐笄懊鍸abel內(nèi)容顯示完成后位仁，剩下的部分就顯示右邊Label的內(nèi)容柑贞，所以我們?yōu)長(zhǎng)abel2添加了Left、Top聂抢、Right以及Height的約束钧嘶。當(dāng)然Left是以右邊的Label為基準(zhǔn)的，而Right則是以父視圖為基準(zhǔn)的琳疏。
從下方截圖中我們可以看出有决，有些約束添加完是紅色的，這就是約束有沖突了空盼。也就是當(dāng)前添加的約束不能確實(shí)當(dāng)前控件的位置书幕。從上述的約束我們不難發(fā)現(xiàn)，橫向來(lái)看揽趾，兩個(gè)Label的寬度都是不確定的台汇，所以會(huì)報(bào)錯(cuò)。
我們可以點(diǎn)擊下方這個(gè)紅色的報(bào)錯(cuò)箭頭查看相應(yīng)的報(bào)錯(cuò)信息但骨。點(diǎn)擊該紅色箭頭會(huì)顯示下方這個(gè)界面励七，該界面中會(huì)提示相應(yīng)的錯(cuò)誤信息。從下面的對(duì)話框中我們可以看到具體的錯(cuò)誤信息是“Content Priority Ambiguity”奔缠，也就是說(shuō)“內(nèi)容優(yōu)先級(jí)是模棱兩可的”掠抬。點(diǎn)擊這個(gè)紅色的圓圈，會(huì)給出相應(yīng)的解決方案：
Decrease horizontal hugging of "Second Label" from 251 to 250 to make it grow before other views校哎。
意思大體就是說(shuō)：需要減小Second Label的水平擁抱優(yōu)先級(jí)两波，從現(xiàn)在的251換成250瞳步。換句話說(shuō)，也就是將“Second Label”的Content Hugging Priority從251換成250后腰奋，下方的問(wèn)題就會(huì)被解決了单起。“to make it grow before other views”劣坊，這句話的意思是降低這個(gè)優(yōu)先級(jí)目的是為了讓該視圖在其他視圖之前生長(zhǎng)嘀倒。
翻譯的有些晦澀，我們來(lái)用大白話說(shuō)一下局冰。造成下方錯(cuò)誤的原因是水平放置的兩個(gè)Label的寬度都不確定测蘑，而且其內(nèi)容環(huán)抱的優(yōu)先級(jí)又是一致的，所以在運(yùn)行是我們無(wú)法確定是先確定第一個(gè)Label的寬度還是先確定第二個(gè)Label的寬度康二，解決方案是將右邊的Label的Content Hugging Priority的優(yōu)先級(jí)調(diào)低碳胳，當(dāng)然第一個(gè)Label的Content Hugging Priority相對(duì)就高了。所以左邊的Label會(huì)優(yōu)先的環(huán)繞其內(nèi)容沫勿，也就是說(shuō)該Label會(huì)優(yōu)先的確定其寬度挨约。當(dāng)左邊Label的寬度確定了，那么右邊Label的寬度也就是隨著確定了产雹，所以下方的錯(cuò)誤也就解決了诫惭。
下方就是我們將右邊的Label的Content Hugging Priority改成250后的結(jié)果∏⒐剩可以看出之前的報(bào)錯(cuò)被解決了贝攒。當(dāng)然，也可以將左邊的Label的Content Hugging Priority的優(yōu)先級(jí)修改成比右邊的高即可时甚。此處我們僅討論了Content Hugging的水平方向上的優(yōu)先級(jí)，豎直方向上的優(yōu)先級(jí)是一樣的哈踱，在此就不做過(guò)多贅述了荒适。
上面約束添加完以及優(yōu)先級(jí)添加完畢后，我們就可以看一下運(yùn)行效果了开镣。為了動(dòng)態(tài)的看一下約束的效果刀诬，我們?yōu)槊總€(gè)Label添加了一個(gè)Step控件，從下方運(yùn)行效果我們不難看出邪财，該控件主要是用來(lái)控制對(duì)應(yīng)Label的大小的陕壹。下方的運(yùn)行效果是符合我們之前的預(yù)期的。左邊的Label的長(zhǎng)度是有一個(gè)最大值得树埠，當(dāng)左邊的Label顯示完成后糠馆，右邊剩下的空間就顯示第二個(gè)Label的內(nèi)容了。
三怎憋、Content Compression Resistance Priority （內(nèi)容壓縮阻力優(yōu)先級(jí)）
聊完“內(nèi)容擁抱優(yōu)先級(jí)”后又碌，接下來(lái)我們就來(lái)看一下Content Compression Resistance Priority九昧。內(nèi)容壓縮阻力優(yōu)先級(jí)，從字面意思上看毕匀，該優(yōu)先級(jí)越大則說(shuō)明內(nèi)容壓縮阻力越大铸鹰，也就是說(shuō)內(nèi)容越難被壓縮。當(dāng)兩個(gè)Label并排顯示皂岔，并且屏幕不足以顯示兩個(gè)Label的所有內(nèi)容時(shí)蹋笼，則會(huì)優(yōu)先壓縮“內(nèi)容壓縮阻力優(yōu)先級(jí)”越小則先被壓縮。
我們依然采用上一部分的方式躁垛，從錯(cuò)誤入手姓建，在錯(cuò)誤解決的過(guò)程中來(lái)認(rèn)識(shí)一下這個(gè)“Content Compression Resistance Priority”。首先我們也是讓兩個(gè)Label并排顯示缤苫，左邊的Label我們暫且稱(chēng)之為FirstLabel速兔，右邊的Label我們則稱(chēng)之為SecondLabel。我們?yōu)镕irstLabel添加的約束有Top活玲、Left涣狗、Height以及Width >= 50，我們?yōu)镾econdLabel添加的約束為L(zhǎng)eft（以First的Right為參照）舒憾、Top镀钓、Right、Height以及Width>=102镀迂。下方截圖就是我們添加上述約束后的效果：
添加完上述約束后丁溅，我們?cè)赟toryboard中可以看出是會(huì)報(bào)錯(cuò)的。報(bào)錯(cuò)原因也很明確“Content Priority Ambiguity”探遵，也是內(nèi)容優(yōu)先級(jí)沖突窟赏。用大白話解釋就是水平方向上無(wú)法確定兩個(gè)Label的寬度。當(dāng)然點(diǎn)擊紅色小圓點(diǎn)也會(huì)給出相應(yīng)的錯(cuò)誤解決方案：
Decrease horizontal compression resistance of "Bottom Label2" from 750 to 749 to make it get clipped before other views箱季。
其大體意思就是減少第二個(gè)Label的水平壓縮阻力涯穷，將現(xiàn)在的750修改成749，使得SecondLabel在其他視圖之前被裁剪藏雏。此刻如果你點(diǎn)擊該提示中的“Change Priority”按鍵的話拷况，該錯(cuò)誤將會(huì)被修復(fù)。
為了直觀的看一下該優(yōu)先級(jí)的效果掘殴，我們添加了一個(gè)Switch開(kāi)關(guān)來(lái)修改上述兩個(gè)Label的優(yōu)先級(jí)赚瘦。當(dāng)Switch開(kāi)關(guān)打開(kāi)時(shí)，F(xiàn)irstLabel的壓縮阻力優(yōu)先級(jí)大于SecondLabel奏寨，開(kāi)關(guān)關(guān)閉就相反了起意。具體代碼如下所示：
修改完相應(yīng)的錯(cuò)誤，以及添加完相應(yīng)的代碼后服爷，接下來(lái)我們來(lái)看一下運(yùn)行結(jié)果杜恰。當(dāng)開(kāi)關(guān)打開(kāi)時(shí)获诈，前邊的抗壓縮阻力要大于后邊的Label。而開(kāi)關(guān)關(guān)閉時(shí)后邊的抗阻力優(yōu)先級(jí)要大于前邊的心褐，運(yùn)行效果如下所示舔涎。
通過(guò)上述示例的演示，應(yīng)該對(duì)Content Hugging Priority以及Content Compression Resistance Priority有了直觀的感受逗爹，本篇博客就先到這兒吧亡嫌。
