Android标题水平滚动条点击后自动移动

如图：

测试的布局采用的HorizontalScrollView、RadioGroup和RadioButton组成，ImageView（下面的那个红线条）因为不考虑动态添加标题的个数。

布局文件如下，样式包含基本的控件属性和一个按下选中效果的状态，ImageView外面用的LinearLayout包裹，要不然会上面的RadioGroup里面的控件就都不能显示：

<?xml version="1.0" encoding="utf-8"?>
<HorizontalScrollView xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/test_horizescroll_view"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fadingEdge="@null"
    android:scrollbars="none" >

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical" >

        <RadioGroup
            android:id="@+id/test_horizescroll_radiogroup"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="10dp"
            android:background="@android:color/holo_green_dark"
            android:gravity="center_vertical"
            android:orientation="horizontal"
            android:paddingLeft="10dp"
            android:paddingRight="5dp" >

            <RadioButton
                style="@style/title_radiobutton_style"
                android:text="体育1" />

            <RadioButton
                style="@style/title_radiobutton_style"
                android:text="体育2" />

            <RadioButton
                style="@style/title_radiobutton_style"
                android:text="体育3" />

            <RadioButton
                style="@style/title_radiobutton_style"
                android:text="体育4" />

            <RadioButton
                style="@style/title_radiobutton_style"
                android:text="体育5" />

            <RadioButton
                style="@style/title_radiobutton_style"
                android:text="体育6" />

            <RadioButton
                style="@style/title_radiobutton_style"
                android:text="体育7" />

            <RadioButton
                style="@style/title_radiobutton_style"
                android:text="体育8" />
        </RadioGroup>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:orientation="vertical" >

            <ImageView
                android:id="@+id/test_horizescroll_bottom_imgview"
                android:layout_width="wrap_content"
                android:layout_height="4dp"
                android:layout_gravity="bottom"
                android:background="#B6192C" />
        </LinearLayout>
    </LinearLayout>

</HorizontalScrollView>

用RadioGroup主要是因为它的一个可以选中子类的方法：getChildAt（），然后就是蛋疼的实例化控件，代码如下：

public class TestActivity extends Activity{
	private ImageView mImageViewUnderLine;//下划线
	private int mCurrentCheckedRadioLeft;// 当前被选中的RadioButton距离左侧的距离
	private RadioGroup radioGroup;
	private HorizontalScrollView mHorizontalScrollView;// 上面的水平滚动控件
	
	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.pagehome_main_layout);
		inint();
	}

	/** 控件的实例 **/
	public void inint() {
		// 控件的实例
		mHorizontalScrollView = (HorizontalScrollView)findViewById(R.id.test_horizescroll_view);
		radioGroup = (RadioGroup)findViewById(R.id.test_horizescroll_radiogroup);
		mImageViewUnderLine = (ImageView)findViewById(R.id.test_horizescroll_bottom_imgview);

		// 默认选中第一个
		RadioButton radioBtnOne = (RadioButton) radioGroup.getChildAt(0);
		radioBtnOne.toggle();
		//初始化当前被选中的RadioButton距离左侧的距离
		mCurrentCheckedRadioLeft = radioBtnOne.getLeft();
		//计算红色下滑条的长度
		int ImgViewLineweight = (int) (radioBtnOne.getPaint().measureText(
				radioBtnOne.getText().toString())
				+ radioBtnOne.getPaddingLeft() + radioBtnOne.getPaddingRight() + radioGroup
				.getPaddingLeft());
		
		mImageViewUnderLine.setLayoutParams(new LinearLayout.LayoutParams(ImgViewLineweight, 4));
		//RadioGroup 子类的监听点击
		radioGroup.setOnCheckedChangeListener(new OnCheckedChangeListener() {
			@Override
			public void onCheckedChanged(RadioGroup arg0, int arg1) {
				//获得当前选中的的子类RadioButton
				int checkBtnId = radioGroup.getCheckedRadioButtonId();
				RadioButton radioBtn = (RadioButton)TestActivity.this.findViewById(checkBtnId);
				// 下滑条移动
				int leftSpace = radioBtn.getLeft();
				int rightSpace = radioBtn.getRight();
				//控制下滑条的移动和长度的计算
				imglineAnima(leftSpace, rightSpace);
			}
		});
	}

	/** 下滑条移动动画 */
	public void imglineAnima(int leftSpace, int rightSpace) {
		//点击过后重新计算当前被选中的RadioButton距离左侧的距离
		mCurrentCheckedRadioLeft = leftSpace;
		//水平滚动条的滚动距离：smoothScrollTo（宽度，高度）
		mHorizontalScrollView.smoothScrollTo((int) (mCurrentCheckedRadioLeft -100), 0);
		mImageViewUnderLine.setLayoutParams(new LinearLayout.LayoutParams(
				rightSpace - leftSpace, 4));
		// 下滑条移动效果就是移动动画
		AnimationSet animaSet = new AnimationSet(true);
		TranslateAnimation tranlateAnima = new TranslateAnimation(
				mCurrentCheckedRadioLeft, leftSpace, 0, 0);
		animaSet.setDuration(300);
		animaSet.setFillAfter(true);
		animaSet.setFillBefore(true);
		animaSet.addAnimation(tranlateAnima);
		mImageViewUnderLine.startAnimation(animaSet);
	}
}

其实主要就是背景条的动画移动和水平滚动条的移动距离计算。