在android開發(fā)中,需要展示圖片的地方有很多..正常情況下展示一張圖片的時(shí)候還需要在下面添加一個文字說明..我們也可以用布局ImageView+TextView來實(shí)現(xiàn)..最常見的就是底部菜單,或者頂部菜單...圖標(biāo)下面還要添加一個文字說明...重復(fù)多次使用ImageView+TextView來實(shí)現(xiàn)會感覺有點(diǎn)麻煩..
下面就介紹一個簡易的圖片+文字的簡單控件
上效果圖

效果圖

下面我們開始擼代碼.
MyImageTextViewNew.java

public class MyImageTextViewNew extends LinearLayout {

    private ImageView mImageView = null;
    private TextView mTextView = null;
    private int imageId;
    private int textId, textColorId;

    public MyImageTextViewNew(Context context) {
        this(context, null);
    }

    public MyImageTextViewNew(Context context, @Nullable AttributeSet attrs) {
        this(context, attrs, 0);
    }

    public MyImageTextViewNew(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        this.setOrientation(LinearLayout.VERTICAL);//設(shè)置垂直排序
        this.setGravity(Gravity.CENTER);//設(shè)置居中
        if (mImageView == null) {
            mImageView = new ImageView(context);
        }
        if (mTextView == null) {
            mTextView = new TextView(context);
        }
        if (attrs == null)
            return;
        int count = attrs.getAttributeCount();
        for (int i = 0; i < count; i++) {
            String attrName = attrs.getAttributeName(i);//獲取屬性名稱
            //根據(jù)屬性獲取資源ID
            switch (attrName) {
                //顯示的圖片
                case "image":
                    imageId = attrs.getAttributeResourceValue(i, 0);
                    break;
                //顯示的文字
                case "text":
                    textId = attrs.getAttributeResourceValue(i, 0);
                    break;
                //顯示的文字的顏色
                case "textColor":
                    textColorId = attrs.getAttributeResourceValue(i, 0);
                    break;
            }
        }
        init();
    }

    /**
     * 初始化狀態(tài)
     */
    private void init() {
        this.setText(textId);
        mTextView.setGravity(Gravity.CENTER);//字體居中
        this.setTextColor(textColorId);
        this.setImgResource(imageId);
        addView(mImageView);//將圖片控件加入到布局中
        addView(mTextView);//將文字控件加入到布局中
    }

    /**
     * 設(shè)置顯示的圖片
     *
     * @param resourceID 圖片ID
     */
    private void setImgResource(int resourceID) {
        if (resourceID == 0) {
            this.mImageView.setImageResource(0);
        } else {
            this.mImageView.setImageResource(resourceID);
        }
    }

    /**
     * 設(shè)置顯示的文字
     *
     * @param text
     */
    public void setText(int text) {
        this.mTextView.setText(text);
    }

    /**
     * 設(shè)置字體顏色(默認(rèn)為黑色)
     *
     * @param color
     */
    private void setTextColor(int color) {
        if (color == 0) {
            this.mTextView.setTextColor(Color.BLACK);
        } else {
            this.mTextView.setTextColor(getResources().getColor(color));
        }
    }

}

簡單解釋下..實(shí)際上就是在LinearLayout布局中添加ImageView和TextView
這個View也比較簡單,代碼中也有部分簡易的說明.
下面可能還需要一個屬性文件
imageText.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>

    <declare-styleable name="imageText">
        <attr name="image" format="integer" />
        <attr name="text" format="integer" />
        <attr name="textColor" format="integer" />
    </declare-styleable>
    
</resources>

配置文件存放位置

下面展示使用方法

實(shí)際使用

介紹到此結(jié)束
歡迎帶地址轉(zhuǎn)發(fā)..謝謝!