iconfont是阿里旗下的矢量图标库,因为矢量图标放大缩小不失真,以及其方便修改,容量小等特点被广泛使用。接下来将阐述下其在安卓,ios,web端的使用。
注册登录不详尽阐述。
iconfont官网地址http://www.iconfont.cn/,登录成功后,就可以搜索想用的图标了,比如搜索关键词,search,就会搜索出各种小icon,我们可以将中意的小图标加入购物车(鼠标滑过就会显示加入购物车的小图标哦),不但能单独下载小图标,还能加入项目哦,当然也是可以创建新项目的,添加完成后,点击下载就可以下载一个.zip的压缩包,按照里面的demo就可以在web页面里面使用下载后的字体图标啦。
web端用字体图标比较简单,那么在安卓,ios怎么使用呢 ?
Android使用
android可以直接使用单个icon(svg,png)。也可以直接引入字体应用：
第一步：从iconfont平台选择要使用到的图标，并下载至本地；复制字体文件到项目 assets 目录
第二步：打开从iconfont平台下载下来的文件，并在目录中打开demo.html，找到图标相对应的 HTML 实体字符码；
第三步：打开 res/values/strings.xml，添加 string 值；
第四步：打开 activity_main.xml，添加 string 值到 TextView：
第五步：为 TextView 指定文字：
import android.graphics.Typeface;
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
Typeface iconfont = Typeface.createFromAsset(getAssets(), "iconfont/iconfont.ttf");
TextView textview = (TextView)findViewById(R.id.like);
textview.setTypeface(iconfont);
}
IOS使用
IOS可以直接使用单个icon(svg,png)。也可以直接引入字体应用：
第一步：将您从IconFont平台下载的字体文件(.ttf)添加到工程中；
打开Info.plist文件，增加一个新的Array类型的键，键名设置为UIAppFonts（Fonts provided by application），增加字体的文件名：“iconfont.ttf“
第二步：使用IconFont字体:
UILabel* label = [[UILabelalloc] initWithFrame:self.view.bounds];UIFont*iconfont = [UIFontfontWithName:@"uxIconFont"size:34];label.font = iconfont;label.text = @"\U00003439 \U000035ad \U000035ae \U000035af \U000035eb \U000035ec";[self.view addSubview: label];
这里有两个地方注意下：
创建 UIFont 使用的是字体名，而不是文件名；
文本值为 8 位的 Unicode 字符，我们可以打开 demo.html 查找每个图标所对应的 HTML 实体 Unicode 码，比如： "店" 对应的 HTML 实体 Unicode 码为：0x3439 转换后为：\U00003439 就是将 0x 替换为 \U 中间用 0 填补满长度为 8 个字符
安卓,ios,web端 使用起来是不是很简单,那么有一些小icon在字体库里没有怎么办呢?别急我们还可以自己制作图标用哦
进入首页后,点击
右边那个云彩的图标,别告诉我,你没看到...点击后,把设计mm给我的svg格式的图标拖拽进去就ok啦,拖拽上传成功后,在我上传的icon选项处就会生成我们刚才上传的icon,ok,我们现在就可以把它添加到我们的项目了。有没有很简单~
