很多时候，我们开发者，不管是为了了解新技术也好，还是为了给自己找个副业增加创收。我们都会开发一个属于自己的APP（网站）。但是，作为个人开发者来说，在开发的过程中，相当一部分时间的时间，并不是在处理业务。而是，在寻找或处理适合自己项目的图片。
随着社会的进步，科技的发展…现在的项目也不再仅仅使用png等图片做Icon了。
下面，介绍几种轻松其他的生成icon的办法。让我们节省更多的时间，构思自己的项目。
一、使用svg图片
Svg可缩放的矢量图，可以设置任意大小，而不会使图片变得模糊。
以Android为例，Android在5.0以后，支持了svg。而且，就现在的设备情况，项目的最小版本也可以到5了。所以，不用跟以前那样，
使用
android {
defaultConfig {
vectorDrawables.useSupportLibrary = true
}
}
来向下兼容了。
下面我们就尝试把svg图片，来加载到我们的项目
1，使用iconfont下载svg文件
-
首先，我们打开Iconfont官网
-
然后，选择一个图片，点击下载svg文件
这样，就下载好svg文件了。但是，这个文件，我们并不能直接使用。因为，它跟android中要用的SVG(vector)还不一样。
我们需要转换成Android需要的SVG格式图片。
转换方式有2种，一个是通过网上的工具转换，另一个就是直接通过Android 的导入功能(无缝对接)。
- 转换成Android的vector
- 1，通过工具转换
先介绍一下，通过一个工具，把svg文件转成Android中，要使用的vector，我们需要通过工具转换成Android需要的Vector:
工具地址
转换后，我们下载到本地，导入到项目
内容如下，
<?xml version="1.0" encoding="utf-8"?>
<vector xmlns:android="http://schemas.android.com/apk/res/android"
android:width="1024dp"
android:height="1024dp"
android:viewportWidth="1024"
android:viewportHeight="1024">
<path
android:fillColor="#5C5C66"
android:pathData="M149.333333 938.666667a21.333333 21.333333 0 0
1-21.333333-21.333334v-106.666666a85.426667 85.426667 0 0
1-85.333333-85.333334V213.333333a85.426667 85.426667 0 0 1
85.333333-85.333333h768a85.426667 85.426667 0 0 1 85.333333
85.333333v512a85.426667 85.426667 0 0 1-85.333333
85.333334H286.166667l-121.746667 121.753333A21.333333 21.333333 0 0 1 149.333333
938.666667zM128 170.666667a42.713333 42.713333 0 0 0-42.666667
42.666666v512a42.713333 42.713333 0 0 0 42.666667 42.666667h21.333333a21.333333
21.333333 0 0 1 21.333334 21.333333v76.5l91.58-91.586666A21.333333 21.333333 0 0
1 277.333333 768h618.666667a42.713333 42.713333 0 0 0
42.666667-42.666667V213.333333a42.713333 42.713333 0 0 0-42.666667-42.666666z" />
</vector>
里面就是Android需要的vector了。
- 2，Android平台的话，使用Android studio直接导入
如下
Android studio导入的时候，可以重新设置宽高。
最后，使用的时候。可以通过修改width,height。来控制图片的大小
android:width="128dp"
android:height="128dp"
通过，下面的属性，控制图片的颜色
android:fillColor="#00000000"
android:strokeWidth="0.8"
android:strokeColor="#33FFFFFF"
最后，在项目中，使用
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@drawable/bg_test_svg"
android:orientation="vertical">
这样，我们就可以愉快的使用svg图片了，也不用再费时费力的找图片了。
二、使用iconfont图片库
iconfont提供给了，我们一套ttf库。这样，我们就可以像加载字体库一样，来加载我们的图片了。
整体过程，跟使用自定义的字体库，非常相似。
整体的流程就是：
- 1，选择需要的图片，假如购物车
- 2，在购物车，把图片的代码下载下来(图片会用字符来表示)
- 3，把代码里面的ttf库，放到项目中
- 4，使用TextView加载Typeface
- 5，通过TextView#setText方法，把图片添加进去
下面，我们就跑一遍整体的流程，看看怎么玩。
iconfont使用说明-官方链接(包括Web,Android,iOS)
以Android平台为例为例
2.1，选择我们要使用的图片，全部放入购物车
打开iconfont官网，点击我们要使用的图片，会出现下面的图标
这里，我们选择加入购物车。因为，我们可能需要导入很多图片，最后通过购物车，一次性导入会方便很多。
2.2，点击购物车，下载代码
下载下来的代码结构
下载完了代码以后，我们就要把选好的图片添加到项目了。
2.3，把ttf文件放到项目
把icon-font.ttf文件，放到项目的assets-iconfont下面(只要在assets下，能找到就行)
现在，我们已经把库导入进来了。后面，就是使用把图片加载出来了
2.4 ，导入图片对应的编码
在浏览器打开，下载文件中的index.html
把编码复制到项目
对应到项目
<!-- 钱包-->
<string name="icon_wallet"></string>
2.5，编写加载图片的控件
public class IconFontTypeface {
public static String ASSETS_FONT = "iconfont/iconfont.ttf";
private static Typeface sTypeface;
/***
* 设置图片
*/
public static Typeface config(Context context) {
if (sTypeface == null) {
sTypeface = Typeface.createFromAsset(context.getAssets(), ASSETS_FONT);
}
return sTypeface;
}
}
自定义控件
public class IconFontTextView extends AppCompatTextView {
public IconFontTextView(@NonNull Context context) {
super(context);
init(context);
}
public IconFontTextView(@NonNull Context context, @Nullable AttributeSet attrs) {
super(context, attrs);
init(context);
}
public IconFontTextView(@NonNull Context context, @Nullable AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
init(context);
}
private void init(Context context) {
Typeface typeface = IconFontTypeface.config(context);
setTypeface(typeface);
}
}
2.6，使用控件，加载图片
<com.export.pdf.iconfont.IconFontTextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#00FF00"
android:textSize="200sp"
android:text="@string/icon_wallet"
/>
android:textColor=“#00FF00”，控制图片颜色
android:textSize=“200sp”，控制图片的大小
效果
到这里，整个加载过程就完成了
如果，要添加新的iconfont图片的话，记得也要把iconfont.ttf也换一下哦(新下载的图片是没有在之前ttf里面的)~