SVG 的特点:
-
矢量图形:SVG 使用基于路径的矢量图形,这意味着图形可以无限放大而不失真,非常适合需要多种分辨率的应用。
-
可伸缩性:SVG 文件的大小通常比位图小,这使得它们在网页上加载更快。
-
编辑和创作:SVG 文件是文本格式,可以使用任何文本编辑器创建和编辑。这使得它们易于手工编写和脚本化。
-
互动性:SVG 可以包含交互性,如事件处理器,允许用户与图形进行交互。
-
集成性:SVG 可以被直接嵌入 HTML 文档中,也可以作为图像元素使用。
-
动画:SVG 支持 SMIL(Synchronized Multimedia Integration Language),允许在图形中创建动画。
-
样式化:SVG 支持 CSS 样式,可以方便地改变图形的外观。
阿里IconFont平台
iconfont-阿里巴巴矢量图标库
IconFont虽然看起来是图标,实际原理跟字体的实现方式是一样的,所以我们把每个Icon当作一个特殊的文字来理解和处理。
IconFont使用
- 首先登录网站,搜索你要用的Icon,把它们加入购物车(点击就可以)。
- 把购物车里的所有Icon存储在同一个项目中。
- 进入项目,选择“下载至本地”。
- 打开下载的文件,里面有一个*.ttf文件,我们需要的所有字体就都在这里了
获取到这些图标我们就可以开始使用了:
1.首先创建一个文件夹
接下来复制内容(比如上方的ttf文件)进入文件
2.使用代码建立获取的逻辑结构:
public void finish(String tianqicode,weatherhourViewHolder holder) {analyzeJSONArray(tubiaoDay, tianqicode, holder);}String tubiaoDay="{" +"'100':'','101':'','102':''," +"'103':'','104':'','300':''," +"'301':'','302':'','303':''," +"'304':'','305':'','306':''," +"'307':'','308':'','309':''," +"'310':'','311':'','312':''," +"'313':'','314':'','315':''," +"'316':'','317':'','318':''," +"'399':'','400':'','401':''," +"'402':'','403':'','404':''," +"'405':'','406':'','407':''," +"'408':'','409':'','410':''," +"'499':'','500':'','501':''," +"'502':'','503':'','504':''," +"'507':'','508':'','509':''," +"'510':'','511':'','512':''," +"'513':'','514':'','515':''," +"'900':'','901':''}" ;public void analyzeJSONArray(String json,String tianqicode,weatherhourViewHolder holder) {try {JSONObject jsonObjectALL = new JSONObject(json);String b=jsonObjectALL.getString(tianqicode);holder.binding.ivMainDayweather.setText(Html.fromHtml(b));} catch (Exception e) {//e.printStackTrace();
// holder.binding.ivMainDayweather.setText(Html.fromHtml(""));//如果未找到则显示N/A}}
或者
打开 iconfont 目录中的 demo.html,找到图标相对应的 HTML 实体字符码;
打开 res/values/strings.xml,添加 string 值;
打开 activity_main.xml,添加 string 值到 TextView:
最后为 TextView 指定文字:
Typeface iconfont = Typeface.createFromAsset(getAssets(), "iconfont/iconfont.ttf");
TextView textview = (TextView)findViewById(R.id.like);
textview.setTypeface(iconfont);
icon字体的使用
前几步如之前的,在平台获取字体文件压缩包
接下来还是如图:
将ttf文件放入项目该文件夹
全局:
这个时候我们首先试着设置全局的:
如图所示加入两句即可
同时要保证该thems是自己项目依赖的。
单个:
使用这两句,将text字体设置即可