【移動(dòng)應(yīng)用開發(fā)技術(shù)】iOS中使用iconfont圖標(biāo)的方法

【移動(dòng)應(yīng)用開發(fā)技術(shù)】iOS中使用iconfont圖標(biāo)的方法

這篇文章主要介紹了iOS中使用iconfont圖標(biāo)的方法，具有一定借鑒價(jià)值，感興趣的朋友可以參考下，希望大家閱讀完這篇文章之后大有收獲，下面讓在下帶著大家一起了解一下。1.什么是iconfonticonFont拆開來看，就是Icon+Font，這樣估計(jì)大家應(yīng)該都能理解是什么，那兩者結(jié)合是什么呢？沒錯(cuò)！就是IconFont！讓開發(fā)者像使用字體一樣使用圖標(biāo)。如果自己不會(huì)做的話，可以直接去阿里的iconfont圖標(biāo)庫下載自己需要的圖標(biāo)。2.為什么要使用iconfont在開發(fā)項(xiàng)目時(shí)，不可避免的會(huì)用到各種圖標(biāo)，為了適配不同的設(shè)備，通常需要@2x和@3x兩套圖，例如說我們tabBar上使用的圖標(biāo)。有些app有換膚的需要，還需要多套不同的圖來進(jìn)行匹配不同的主題。如果使用切圖，這對于設(shè)計(jì)和開發(fā)來說無疑是增加了工作量，而且ipa的體積也會(huì)增大。使用iconfont的好處:1.減小ipa包的大小2.圖標(biāo)保真縮放，多設(shè)備適配一套圖解決問題3.適應(yīng)換膚要求，使用方便。3.怎么用iconfont1.首先去iconfont圖標(biāo)庫下載自己需要的圖標(biāo)。簡書里竟然gif大小限制的這么厲害，所以將動(dòng)圖放到項(xiàng)目里了，需要的在文末有g(shù)it地址如圖我們可以選擇自己需要的icon加入到購物車，然后加入項(xiàng)目里，當(dāng)然你也可以直接在購物車直接下載，但是這樣只是沒有修改icon為自己想要的樣式，加入項(xiàng)目中，你可以自己任意修改icon為自己想要的樣式。注意：這里是下載代碼，這樣我們就可以在項(xiàng)目中直接使用2.將下載下來的icon資源添加到自己的項(xiàng)目中。我們所需要的就是這個(gè)iconfont.ttf，對于這個(gè)ttf文件，我想我們并不陌生吧。新建項(xiàng)目，將這個(gè)ttf文件拖入自己的項(xiàng)目里。注意：勾選如圖選項(xiàng)接下來配置項(xiàng)目加載這個(gè)文件檢查文件是否在項(xiàng)目中，不然會(huì)崩潰在plist文件中加入字體接下來我們借助淘點(diǎn)點(diǎn)科技寫的一個(gè)關(guān)于iconfont封裝，方便我們使用iconfont。iconfont的封裝包括工具類TBCityIconInfo.h的實(shí)現(xiàn)#import

<Foundation/Foundation.h>

#import

<UIKit/UIKit.h>

@interface

TBCityIconInfo

:

NSObject

@property

(nonatomic,

strong)

NSString

*text;

@property

(nonatomic,

assign)

NSInteger

size;

@property

(nonatomic,

strong)

UIColor

*color;

-

(instancetype)initWithText:(NSString

*)text

size:(NSInteger)size

color:(UIColor

*)color;

+

(instancetype)iconInfoWithText:(NSString

*)text

size:(NSInteger)size

color:(UIColor

*)color;

@endTBCityIconInfo.m的實(shí)現(xiàn)#import

"TBCityIconInfo.h"

@implementation

TBCityIconInfo

-

(instancetype)initWithText:(NSString

*)text

size:(NSInteger)size

color:(UIColor

*)color

{

if

(self

=

[super

init])

{

self.text

=

text;

self.size

=

size;

self.color

=

color;

}

return

self;

}

+

(instancetype)iconInfoWithText:(NSString

*)text

size:(NSInteger)size

color:(UIColor

*)color

{

return

[[TBCityIconInfo

alloc]

initWithText:text

size:size

color:color];

}

@endTBCityIconFont.h的實(shí)現(xiàn)#import

"UIImage+TBCityIconFont.h"

#import

"TBCityIconInfo.h"

#define

TBCityIconInfoMake(text,

imageSize,

imageColor)

[TBCityIconInfo

iconInfoWithText:text

size:imageSize

color:imageColor]

@interface

TBCityIconFont

:

NSObject

+

(UIFont

*)fontWithSize:

(CGFloat)size;

+

(void)setFontName:(NSString

*)fontName;TBCityIconFont.m的實(shí)現(xiàn)#import

"TBCityIconFont.h"

#import

<CoreText/CoreText.h>

@implementation

TBCityIconFont

static

NSString

*_fontName;

+

(void)registerFontWithURL:(NSURL

*)url

