经过分析，上述按钮效果实际上就是一个布局，一个最简单不过的垂直线性布局，上部分是一个ImageView，下部分是一个TextView，这个布局可点击、可设置监听。
我们首先要编写自己的ImageButton类，然后在主布局文件中为我们自定义的Button编写布局，最后在Activity中调用我们自定义ImageButton即可。
首先，我们编写一个MyImageButton类，继承自LinearLayout
package com.billhoo.study; import android.content.Context;
import android.widget.ImageView;
import android.widget.LinearLayout;
import android.widget.TextView; //自定义ImageButton，模拟ImageButton，并在其下方显示文字
//提供Button的部分接口
public class MyImageButton extends LinearLayout { public MyImageButton(Context context, int imageResId, int textResId) {
super(context); mButtonImage = new ImageView(context);
mButtonText = new TextView(context); setImageResource(imageResId);
mButtonImage.setPadding(, , , ); setText(textResId);
setTextColor(0xFF000000);
mButtonText.setPadding(, , , ); //设置本布局的属性
setClickable(true); //可点击
setFocusable(true); //可聚焦
setBackgroundResource(android.R.drawable.btn_default); //布局才用普通按钮的背景
setOrientation(LinearLayout.VERTICAL); //垂直布局 //首先添加Image，然后才添加Text
//添加顺序将会影响布局效果
addView(mButtonImage);
addView(mButtonText);
} // ----------------public method-----------------------------
/*
* setImageResource方法
*/
public void setImageResource(int resId) {
mButtonImage.setImageResource(resId);
} /*
* setText方法
*/
public void setText(int resId) {
mButtonText.setText(resId);
} public void setText(CharSequence buttonText) {
mButtonText.setText(buttonText);
} /*
* setTextColor方法
*/
public void setTextColor(int color) {
mButtonText.setTextColor(color);
} // ----------------private attribute-----------------------------
private ImageView mButtonImage = null;
private TextView mButtonText = null;
}
然后在main布局中为我们自定义的Button写xml布局，注意，我们的“按钮”实际上是一个线性布局，因此xml中应该写LinearLayout而不是Button或者ImageButton
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="fill_parent"
android:layout_height="fill_parent"> <!-- 这就是我们的“数据管理按钮” -->
<LinearLayout android:id="@+id/ll_bt_data_config"
android:layout_width="wrap_content" android:layout_height="wrap_content" /> </LinearLayout>
最后，在Activity中为我们自定义的按钮设置监听
package com.billhoo.study; import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import android.widget.LinearLayout; public class TestActivity extends Activity {
/** Called when the activity is first created. */
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main); btDataConfig = new MyImageButton(this, R.drawable.option, R.string.text); //获取包裹本按钮的容器
llbtDataConfig = (LinearLayout) findViewById(R.id.ll_bt_data_config); //将我们自定义的Button添加进这个容器
llbtDataConfig.addView(btDataConfig); //设置按钮的监听
btDataConfig.setOnClickListener(new Button.OnClickListener() {
@Override
public void onClick(View v) {
btDataConfig.setText("按钮被点击过了");
}
});
} private LinearLayout llbtDataConfig = null; //main布局中包裹本按钮的容器
private MyImageButton btDataConfig = null;
}
效果：
