1)字蛛安装,将"huawen.ttf"字体文件

  • 栏目:前端 时间:2020-01-04 12:53
<返回列表

图片 1

前言

在iOS的项目开发中经常遇到需要使用一些自定义的字体文件,比如仿宋_GB2312华康少女体等。之前我们为了使用这些自定义的字体,在应用的资源包中放入这些字体文件。因为字体文件通常比较大,有的一个字库就达到10M以上,这样打包后的ipa文件的体积就可能会变得很大,对于只有个别的模块需要特殊的字体样式的应用来说很不划算,那么在iOS6.0以后苹果就开放了动态加载字体的权限。下面就iOS中使用字体的这两种方式进行介绍。

1、UI设计图有"华文黑体",担心客户端没有该字体,将"huawen.ttf"字体文件,放入项目中:

使用静态字体

将字体文件拷贝到项目工程中,在Info.plist文件中添加Fonts provided by application的配置项,其中每一个Item对应的是字体文件的名称,如huakangshaonv.ttf

fontDemo ScreenShot.png

然后就可以调用+ (UIFont *)fontWithName:(NSString *)fontName size:(CGFloat)fontSize使用字体,如果不知道fontName可以遍历打印出来:

- (void)allFont
{
    NSArray *fontFamilies = [UIFont familyNames];
    for (NSString *fontFamily in fontFamilies)
    {
        NSArray *fontNames = [UIFont fontNamesForFamilyName:fontFamily];
        NSLog (@">>> fontFamily : %@ , fontNames : %@", fontFamily, fontNames);
    }
}
  1. 非要使用的话,优化的办法是:使用cdn(但是也是优化不大,可以说是没有用);
  2. 对于动态数据(未知数据),不使用第三方字体渲染,而改用系统字体,只对已知数据使用第三方字体渲染,然后将字体文件中不使用的文字全部删除,达到极大压缩字体文件的效果(10m压缩成几十k[手动滑稽])

2、创建一个font.scss文件:

使用动态字体

在网易新闻iOS客户端中可以使用自定义的字体,对于未下载的字体可先下载然后安装下次就能自动设置为该字体,效果如下:

wangyiFont.png

下面就该功能简单介绍实现的步骤

- (NSString *)downloadZipFile:(NSString *)fileUrl toPath:(NSString *)path
{
    NSError *error = nil;
    NSURL *url = [NSURL URLWithString:fileUrl];
    NSString *fileName = [url lastPathComponent];
    NSData *data = [NSData dataWithContentsOfURL:url options:0 error:&error];
    if(!error)
    {
        NSString *zipPath = [path stringByAppendingPathComponent:fileName];
        [data writeToFile:zipPath options:0 error:&error];
        if(!error)
        {
            return zipPath;
        }
    }
    return nil;
}

iOS中解压zip压缩文件非常方便,使用ZipArchive这个开源项目按照如下的方式即可快速解压zip文件。

- (NSString *)expandZipFile:(NSString *)src toPath:(NSString *)desc
{
    ZipArchive *za = [[ZipArchive alloc] init];
    if ([za UnzipOpenFile:src])
    {
        BOOL ret = [za UnzipFileTo:desc overWrite:YES];//解压文件
        if(ret)
        {
            NSString *zipName = [src lastPathComponent];//获取zip文件的文件名
            [[NSFileManager defaultManager] removeItemAtPath:zipPath error:nil];//删除zip压缩包
            zipName = [zipName substringToIndex:[zipName rangeOfString:@".zip"].location];//获取解压到的文件夹
            return [self.downloadPath stringByAppendingPathComponent:zipName];
        }
    }
    return nil;
}

下载回来的字体文件如果不做处理是不能直接使用的,使用前需要先注册然后才能使用,注册方式如下:

- (void)registerFont:(NSString *)fontPath
{
    NSData *dynamicFontData = [NSData dataWithContentsOfFile:fontPath];
    if (!dynamicFontData)
    {
        return;
    }
    CFErrorRef error;
    CGDataProviderRef providerRef = CGDataProviderCreateWithCFData((__bridge CFDataRef)dynamicFontData);
    CGFontRef font = CGFontCreateWithDataProvider(providerRef);
    if (! CTFontManagerRegisterGraphicsFont(font, &error))
    {
        //注册失败
        CFStringRef errorDescription = CFErrorCopyDescription(error);
        NSLog(@"Failed to load font: %@", errorDescription);
        CFRelease(errorDescription);
    }
    CFRelease(font);
    CFRelease(providerRef);
}

需要先引入#import <CoreText/CoreText.h>CoreText框架

在使用字体文件前最好是先判断字体是否已经被加载过了,判断方式如下:

- (BOOL)isFontDownloaded:(NSString *)fontName
{
    UIFont* aFont = [UIFont fontWithName:fontName size:12.0];
    BOOL isDownloaded = (aFont && ([aFont.fontName compare:fontName] == NSOrderedSame || [aFont.familyName compare:fontName] == NSOrderedSame));
    return isDownloaded;
}

