AUIconView 為 iconfont 向量圖控制項,可以同時實現 TextView 及 ImageView 的功能。
iconfont 表徵圖控制項(可當做 TextView 來使用)實際是通過 TextView 的 TTF 字型檔,定義特殊的 Unicode 碼對應一類表徵圖字型。也就是說,iconfont 相當於是載入了一個字型,一個字型對應了多個表徵圖,每個圖片有一個 Unicode 碼。
每個 iconfont 集合實際就是一個 TTF 字型檔,因此可以載入多個 TTF 字型檔。每個 TTF 字型檔有一個名稱,預設 AntUI 的 TTF 字型檔名稱為 auiconfont。
效果圖

表徵圖資源
資源 ID | 對應的樣本名稱 |
com.alipay.mobile.antui.R.string.iconfont_more | 更多 |
com.alipay.mobile.antui.R.string.iconfont_cancel | 取消 |
com.alipay.mobile.antui.R.string.iconfont_voice | 語音 |
com.alipay.mobile.antui.R.string.iconfont_collect_money | 收款 |
com.alipay.mobile.antui.R.string.iconfont_back | 返回 |
com.alipay.mobile.antui.R.string.iconfont_user_setting | 使用者佈建 |
com.alipay.mobile.antui.R.string.iconfont_user | 使用者 |
com.alipay.mobile.antui.R.string.iconfont_add | 添加 |
com.alipay.mobile.antui.R.string.iconfont_praise | 點贊 |
com.alipay.mobile.antui.R.string.iconfont_map | 地圖 |
com.alipay.mobile.antui.R.string.iconfont_checked | 勾選 |
com.alipay.mobile.antui.R.string.iconfont_notice | 公告 |
com.alipay.mobile.antui.R.string.iconfont_add_user | 添加使用者 |
com.alipay.mobile.antui.R.string.iconfont_comment | 評論 |
com.alipay.mobile.antui.R.string.iconfont_selected | 選擇 |
com.alipay.mobile.antui.R.string.iconfont_bill | 賬單 |
com.alipay.mobile.antui.R.string.iconfont_pulldown | 下拉 |
com.alipay.mobile.antui.R.string.iconfont_scan | 掃描 |
com.alipay.mobile.antui.R.string.iconfont_list | 列表 |
com.alipay.mobile.antui.R.string.iconfont_delete | 刪除 |
com.alipay.mobile.antui.R.string.iconfont_share | 分享 |
com.alipay.mobile.antui.R.string.iconfont_search | 搜尋 |
com.alipay.mobile.antui.R.string.iconfont_complain | 投訴 |
com.alipay.mobile.antui.R.string.iconfont_qrcode | 二維碼 |
com.alipay.mobile.antui.R.string.iconfont_unchecked | 取消勾選 |
com.alipay.mobile.antui.R.string.iconfont_right_arrow | 右箭頭 |
com.alipay.mobile.antui.R.string.iconfont_help | 協助 |
com.alipay.mobile.antui.R.string.iconfont_group_chat | 群聊 |
com.alipay.mobile.antui.R.string.iconfont_contacts | 連絡人 |
com.alipay.mobile.antui.R.string.iconfont_setting | 設定 |
com.alipay.mobile.antui.R.string.iconfont_phone_book | 通訊錄 |
com.alipay.mobile.antui.R.string.iconfont_phone_contact | 手機連絡人 |
介面說明
/**
* 設定圖片資源 ID
* @param resId
* @return
*/
@Override
public AUIconView setImageResource(int resId) {
if (resId == 0) {
return this;
}
clearView();
initImageView();
imageView.setImageResource(resId);
this.addView(imageView);
return this;
}
/**
* 設定圖片資源 drawable
* @param drawable
* @return
*/
@Override
public IconfontInterface setImageDrawable(Drawable drawable)
/**
* 設定 iconfont 顏色
* @param color
* @return
*/
public AUIconView setIconfontColor(int color)
/**
* 設定 iconfont 顏色 ColorStateList
* @param color
* @return
*/
public AUIconView setIconfontColorStates(ColorStateList color)
/**
* 設定 view 的大小,單位 px
*
* @param size
*/
public AUIconView setIconfontSize(float size)
/**
* 設定 view 的 iconfont 資源或文本
* @param text
* @return
*/
@Override
public AUIconView setIconfontUnicode(String text)程式碼範例
設定表徵圖的資訊:
AUIconView iconView = (AUIconView) convertView.findViewById(R.id.icon_view); iconView.setIconfontUnicode(iconUnicode); //例如 //iconView.setIconfontUnicode(getResources().getString(com.alipay.mobile.antui.R.string.iconfont_phone_contact));設定表徵圖的顏色:
<com.alipay.mobile.antui.iconfont.AUIconView android:id="@+id/icon_view" android:layout_width="@dimen/size" android:layout_height="@dimen/size" app:iconfontColor="@com.alipay.mobile.antui:color/AU_COLOR_APP_GREEN" app:iconfontUnicode="@com.alipay.mobile.antui:string/iconfont_back"/> //or: iconView.setIconfontColor(color) iconView.setIconfontColorStates(colorStateList)