原本想用Tabrow来布局一组上面是图片下面是文字说明的控件，但是发现Tabrow不像想象的那样简易，而且这几组之间的控件距离不好把握，在网上找了两种方法以供参照。
方法一、利用RadioButton巧妙的实现布局
<LinearLayoutandroid:layout_width="wrap_content"android:layout_height="wrap_content" android:layout_gravity="center"android:orientation="vertical"><RadioButtonandroid:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_gravity="center"android:button="@null"android:drawableTop="@drawable/vibrator48"android:text="测试" /><RadioButtonandroid:layout_width="wrap_content"android:layout_height="wrap_content"android:button="@null"android:drawableTop="@drawable/vibrator"android:text="测试" /></LinearLayout>
利用RadioButton的配置参数drawableTop实现文字和图片的布局，当然还可以用drawablepadding来设置图片和文字的距离。类似的控件还有TextView、ChexBox等。但是好像他对太大的图片时，下面的文字不能居中显示。
方法二、自定义控件
自定义控件是Android中玩得比较高级的一种思路，可以把布局做的很炫，但是实现起来自然会没有方法一那么方便。
1、写布局文件
写一个图片和文字框的布局文件image_text_button.xml.推荐调试时将资源文件写进去，方便布局调试。
<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="/apk/res/android"android:layout_width="fill_parent"android:layout_height="fill_parent"android:alpha="20"android:orientation="vertical"> <ImageViewandroid:id="@+id/img"android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_gravity="center"android:src="@drawable/vibrator"android:scaleType="centerInside"android:paddingBottom="2dip"/><TextView android:id="@+id/text"android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_gravity="center"android:text="测试"/></LinearLayout>
2、对应布局文件写一个类
写一个对应布局文件的类，这个类继承LinearLayout的ImageTextButton.java
package com.example.test;import android.content.Context; import android.util.AttributeSet; import android.view.LayoutInflater; import android.widget.ImageView; import android.widget.LinearLayout; import android.widget.TextView; public class ImageTextButton extends LinearLayout { private ImageView mImgView = null; private TextView mTextView = null; private Context mContext; public ImageTextButton(Context context, AttributeSet attrs) { super(context, attrs); LayoutInflater.from(context).inflate(R.layout.image_text_button, this, true); mContext = context; mImgView = (ImageView)findViewById(R.id.img); mTextView = (TextView)findViewById(R.id.text);} /*设置图片接口*/ public void setImageResource(int resId){ mImgView.setImageResource(resId); } /*设置文字接口*/ public void setText(String str){ mTextView.setText(str); } /*设置文字大小*/ public void setTextSize(float size){ mTextView.setTextSize(size); } }
3、将自定义控件应用到布局文件中
<LinearLayoutandroid:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_gravity="center"android:orientation="horizontal" ><com.example.test.ImageTextButtonandroid:id="@+id/itbTest"android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_gravity="center_horizontal" /><com.example.test.ImageTextButtonandroid:id="@+id/itbTest"android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_gravity="center_horizontal" /><com.example.test.ImageTextButtonandroid:id="@+id/itbTest"android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_gravity="center_horizontal" /></LinearLayout>
4、在Activity引用自定义控件
public class MainActivity extends Activity implements OnClickListener{ImageView imageView;Animation animation;private long speed = 1200;private ImageTextButton itbTest;@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_main);Log.i("jobschu", "onCreate");itbTest = (ImageTextButton)findViewById(R.id.itbTest);itbTest.setImageResource(R.drawable.vibrator);itbTest.setText("测试");itbTest.setTextSize(10);itbTest.setOnClickListener(this);}}
