天天看點

iOS | 圖檔上的文字自适應

背景

公司産品需要自定義彈窗。而彈窗的背景圖檔是根據螢幕的寬高自動縮放的,如下:

#define ALERTVIEW_HEIGHT ([UIScreen mainScreen].bounds.size.width - 60)*1.05
#define ALERTVIEW_WIDTH  [UIScreen mainScreen].bounds.size.width-60
           

而彈窗上的标題,即‘恭喜’兩個字并不是圖檔,是寫上去的,代碼如下:

UILabel *titleLab = [[UILabel alloc]initWithFrame:CGRectMake(10, 38, self.alertView.frame.size.width - MARGIN, 30)];
           

這裡我給了它距離彈框頂部一個固定的間距,iPhone 6s 模拟器上效果如下:

iOS | 圖檔上的文字自适應

以下是iPhone 11 模拟器下的效果:

iOS | 圖檔上的文字自适應

簡單點說,iPhone11下字型上移了。這個固定的尺寸不随螢幕的寬高呈現比例變化,那我們如何定義它的高度,以便标題在不同螢幕尺寸下都在中間位置呢。

實作動态高度

此時我們引入一個計算動态高度的宏定義:

#define getHeight(h) ((h)*([UIScreen mainScreen].bounds.size.width/414.0f))
           

在iPhone 11上調試一個合适的高度,這裡不再是固定高度,而是使用了剛剛定義的宏動态高度

getHeight(40)

UILabel *titleLab = [[UILabel alloc]initWithFrame:CGRectMake(10, getHeight(40), self.alertView.frame.size.width - MARGIN, 30)];
           

效果如下:

iOS | 圖檔上的文字自适應

然後我們在切換回iPhone 6s 模拟器下:

iOS | 圖檔上的文字自适應

大體一緻了,類似的實作還可以定義寬度和字型:

#define gotWidth(w) ((w)*([UIScreen mainScreen].bounds.size.height/896.0f))
#define fontHeight(f) ((f)*([UIScreen mainScreen].bounds.size.width/414.0f))