你好,歡迎來到IOS教程網

 Ios教程網 >> IOS訊息 >> 關於IOS >> iOS文字大小自適應庫(MBFontAdapter)

iOS文字大小自適應庫(MBFontAdapter)

編輯:關於IOS

背景

什麼是iOS文字大小自適應?單純回答這個問題實在太困難…所以講一個故事,就很好理解了:

某天做UI設計的妹子弱弱地問我:“我們的app可不可以實現文字的字號在iPhone6上和iPhone6Plus上比iPhone4s和iPhone5大一些?如果要實現難度是不是比較大?工作量會不會增加很多?”其實當我聽到這個問題的時候,我整個人都不好了,因為目前主流的app貌似沒有這麼干的。然而,這個時候能回答不可以麼?能回答很難麼?能回答工作量會增加很多麼?能告訴UI主流app都不這麼干麼?顯然不能!!!於是就有了MBFontAdapter。

前提

字號自適應的目的只是為了更滿足UI設計的需要。簡單來說就是為了界面的美觀,所以是有幾點前提的:

  1. 首先當然是UI需要,如果你的UI根本沒有這樣的需求,你就不用關心這個了。(我們的app就有這個需求,因為UI的設計稿是按照iPhone5來設計的,為了保證app在各種屏幕下看起來都比較接近UI的設計,我們的autolayout都是按比例設置的,也就是說在iPhone6Plus這種大屏手機上,界面上的元素會相應放大,這時候如果文字不相應放大的話,界面就會顯得很空)
  2. 如果你的app需要兼容iOS7,按比例做autolayout會引入一個導致app崩潰的問題(當比例不能除盡時,比如1:3這種),所以在兼容iOS7時,比例盡量直接算成小數再填寫到相應的位置。
  3. 如果使用了字號自適應,那麼文字所在的控件需要按照屏幕大小或者文字的大小來適配(如果不知道autolayout怎麼設置可以聯系我)。因為如果文字放大了,而文字所在控件沒有放大,文字就會被擠在控件內,從而影響美觀。
  4. 這種實現只能統一放大,不能為每個控件單獨定制放大的大小。(理論上來說這樣就足夠了,因為設計合理的話統一放大就可以了)

思路分析

storyboard自帶方法

storyboard支持在不同布局方式下(Compact、Regular和Any)下設置不同的字號大小,如下圖:

這裡寫圖片描述

點擊紅框中的+號就可以添加不同布局方式時字號的大小

注:雖然這種方法可以單獨定制每個控件在不同布局方式時字號的大小,但是太麻煩。因為我們UI的需求是每個帶文字的控件都需要這樣設置…你能想象一個一個設置是怎樣的痛苦麼?

我的方法

因為有文字的控件就有那麼幾個:UILabel、UITextField、UIButton和UITextView。所以我可以繼承這幾個控件的類,然後重載它們的一些實現方法即可。用戶在使用的時候只需要將類設置為繼承的類即可。下面就是具體的實現步驟:

第一步

當然是要先知道當前設備iPhone6還是iPhone6Plus(因為根據UI的需求,她設計時字號都是按照iPhone5的屏幕大小來定的,所以在iPhone6上面字號要稍微大一點,然後iPhone6Plus上字號要更大一點)。代碼很簡單

#define IS_IPHONE_6 ([[UIScreen mainScreen] bounds].size.height == 667.0f)
#define IS_IPHONE_6_PLUS ([[UIScreen mainScreen] bounds].size.height == 736.0f)

第二步

然後就是要確定字號應該變大多少(根據後面和UI的溝通,我們把iPhone6上的字號變大了2號,iPhone6Plus上的字號變大了3號)。

// 這裡設置iPhone6放大的字號數(現在是放大2號,也就是iPhone4s和iPhone5上字體為15時,iPhone6上字號為17)
#define IPHONE6_INCREMENT 2

// 這裡設置iPhone6Plus放大的字號數(現在是放大3號,也就是iPhone4s和iPhone5上字體為15時,iPhone6上字號為18)
#define IPHONE6PLUS_INCREMENT 3

第三步

然後就是核心邏輯,我封裝了一個方法,這個方法的作用是傳入一個UIFont對象,然後根據當前設備,將UIFont的字號做相應的調整,然後返回一個新的UIFont對象。代碼如下:

+(UIFont *)adjustFont:(UIFont *)font{
    UIFont *newFont=nil;
    if (IS_IPHONE_6){
        newFont = [UIFont fontWithName:font.fontName size:font.pointSize+IPHONE6_INCREMENT];
    }else if (IS_IPHONE_6_PLUS){
        newFont = [UIFont fontWithName:font.fontName size:font.pointSize+IPHONE6PLUS_INCREMENT];
    }else{
        newFont = font;
    }
    return newFont;
}

第四步

然後就是控件層的分析。

首先,控件的生成有兩種方式,一種是通過代碼生成,還有一種是通過storyboard和xib生成。

然後就是字體的初始大小的設置問題。根據UI設計,不同的地方字體的大小肯定不一樣,所以還是要手動設置一次的,我們app的字體是完全按照UI給定的大小來設置的(只是在iPhone6和iPhone6Plus上會做相應的字號放大),如果是代碼生成則調用控件setFont方法,如果是storyboard和xib則在下圖紅框標注的位置設置字號即可:

這裡寫圖片描述

然後就是重載的方法,第一個是setFont方法,代碼如下:

-(void)setFont:(UIFont *)font{
[super setFont:[MBFontAdapter adjustFont:font]];
}

這樣用戶在調用.font或者setFont時就會自動對字號進行處理。

然後是awakeFromNib,這個方法是當控件是由xib和storyboard生成時會調用的,思路是拿到控件當前的font(也就是在上圖中設置字體的地方設置的那個字號),然後進行處理,代碼如下:

-(void)awakeFromNib{
[super awakeFromNib];
[super setFont:[MBFontAdapter adjustFont:self.font]];
}

具體的使用方法可以下載demo查看:
https://github.com/mmoaay/MBFontAdapter

注:目前已經完美支持storyboard和xib

  1. 上一頁:
  2. 下一頁:
蘋果刷機越獄教程| IOS教程問題解答| IOS技巧綜合| IOS7技巧| IOS8教程
Copyright © Ios教程網 All Rights Reserved