GraphableButton類實現Android UI開發

從android 1.6開始，系統設置中的電池使用記錄提供了一種簡單的自繪Button按鈕演示-GraphableButton類，通過GraphableButton我們可以很清晰的了解到前幾次android123講到的UI開發要點。

public class GraphableButton extends Button { //從Button類繼承
private static final String TAG = "GraphableButton";

static Paint[] sPaint = new Paint[2]; //定義兩種顏色

static {
sPaint[0] = new Paint();
sPaint[0].setStyle(Paint.Style.FILL);
sPaint[0].setColor(0xFF0080FF);

sPaint[1] = new Paint();
sPaint[1].setStyle(Paint.Style.FILL);
sPaint[1].setColor(0xFFFF6060);
}

double[] mValues;

public GraphableButton(Context context, AttributeSet attrs) {
super(context, attrs);
}

public void setValues(double[] values, double maxValue) { //設置顯示范圍，下文提到
mValues = values.clone();
for (int i = 0; i < values.length; i++) {
mValues[i] /= maxValue;
}
}

@Override
public void onDraw(Canvas canvas) { //重寫onDraw直接繪制
Log.i(TAG, "onDraw: w = " + getWidth() + ", h = " + getHeight());

int xmin = getPaddingLeft();
int xmax = getWidth() - getPaddingRight();
int ymin = getPaddingTop();
int ymax = getHeight() - getPaddingBottom();

int startx = xmin;
for (int i = 0; i < mValues.length; i++) {
int endx = xmin + (int) (mValues[i] * (xmax - xmin));
canvas.drawRect(startx, ymin, endx, ymax, sPaint[i]); //通過canvas繪制范圍

// 該方法原型 drawRect(float left, float top, float right, float bottom, Paint paint)

startx = endx;
}
super.onDraw(canvas);
}
}

調用方法很簡單，和普通的Button沒有什麼區別，這裡我們僅僅多定義了setValues方法，android開發網提醒網喲注意布局文件XML中如何定義，在最下文

private GraphableButton mButtons;

mButtons = (GraphableButton) findVIEwById(R.id.button0);

mButtons.setOnClickListener(this); //設置一個按下事件監聽

mButtons.setVisibility(VIEw.INVISIBLE); //設置當前按鈕不可見

mButtons.setText("android123.com歡迎您");
mButtons.setValues(0,100);
mButtons.setVisibility(VIEw.VISIBLE); //設置按鈕可見

下面在layout.XML中如何寫呢，這裡要寫上自己程序完整的package name才能正確被adt識別，相關的具體定義如下:

<com.android123.cwjTest.GraphableButton
android:id="@+id/button7"
android:layout_width="fill_parent"
android:layout_height="0dp"
android:layout_marginLeft="4dp"
android:layout_marginRight="4dp"
android:layout_marginBottom="4dp"
android:layout_weight="1" />