前言
前面兩個(gè)章節(jié)給大家詳細(xì)介紹了Content Hugging Priority(抗拉伸優(yōu)先級)和Content Compression Resistance Priority(抗壓縮優(yōu)先級),
本文將綜合運(yùn)用這兩個(gè)屬性,來處理一個(gè)項(xiàng)目中的實(shí)際需求.
一. 要點(diǎn)回顧:
1.Content Hugging Priority
視圖抗拉伸優(yōu)先級,
值越小,視圖越容易被拉伸,
2. Content Compression Resistance Priority:
視圖抗壓縮優(yōu)先級,
值越小,視圖越容易被壓縮,
二.實(shí)際運(yùn)用
我先來看下下面這個(gè)效果,在不計(jì)算文字寬度和不修改約束的前提下,怎么通過設(shè)置Content Hugging Priority和Content Compression Resistance Priority屬性來實(shí)現(xiàn):
效果描述:
- 這個(gè)是社區(qū)評論頁面里,用戶信息的一部分
- 最左邊是:用戶圖像
- 黃色Label:用戶昵稱(昵稱長度不確定)
- 藍(lán)色Label:評論發(fā)表時(shí)間(時(shí)間長度不確定)
兩點(diǎn)要求:
- 1.黃色abel(顯示昵稱),其寬度由用戶昵稱長度決定,
藍(lán)色label(顯示時(shí)間),其寬度由時(shí)間長度決定, - 2.當(dāng)用戶昵稱長度變長時(shí),藍(lán)色label自動右移,移到屏幕邊緣時(shí),用戶昵稱繼續(xù)增加,昵稱將縮略顯示
3.當(dāng)用戶昵稱變短時(shí),藍(lán)色label自動左移.
三.代碼示例
新建工程,在頁面添加一個(gè)view,并添加約束固定位置和大小,
在這個(gè)view上添加三個(gè)視圖,分別為:
1.imageView,用來顯示用戶圖像
2.黃色label,用來顯示用戶昵稱
3.藍(lán)色label,用來顯示時(shí)間
并添加如下約束:
imageView:上0,左0,下0,長寬比1:1
黃色label:上0,左0,下0,
藍(lán)色label:上0,左0,下0,右0
黃色label和藍(lán)色label都不添加寬度約束,其寬度有文字長度決定
添加完約束后,會報(bào)下面錯(cuò)誤:
此錯(cuò)誤的意思是:
- 黃色label,和藍(lán)色label都是動態(tài)寬度(沒添加寬度約束),
- 當(dāng)二者寬度之和,大于右側(cè)區(qū)域總寬度時(shí),AutoLayout不知道先壓縮哪個(gè)label,
- 當(dāng)二者寬度之和,小于右側(cè)區(qū)域總寬度時(shí),AutoLayout不知道先拉伸哪個(gè)label,
- 讓我們?yōu)槎咛砑覥ontent Hugging Priority和Content Compression Resistance Priority約束,
下面來添加這兩個(gè)約束:
- 1.很顯然,當(dāng)用戶昵稱過長時(shí),我們希望過長的部分省略顯示(即昵稱過長時(shí),黃色label優(yōu)先被壓縮,其橫向抗壓縮優(yōu)先級要低)
- 2.當(dāng)用戶昵稱太短時(shí),我們希望藍(lán)色label向左側(cè)靠過來.(即昵稱太短時(shí),藍(lán)色label向左靠,要被拉長,其橫向抗拉伸優(yōu)先級要低)
下面我們來為黃色label的Content Compression Resistance Priority(抗壓縮優(yōu)先級)橫向優(yōu)先級為749,如下:
修改藍(lán)色label的Content Hugging Priority(抗拉伸優(yōu)先級)橫向優(yōu)先級為250,如下:
添加完畢后,我們右鍵拖線兩個(gè)label生成變量,
并起一個(gè)定時(shí)器,
依次設(shè)置黃色label文字為:
長昵稱這是一個(gè)很長的昵稱
長昵稱這是一個(gè)很長的昵
長昵稱這是一個(gè)很長的
長昵稱這是一個(gè)很長
長昵稱這是一個(gè)很
長昵稱這是一個(gè)
長昵稱這是一
長昵稱這是
長昵稱這
長昵稱
長昵稱這
長昵稱這是
長昵稱這是一
長昵稱這是一個(gè)
長昵稱這是一個(gè)很
長昵稱這是一個(gè)很長
長昵稱這是一個(gè)很長的
長昵稱這是一個(gè)很長的昵
長昵稱這是一個(gè)很長的昵稱
不需要計(jì)算文字寬度,不需要修改約束,就達(dá)到上圖效果.
代碼如下:
#import "ViewController.h"
static NSString *const NameText = @"長昵稱這是一個(gè)很長的昵稱";
static NSInteger changeLength = -1;//記錄單次變化長度
@interface ViewController ()
@property (weak, nonatomic) IBOutlet UILabel *nameLab;
@property (weak, nonatomic) IBOutlet UILabel *timeLab;
@end
@implementation ViewController
- (void)viewDidLoad {
[super viewDidLoad];
_nameLab.text = NameText;//初始值
_timeLab.text = @"一周以前";//初始值
[NSTimer scheduledTimerWithTimeInterval:0.1 target:self selector:@selector(action) userInfo:nil repeats:YES];
}
-(void)action{
/** 當(dāng)前昵稱 */
NSString *name = [NameText substringToIndex:_nameLab.text.length+changeLength];
NSLog(@"當(dāng)前昵稱:\n%@",name);
_nameLab.text = name;//設(shè)置昵稱
if(_nameLab.text.length<=3){//最小寬度
changeLength = 1;//加長
}else if(_nameLab.text.length==NameText.length){//最大寬度
changeLength = -1;//減短
}
}
- (void)didReceiveMemoryWarning {
[super didReceiveMemoryWarning];
// Dispose of any resources that can be recreated.
}
@end
三.小結(jié):
Content Hugging Priority 視圖抗拉伸優(yōu)先級
值越小,越先被拉伸
Content Compression Resistance 抗壓縮優(yōu)先級
值越小,越先被壓縮,
這兩個(gè)屬性,在UITableViewCell 自動高度上有著廣泛運(yùn)用,下一章節(jié)將重點(diǎn)來講,復(fù)雜TableViewCell,在不計(jì)算子文字高度情況下,不用第三方TableViewCell自動計(jì)算高度框架情況下,怎么實(shí)現(xiàn)自動高度.
代碼地址:https://github.com/CoderZhuXH/AutoLayout
相關(guān)閱讀
iOS AutoLayout進(jìn)階(一)Aspect Ratio
iOS AutoLayout進(jìn)階(二)Content Hugging Priority
iOS AutoLayout進(jìn)階(三)Content Compression Resistance Priority
iOS AutoLayout進(jìn)階(五)UITableViewCell自動高度
