iOS文字大小自适应库(MBFontAdapter)诞生记

来源:互联网 发布:知字草书写法 编辑:程序博客网 时间:2024/05/21 13:55

背景

什么是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
原创粉丝点击
热门问题 老师的惩罚 人脸识别 我在镇武司摸鱼那些年 重生之率土为王 我在大康的咸鱼生活 盘龙之生命进化 天生仙种 凡人之先天五行 春回大明朝 姑娘不必设防,我是瞎子 车停在路边被自行车撞怎么办 撞了碰瓷的人怎么办 谷丙转氨酶46该怎么办 渣土车开飞机了怎么办 自己车撞自己车怎么办 撞了人没钱赔怎么办 闯红灯扣了6分怎么办 开共享汽车闯红灯了怎么办 新手如果不小心闯红灯怎么办 红绿灯左转车道直行了怎么办 跟着大车后面闯了红灯怎么办 宝宝私处好红怎么办呢 甲亢难怀孕怎么办才好 怀孕8周查出甲亢怎么办 电动车被交警拖走了怎么办 电动车车被城管拖走了怎么办 12123地理反编码失败怎么办 苹果手机地理反编码失败怎么办 城管执法过程被打怎么办 老婆看不起老公不让碰怎么办 老婆总不让碰该怎么办 机动车扣满12分怎么办 吊车吊运货物失控应该怎么办 车辆违章扣6分怎么办 最新交通法扣满12分怎么办 违章停车单丢了怎么办 违停告知单掉了怎么办 违章停车扣3分怎么办 驾驶证被扣12分怎么办 被贴条了条丢了怎么办 车停路边连续几天被贴条怎么办 车停在路边限号怎么办 违停的罚单丢了怎么办 借道左转红灯了 怎么办 道路上有锯齿线标志怎么办 被领导臭骂了一顿怎么办 酒驾撞了人逃跑怎么办处理 荣耀9home键掉了怎么办 今天开车把老太婆撞了怎么办 交通责任认定书不合理怎么办 交通事故救济金用了 没钱还怎么办