Android自定义Button组件

如何开发出一个漂亮的Buttton按钮，想必大家都迫不及待了。现在我来通过一个简单的过程说说这一过程。

首先查看一下Button类源码：

@RemoteView
public class Button extends TextView {
public Button(Context context) {
this(context, null);
}
public Button(Context context, AttributeSet attrs) {
this(context, attrs, com.android.internal.R.attr.buttonStyle);
}
public Button(Context context, AttributeSet attrs, int defStyle) {
super(context, attrs, defStyle);
}
}

大家发现没有，它继承了TextView类。只不过多了两个构造函数而已

我现在定义一个attrs.xml文件。这个文件的代码，如下所示：

<declare-styleable name="SmoothButton">
<attr name="transitionDrawable" format="reference" />
<attr name="transitionDrawableLength" format="integer" />
<attr name="transitionTextColorUp" format="color" />
<attr name="transitionTextColorDown" format="color" />
</declare-styleable>

然后实现这个SmoothButton类，如下所示：

public class SmoothButton extends Button {

private static final long DELAY = 25;
private LevelListDrawable transitionDrawable;
private int transitionDrawableLength;
private int level;
private int[] colors;
public SmoothButton(Context context, AttributeSet attrs) {
super(context, attrs);
TypedArray a = context.obtainStyledAttributes(attrs, R.styleable.SmoothButton);
transitionDrawable = (LevelListDrawable) a.getDrawable(R.styleable.SmoothButton_transitionDrawable);
transitionDrawableLength = a.getInt(R.styleable.SmoothButton_transitionDrawableLength, 0);
int useTextColors = 0;
int c0 = 0;
if (a.hasValue(R.styleable.SmoothButton_transitionTextColorUp)) {
c0 = a.getColor(R.styleable.SmoothButton_transitionTextColorUp, 0);
useTextColors++;
}
int c1 = 0;
if (useTextColors == 1 && a.hasValue(R.styleable.SmoothButton_transitionTextColorDown)) {
c1 = a.getColor(R.styleable.SmoothButton_transitionTextColorDown, 0);
useTextColors++;
}
a.recycle();
if (transitionDrawable == null) {
throw new RuntimeException("transitionDrawable must be defined in XML (with valid xmlns)");
}
if (transitionDrawableLength == 0) {
throw new RuntimeException("transitionDrawableLength must be defined in XML (with valid xmlns)");
}
if (useTextColors == 2) {
setTextColor(c0);
int a0 = Color.alpha(c0);
int r0 = Color.red(c0);
int g0 = Color.green(c0);
int b0 = Color.blue(c0);
int a1 = Color.alpha(c1);
int r1 = Color.red(c1);
int g1 = Color.green(c1);
int b1 = Color.blue(c1);
colors = new int[transitionDrawableLength];
for (int i=0; i<transitionDrawableLength; i++) {
int ai = a0 + i * (a1 - a0) / transitionDrawableLength;
int ri = r0 + i * (r1 - r0) / transitionDrawableLength;
int gi = g0 + i * (g1 - g0) / transitionDrawableLength;
int bi = b0 + i * (b1 - b0) / transitionDrawableLength;
colors[i] = Color.argb(ai, ri, gi, bi);
}
}
level = 0;
transitionDrawable.setLevel(level);
int paddingLeft = getPaddingLeft();
int paddingTop = getPaddingTop();
int paddingRight = getPaddingRight();
int paddingBottom = getPaddingBottom();
setBackgroundDrawable(transitionDrawable);
setPadding(paddingLeft, paddingTop, paddingRight, paddingBottom);
}
@Override
protected void drawableStateChanged() {
super.drawableStateChanged();
int delta = isPressed()? 1 : -1;
handler.removeMessages(-delta);
handler.sendEmptyMessage(delta);
}

private Handler handler = new Handler() {
@Override
public void handleMessage(Message msg) {
int what = msg.what;
level += what;
if (level >= 0 && level < transitionDrawableLength) {
transitionDrawable.setLevel(level);
if (colors != null) {
setTextColor(colors[level]);
}
handler.sendEmptyMessageDelayed(what, DELAY);
} else {
level = Math.max(0, level);
level = Math.min(transitionDrawableLength-1, level);
}
}
};

public void setTransitionDrawable(Drawable drawable, int length) {
transitionDrawable = (LevelListDrawable) drawable;
transitionDrawableLength = length;
level = 0;
invalidate();
}
}

里面有一个TypeArray类。这个类负责调用上面的attrs.xml中的配置属性。

并将这些属性添加到Button中。比如一些默认的属性。

然后在main.xml文件中定义这个自定义Button组件，代码如下所示：

<org.panel.SmoothButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:id="@+id/smoothButton2"
android:text="click me and see top panel..."
android:textStyle="bold"
panel:transitionDrawable="@drawable/transition_list"
panel:transitionDrawableLength="8"
panel:transitionTextColorUp="#eee"
panel:transitionTextColorDown="#aaa"
/>

这样就可以配置好了该Button组件，

接下来要在Activity子类中调用。如下所示：

findViewById(R.id.smoothButton1).setOnClickListener(new OnClickListener() {
public void onClick(View v) {
Log.d("hellow","heelow");
}
});

实现效果如下所示：