经测试注册过的字体在应用关闭后下次开启应用,判断字体是否加载时返回为NO,为了保证正常使用需要每次启动应用的时候先遍历一遍字体文件夹将里面的字体文件都再次注册一遍即可。参考代码如下:

//注册fonts目录下面的所有字体文件
NSArray *ary = [[NSFileManager defaultManager] contentsOfDirectoryAtPath:self.downloadPath error:nil];
for (NSString *p1 in ary)
{
    NSString *t1 = [self.downloadPath stringByAppendingPathComponent:p1];
    NSArray *ary1 = [[NSFileManager defaultManager] contentsOfDirectoryAtPath:t1 error:nil];
    for (NSString *p1 in ary1)
    {
        NSString *t2 = [t1 stringByAppendingPathComponent:p1];
        if([t2 rangeOfString:@".ttf"].location != NSNotFound)
        {
            [self registerFont:t2];
        }
    }
}

以上就是对使用第三方字体的方法的介绍。

@font-face { font-family: 'huawen'; //重命名字体名 src: url('huawen.ttf'); //引入字体 font-weight: normal; font-style: normal; }

参考

曾静的技术博客:在iOS开发中使用自定义字体

font-family: 'slHeiTi','Microsoft Yahei','arial','Arial Narrow','HELVETICA','Tahoma';
// 第一个是第三方字体

3、在main.js中引入

压缩字体的工具:“字蛛“

0)“字蛛“的原理
字蛛通过分析本地 CSS 与 HTML 文件获取 WebFont 中没有使用的字符,并将这些字符数据从字体中删除以实现压缩,并生成跨浏览器使用的格式。
官网:http://font-spider.org/#use
1)字蛛安装

//需要node环境,没有node环境,先去安装
npm install -g font-spider  //全局安装
//可以不-g安装,而是直接安装在你的项目下

2)构建文件,为压缩做准备

贴一下项目结构:

图片 2

Paste_Image.png

PS:不是一定要php文件
新建个css文件,在里面用@font引入字体文件:

@font-face {
  font-family: 'KhmerUI';
  src: url('./fonts/khmer_ui/khmerui-0.eot');
  src: url('./fonts/khmer_ui/khmerui-0.eot?#iefix') format('embedded-opentype'), 
       url('./fonts/khmer_ui/khmerui-0.woff') format('woff'), 
       url('./fonts/khmer_ui/khmerui-0.ttf') format('truetype'),
       url('./fonts/khmer_ui/khmerui-0.svg#svgFontName') format('svg');
}
@font-face {
  font-family: 'slHeiTi';
  src: url('./fonts/slHeiTi/SourceHanSansCN-Regular.eot');
  src: url('./fonts/slHeiTi/SourceHanSansCN-Regular.eot?#iefix') format('embedded-opentype'),
       url('./fonts/slHeiTi/SourceHanSansCN-Regular.woff') format('woff'), 
       url('./fonts/slHeiTi/SourceHanSansCN-Regular.ttf') format('truetype'),
       url('./fonts/slHeiTi/SourceHanSansCN-Regular.svg#svgFontName') format('svg');  
}
h1{ font-family: 'KhmerUI'; }
div{ font-family: 'slHeiTi'; }

然后就是在html/php/jsp/ejs/while(1){“..."}/文件中引入(link)以上的css文件。
PS:我的项目是做了国际化的,文字都是放在数组里面,所以,分析html文件是分析不到我需要的字体的,我需要的字体都在语言包里面,所以我直接新建一个项目分析语言包的字体。如果没有做类似我这样的国际化,可以直接省略这一步。

3)压缩字体文件:
```

font-spider ./demo/.html //你项目的路径
//比如,我的项目:
//font-spider ~/workspace/php/font/
.php

import '@/common/css/font.scss';

4、就可以直接使用了:

div { font-family: 'huawen';}
上一篇:我们也可以实现自己的流,这使得流在处理大量数据时非常强大 下一篇:没有了

更多阅读

1)字蛛安装,将"huawen.ttf"字体文

前端 2020-01-04
前言 在iOS的项目开发中经常遇到需要使用一些自定义的字体文件,比如 仿宋_GB2312 、 华康少女...
查看全文

我们也可以实现自己的流,这使得流在处

前端 2020-01-04
NodeJs流以难以使用而闻名,甚至更难理解。 好吧,我给你带来了好消息 -现在已经不是这样了...
查看全文

否则请加以下内容添加到.bash,在安装的

前端 2020-01-04
安装nvm 用过 npm cnpm吗?知道 npx nvm 吗? git clone nvm 直接从 github clone nvm 到本地, 这里假设大家...
查看全文

友情链接: 网站地图

Copyright © 2015-2019 http://www.koi-bumi.com. 韦德体育有限公司 版权所有