{

NSAssert([[NSFileManager

defaultManager]

fileExistsAtPath:[url

path]],

@"Font

file

doesn't

exist");

CGDataProviderRef

fontDataProvider

=

CGDataProviderCreateWithURL((__bridge

CFURLRef)url);

CGFontRef

newFont

=

CGFontCreateWithDataProvider(fontDataProvider);

CGDataProviderRelease(fontDataProvider);

CTFontManagerRegisterGraphicsFont(newFont,

nil);

CGFontRelease(newFont);

}

+

(UIFont

*)fontWithSize:(CGFloat)size

{

UIFont

*font

=

[UIFont

fontWithName:[self

fontName]

size:size];

if

(font

==

nil)

{

NSURL

*fontFileUrl

=

[[NSBundle

mainBundle]

URLForResource:[self

fontName]

withExtension:@"ttf"];

[self

registerFontWithURL:

fontFileUrl];

font

=

[UIFont

fontWithName:[self

fontName]

size:size];

NSAssert(font,

@"UIFont

object

should

not

be

nil,

check

if

the

font

file

is

added

to

the

application

bundle

and

you're

using

the

correct

font

name.");

}

return

font;

}

+

(void)setFontName:(NSString

*)fontName

{

_fontName

=

fontName;

}

+

(NSString

*)fontName

{

return

_fontName

?

:

@"iconfont";

}

@endUIImage+TBCityIconFont.h的實(shí)現(xiàn)#import

<UIKit/UIKit.h>

#import

"TBCityIconInfo.h"

@interface

UIImage

(TBCityIconFont)

+

(UIImage

*)iconWithInfo:(TBCityIconInfo

*)info;

@end

UIImage+TBCityIconFont.m的實(shí)現(xiàn)

#import

"UIImage+TBCityIconFont.h"

#import

"TBCityIconFont.h"

#import

<CoreText/CoreText.h>

@implementation

UIImage

(TBCityIconFont)

+

(UIImage

*)iconWithInfo:(TBCityIconInfo

*)info

{

CGFloat

size

=

info.size;

CGFloat

scale

=

[UIScreen

mainScreen].scale;

CGFloat

realSize

=

size

*

scale;

UIFont

*font

=

[TBCityIconFont

fontWithSize:realSize];

UIGraphicsBeginImageContext(CGSizeMake(realSize,

realSize));

CGContextRef

context

=

UIGraphicsGetCurrentContext();

if

([info.text

respondsToSelector:@selector(drawAtPoint:withAttributes:)])

{

/**

*

如果這里拋出異常，請打開斷點(diǎn)列表，右擊All

Exceptions

->

Edit

Breakpoint

->

All修改為Objective-C

*

See:

/questions/1163981/how-to-add-a-breakpoint-to-objc-exception-throw/14767076#14767076

*/

[info.text

drawAtPoint:CGPointZero

withAttributes:@{NSFontAttributeName:font,

NSForegroundColorAttributeName:

info.color}];

}

else

{

#pragma

clang

diagnostic

push

#pragma

clang

diagnostic

ignored

"-Wdeprecated-declarations"

CGContextSetFillColorWithColor(context,

info.color.CGColor);

[info.text

drawAtPoint:CGPointMake(0,

0)

withFont:font];

#pragma

clang

pop

}

UIImage

*image

=

[UIImage

imageWithCGImage:UIGraphicsGetImageFromCurrentImageContext().CGImage

scale:scale

orientation:UIImageOrientationUp];

UIGraphicsEndImageContext();

return

image;

}

@end3.具體使用方法1.在AppDelegate.m中，初始化iconfont#import

"AppDelegate.h"

#import

"TBCityIconFont.h"

#import

"ViewController.h"

@interface

AppDelegate

()

@end

@implementation

AppDelegate

-

(BOOL)application:(UIApplication

*)application

didFinishLaunchingWithOptions:(NSDictionary

*)launchOptions

{

//

Override

point

for

customization

after

application

launch.

[TBCityIconFont

setFontName:@"iconfont"];

UINavigationController

*nav

=

[[UINavigationController

alloc]

initWithRootViewController:[ViewController

new]];

self.window.rootViewController

=

nav;

[self.window

makeKeyAndVisible];

return

YES;

}在ViewController.m中實(shí)現(xiàn)#import

"ViewController.h"

#import

"TBCityIconFont.h"

#import

"UIImage+TBCityIconFont.h"

@interface

ViewController

()

@end

@implementation

ViewController

-

(void)viewDidLoad

{

[super

viewDidLoad];

self.view.backgroundColor

=

[UIColor

whiteColor];

UIImageView

*imageView

=

[[UIImageView

alloc]

initWithFrame:CGRectMake(100,

100,

30,

30)];

[self.view

addSubview:imageView];

//圖標(biāo)編碼是，需要轉(zhuǎn)成\U0000e600

imageView.image

=

[UIImage

iconWithInfo:TBCityIconInfoMake(@"\U0000e600",

30,

[UIColor

redColor])];

//

button

UIButton

*button

=

[UIButton

buttonWithType:UIButtonTypeSystem];

button.frame

=

CGRectMake(100,

150,

40,

40);

[self.view

addSubview:button];

[button

setImage:[UIImage

iconWithInfo:TBCityIconInfoMake(@"\U0000