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"); } });

 

 

实现效果如下所示：