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

背景

什么是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

时间: 2024-12-11 01:40:11

iOS文字大小自适应库(MBFontAdapter)诞生记的相关文章

ios文字大小设置

//显示文本 var myName:NSString = "文启领航教育文启领航教育文启领航教育文启领航教育文启领航教育文启领航教育文启领航教育文启领航教育文启领航教育文启领航教育文启领航教育文启领航教育文启领航教育文启领航教育文启领航教育文启领航教育文启领航教育文启领航教育文启领航教育文启领航教育文启领航教育"; //字体大小 var font:UIFont = UIFont.systemFontOfSize(14); var size:CGSize = CGSizeMake(sel

CSS设置文字大小自适应功能

<span id="topaccount" style="font-size:3rem;color:red;">NANA</span> <span> 这是html的某一个页面的span里面的东西 我想让它自适应显示设备儿变大变小font-size:3rem 1rem=16px 然后 我只要设置html的属性,然后具体哪个标签要固定死就让他为固定的值.其他的值为3rem的百分比 <style> @media screen

Ios之label自适应里面的文字,自动调整宽度和高度的

[label setNumberOfLines:0];//设置显示的行数 NSString *s = @"string......";//设置要显示的内容 UIFont *font = [UIFont fontWithName:@"Arial" size:12];//设置字体样式 CGSize size = CGSizeMake(320,2000);//设置最大容量 CGSize labelsize = [s sizeWithFont:font constraine

初学IOS遇到的问题(三)UIButton修改文字大小问题

问题: 创建UIButton对象,设置对象显示文字“按钮”,然后修改文字大小,很自然点出对象的font属性,却发现该属性在2.0.3.0就已经被废弃,ios不建议使用.应该如何修改UIButton对象的文字大小? 图1-1:点出UIButton对象的font属性提示被废弃 图1-2:UIButton类的font属性被标记为NS_DEPRECATED_IOS 解决办法: 在xcode3.0之后,建议使用UIButton对象的属性titleLabel设置文字大小. 代码如下: UIButton *b

如何自适应ios设备大小

在编写移动端GIS程序的时候,经常要根据ios设备的大小来设置UI,以前我在ios程序中,需要定义设备的值(如:宽度和高度),如: //屏幕宽度 高度 #define kScreenWidth 320 #define kScreenHeight 548 但是如果是不同的设备,如iphone4.iphone5,甚至是ipad等设备,那么就要改变代码,非常不方便,其实ios是提供方法来解决这个问题的. 如下所示: #define ScreenHeight   [[UIScreen mainScree

iOS开发常用三方库、插件、知名博客等等

TimLiu-iOS   Swift版本点击这里 欢迎加入QQ交流群: 594119878 介绍 这是一个用于iOS开发的各种开源库.开源资料.开源技术等等的索引库. github排名 https://github.com/trending,github搜索:https://github.com/search 使用方法 根据目录关键字搜索,记得包含@,以保证搜索目录关键字的唯一性. 问题反馈 期待大家和我们一起共同维护,同时也期望大家随时能提出宝贵的意见(直接提交issues即可).请广大网友只

IOS开发第三方开源库

IOSios开发第三方开源库 1. AFNetworking 在众多iOS开源项目中,AFNetworking可以称得上是最受开发者欢迎的库项目.AFNetworking是一个轻量级的iOS.Mac OS X网络通信类库,现在是GitHub上第三大Objective-C库.它建立在NSURLConnection.NSOperation等类库的基础上,让很多网络通信功能的实现变得十分简单,因此,许多iOS应用开发都会使用到它. 支持HTTP请求和基于REST的网络服务(包括GET.POST.PUT

[转] iOS文字排版(CoreText)那些事儿

文章转载自 http://www.cocoachina.com/applenews/devnews/2014/0521/8504.html iOS文字排版(CoreText)那些事儿 转自阿毛的蛋疼地 第一次比较深入接触iOS文字排版相关内容是在12年底,实现某IM项目聊天内容的图文混排,照着nimbus的AttributedLabel和Raywenderlish上的这篇文章<Core Text Tutorial for iOS: Making a Magazine App>改出了一个比较适用

iOS文字排版(CoreText)

和我们平时说的字体不同,计算机意义上的字体表示的是同一大小,同一样式(Style)字形的集合.从这个意义上来说,当我们为文字设置粗体,斜体时其实是使用了另外一种字体(下划线不算). iOSCoreText 转自阿毛的蛋疼地 第一次比较深入接触iOS文字排版相关内容是在12年底,实现某IM项目聊天内容的图文混排,照着nimbus的AttributedLabel和Raywenderlish上的这篇文章<Core Text Tutorial for iOS: Making a Magazine App