Android Stdio调用阿里图标库

Step1.访问阿里图标库官网https://www.iconfont.cn/home/index?spm=a313x.7781069.1998910419.2

Android Stdio调用阿里图标库_第1张图片

 

Step2:登陆账号

Android Stdio调用阿里图标库_第2张图片

 

Android Stdio调用阿里图标库_第3张图片

 

Step3:点击图标库

Android Stdio调用阿里图标库_第4张图片

 

Step4,将要使用的图标填入库

Android Stdio调用阿里图标库_第5张图片

 

Step5.点击右上角购物车按钮,下载代码

Android Stdio调用阿里图标库_第6张图片

 

Android Stdio调用阿里图标库_第7张图片

 

Step6.解压待用

Android Stdio调用阿里图标库_第8张图片

 

Android Stdio调用阿里图标库_第9张图片

 

Step7.在Android Studio中的src文件夹右键

Android Stdio调用阿里图标库_第10张图片

 

Step8.单击New,创建Assets文件夹

Android Stdio调用阿里图标库_第11张图片

 

Android Stdio调用阿里图标库_第12张图片

 

Android Stdio调用阿里图标库_第13张图片

 

Android Stdio调用阿里图标库_第14张图片

 

Step9.找到安装目录中的assets文件夹(通常位于\...\app\src\main目录下)

Android Stdio调用阿里图标库_第15张图片

 

Step10.新建一个iconfont的文件夹

Android Stdio调用阿里图标库_第16张图片

 

Step11.将Step6中的iconfont.ttf复制到上一步新建的文件夹中,打开Step6文件夹中的demo_index.html备用

Android Stdio调用阿里图标库_第17张图片

 

Android Stdio调用阿里图标库_第18张图片

 

Step12.Android studio中的配置

Android Stdio调用阿里图标库_第19张图片

  • (先查看Android Studio中的Assets中是否有建的文件夹和复制的文件)

Android Stdio调用阿里图标库_第20张图片

 

Android Stdio调用阿里图标库_第21张图片

  • 在res/values/strings.xml,添加 string 值:
  

 

Android Stdio调用阿里图标库_第22张图片

  •     这个是Step11.中打开网页中的字符Unicode

Android Stdio调用阿里图标库_第23张图片

  • 打开 activity_main.xml,添加 string 值到 TextView

Android Stdio调用阿里图标库_第24张图片

  • 给TextView添加ID属性,当然TextView的
    android:textColor="#ff0000"  
    android:textSize="100sp"  
    android:textStyle="bold"  

     

都可使用

该处代码:

  
  
  
      
    

Android Stdio调用阿里图标库_第25张图片

 

 

Android Stdio调用阿里图标库_第26张图片

  • 在Activity中为 TextView 指定文字

代码:

import android.graphics.Typeface;  
import android.os.Bundle;  
import android.widget.TextView;  
  
public class MainActivity extends AppCompatActivity {  
  
    @Override  
    protected void onCreate(Bundle savedInstanceState) {  
        super.onCreate(savedInstanceState);  
        setContentView(R.layout.activity_main);  
        Typeface typeface=Typeface.createFromAsset(getAssets(),"iconfont/iconfont.ttf");  
        //iconfont/iconfont.ttf为字体文件路径  
        TextView textView=findViewById(R.id.icon);  
        textView.setTypeface(typeface);  
    }  
}  

Android Stdio调用阿里图标库_第27张图片

 

Android Stdio调用阿里图标库_第28张图片

  • 运行查看效果
    • 官方文档说明:
    • https://www.iconfont.cn/help/detail?spm=a313x.7781069.1998910419.15&helptype=code
    • 官方文档快照:

Android使用

android可以直接使用单个icon(svg,png)。也可以直接引入字体应用:

第一步:从iconfont平台选择要使用到的图标,并下载至本地;复制字体文件到项目 assets 目录

Android Stdio调用阿里图标库_第29张图片

第二步:打开从iconfont平台下载下来的文件,并在目录中打开demo.html,找到图标相对应的 HTML 实体字符码;

Android Stdio调用阿里图标库_第30张图片

第三步:打开 res/values/strings.xml,添加 string 值;

<string name="icons">㘅 㖭 㖮 㖯string>

第四步:打开 activity_main.xml,添加 string 值到 TextView

<TextView

android:id="../../+id/like"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="../../string/icons" />

第五步:为 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);
}

Android Stdio调用阿里图标库_第31张图片

 

来自 <https://www.iconfont.cn/help/detail?spm=a313x.7781069.1998910419.15&helptype=code>

 

 

 

 

 

 

 

 

你可能感兴趣的:(安卓)