1. 程式人生 > >Android自定義RadioButton以控制drawableTop等方向的圖片大小

Android自定義RadioButton以控制drawableTop等方向的圖片大小

通常在一般的APP中,都會在主頁的下方設定3到5個按鈕進行主介面的切換,而這種切換實現的方式有很多,比如RadioButton,TabHost,自定義等,本篇主講RadioButton的實現方式。

優勢:簡單粗暴,易於實現,易於控制。

直入正題,效果圖:


1.新建MyRadioButton類,繼承RadioButton

package com.example.yechaoa.radiobuttondemo;

import android.content.Context;
import android.content.res.TypedArray;
import android.graphics.drawable.Drawable;
import android.util.AttributeSet;
import android.widget.RadioButton;

/**
 * Created by yechao on 2016/12/1.
 * Describe:可控制drawableTop等圖片的大小
 */

public class MyRadioButton extends RadioButton {

    private int mDrawableSize;// xml檔案中設定的大小

    public MyRadioButton(Context context) {
        this(context, null, 0);
    }

    public MyRadioButton(Context context, AttributeSet attrs) {
        this(context, attrs, 0);
    }

    public MyRadioButton(Context context, AttributeSet attrs, int defStyle) {
        super(context, attrs, defStyle);
        Drawable drawableLeft = null, drawableTop = null, drawableRight = null, drawableBottom = null;
        TypedArray a = context.obtainStyledAttributes(attrs, R.styleable.MyRadioButton);

        int n = a.getIndexCount();
        for (int i = 0; i < n; i++) {
            int attr = a.getIndex(i);
            switch (attr) {
                case R.styleable.MyRadioButton_drawableSize:
                    mDrawableSize = a.getDimensionPixelSize(R.styleable.MyRadioButton_drawableSize, 50);
                    break;
                case R.styleable.MyRadioButton_drawableTop:
                    drawableTop = a.getDrawable(attr);
                    break;
                case R.styleable.MyRadioButton_drawableBottom:
                    drawableRight = a.getDrawable(attr);
                    break;
                case R.styleable.MyRadioButton_drawableRight:
                    drawableBottom = a.getDrawable(attr);
                    break;
                case R.styleable.MyRadioButton_drawableLeft:
                    drawableLeft = a.getDrawable(attr);
                    break;
                default:
                    break;
            }
        }
        a.recycle();

        setCompoundDrawablesWithIntrinsicBounds(drawableLeft, drawableTop, drawableRight, drawableBottom);

    }

    /**
     * RadioButton上、下、左、右設定圖示
     */
    public void setCompoundDrawablesWithIntrinsicBounds(Drawable left, Drawable top, Drawable right, Drawable bottom) {

        if (left != null) {
            left.setBounds(0, 0, mDrawableSize, mDrawableSize);
        }
        if (right != null) {
            right.setBounds(0, 0, mDrawableSize, mDrawableSize);
        }
        if (top != null) {
            top.setBounds(0, 0, mDrawableSize, mDrawableSize);
        }
        if (bottom != null) {
            bottom.setBounds(0, 0, mDrawableSize, mDrawableSize);
        }
        setCompoundDrawables(left, top, right, bottom);
    }

}

2.在style.xml檔案中加入

    <declare-styleable name="MyRadioButton">
        <attr name="drawableSize" format="dimension"/>
        <attr name="drawableTop" format="reference"/>
        <attr name="drawableLeft" format="reference"/>
        <attr name="drawableRight" format="reference"/>
        <attr name="drawableBottom" format="reference"/>
    </declare-styleable>

3.加入屬性引數,在values資料夾下新建attrs.xml檔案,並加入

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

    <declare-styleable name="MyRadioButton">
        <attr name="drawableSize" format="dimension"/>
        <attr name="drawableTop" format="reference"/>
        <attr name="drawableLeft" format="reference"/>
        <attr name="drawableRight" format="reference"/>
        <attr name="drawableBottom" format="reference"/>
    </declare-styleable>

</resources>

4.在佈局中引用

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:myradio="http://schemas.android.com/apk/res-auto"
    android:id="@+id/activity_main"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <FrameLayout
        android:id="@+id/content"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_weight="1" />

    <RadioGroup
        android:id="@+id/rg"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal">

        <com.example.yechaoa.radiobuttondemo.MyRadioButton  //這裡引用自己的包名加類名
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:background="@android:color/transparent" //設定背景為透明
            android:button="@null"
            android:clickable="true"                        //設定可點選
            android:drawablePadding="5dp"                   //設定圖片的padding
            android:gravity="center"
            android:text="首頁"
            myradio:drawableSize="30dp"                     //設定自定義的屬性,控制圖片大小
            myradio:drawableTop="@mipmap/ic_launcher" />    //設定資源

        <com.example.yechaoa.radiobuttondemo.MyRadioButton
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:background="@android:color/transparent"
            android:button="@null"
            android:clickable="true"
            android:drawablePadding="5dp"
            android:gravity="center"
            android:text="分類"
            myradio:drawableSize="30dp"
            myradio:drawableTop="@mipmap/ic_launcher" />

        <com.example.yechaoa.radiobuttondemo.MyRadioButton
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:background="@android:color/transparent"
            android:button="@null"
            android:clickable="true"
            android:drawablePadding="5dp"
            android:gravity="center"
            android:text="發現"
            myradio:drawableSize="50dp"
            myradio:drawableTop="@mipmap/ic_launcher" />

        <com.example.yechaoa.radiobuttondemo.MyRadioButton
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:background="@android:color/transparent"
            android:button="@null"
            android:clickable="true"
            android:drawablePadding="5dp"
            android:gravity="center"
            android:text="購物車"
            myradio:drawableSize="30dp"
            myradio:drawableTop="@mipmap/ic_launcher" />

        <com.example.yechaoa.radiobuttondemo.MyRadioButton
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:background="@android:color/transparent"
            android:button="@null"
            android:clickable="true"
            android:drawablePadding="5dp"
            android:gravity="center"
            android:text="個人中心"
            myradio:drawableSize="30dp"
            myradio:drawableTop="@mipmap/ic_launcher" />

    </RadioGroup>

</LinearLayout>