先上效果图,选择不同的模块,滑动会通过动画形式滑过去,这种适合新闻客户端多种栏目的展示:
这么写Layout:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#ffffff" >
<include layout="@layout/title_layout" />
<RelativeLayout
android:id="@+id/column_navi"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="@drawable/top_column_bg" >
<ImageButton
android:id="@+id/column_to_left"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_centerVertical="true"
android:layout_marginLeft="5.0dp"
android:background="#00000000"
android:src="@drawable/arr_left"
android:visibility="visible" />
<ImageButton
android:id="@+id/column_to_right"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:layout_marginRight="5.0dp"
android:background="#00000000"
android:src="@drawable/arr_right"
android:visibility="visible" />
<HorizontalScrollView
android:id="@+id/column_scrollview"
android:layout_width="fill_parent"
android:layout_height="35.0dp"
android:layout_toLeftOf="@+id/column_to_right"
android:layout_toRightOf="@+id/column_to_left"
android:fadingEdge="vertical"
android:scrollbars="none" >
<FrameLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:paddingLeft="5.0dp"
android:paddingRight="5.0dp"
android:paddingTop="3.0dp" >
<ImageView
android:id="@+id/column_slide_bar"
android:layout_width="49.0dp"
android:layout_height="29.0dp" />
<span style="white-space:pre"> </span>//这个可以把子栏目都加到column_title_layout中
<LinearLayout
android:id="@+id/column_title_layout"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="horizontal"
android:layout_gravity="center_vertical" />
</FrameLayout>
</HorizontalScrollView>
</RelativeLayout>
</RelativeLayout>
代码中在string.xml中加入数据:
<string-array name="all_choice" translatable="false">
<item>科技</item>
<item>财经</item>
<item>体育</item>
<item>本地</item>
<item>最新</item>
<item>百家</item>
<item>娱乐</item>
</string-array>
private void initTab() {
String[] resource = this.getResources().getStringArray(R.array.all_choice);
for (int j = 0; j < resource.length; j++) {
String name = resource[j];
array.add(name);
}
this.columnTitleLayout.removeAllViews();
int j = this.array.size();
if (j <= 5) {
this.scrollToRight.setVisibility(View.INVISIBLE);
this.scrollToLeft.setVisibility(View.INVISIBLE);
}
currTabIndex = 0;
int i = 0;
animImage.setBackgroundResource(R.drawable.slidebar);
for (i = 0; i < array.size(); i++) {
String str = array.get(i);
TextView ColumnTextView = new TextView(this);
ColumnTextView.setText(str);
ColumnTextView.setTag(i);
ColumnTextView.setPadding(18, 2, 15, 4);
ColumnTextView.setOnClickListener(this);
ColumnTextView.setTextAppearance(this, R.style.column_tx_style);
LinearLayout.LayoutParams params = new LinearLayout.LayoutParams(LayoutParams.MATCH_PARENT, LayoutParams.MATCH_PARENT);
columnTitleLayout.addView(ColumnTextView, params);
}
TextView MoreColumnTextView = new TextView(this);
MoreColumnTextView.setTag(i);
CharSequence localCharSequence = getResources().getText(R.string.more_column);
MoreColumnTextView.setText(localCharSequence);
MoreColumnTextView.setPadding(18, 2, 15, 4);
MoreColumnTextView.setTextAppearance(this, R.style.column_tx_style);
LinearLayout.LayoutParams params = new LinearLayout.LayoutParams(LayoutParams.MATCH_PARENT, LayoutParams.MATCH_PARENT);
columnTitleLayout.addView(MoreColumnTextView, params);
}
在点击子栏目的时候启动动画:
@Override
<span style="white-space:pre"> </span>public void onClick(View v) {
<span style="white-space:pre"> </span>int k = (Integer)v.getTag();
<span style="white-space:pre"> </span>lastTabIndex = currTabIndex;
<span style="white-space:pre"> </span>currTabIndex = k;
<span style="white-space:pre"> </span>String text = ((TextView) v).getText().toString();
<span style="white-space:pre"> </span>if (lastTabIndex != currTabIndex) {
<span style="white-space:pre"> </span>if (currTabIndex == array.size()) {
<span style="white-space:pre"> </span>return;
<span style="white-space:pre"> </span>}
<span style="white-space:pre"> </span>showAnimation();
<span style="white-space:pre"> </span>}
<span style="white-space:pre"> </span>}
动画采用TranslateAnimation animation.setFillAfter(true);
private void showAnimation() {
if (lastTabIndex == currTabIndex) {
return;
}
((TextView) columnTitleLayout.getChildAt(lastTabIndex)).setTextColor(R.drawable.white);
int widgetItemWidth = ((TextView) columnTitleLayout.getChildAt(lastTabIndex)).getWidth();
int fromX = lastTabIndex * widgetItemWidth;
int toX = currTabIndex * widgetItemWidth;
Log.v("test", "widgetItemWidth" + widgetItemWidth + "fromX:" + fromX + " toX:" + toX);
TranslateAnimation animation = new TranslateAnimation(fromX, toX, 0, 0);
animation.setDuration(500);
animation.setFillAfter(true);
animation.setAnimationListener(new AnimationListener() {
@Override
public void onAnimationStart(Animation animation) {
((TextView) columnTitleLayout.getChildAt(lastTabIndex)).setTextColor(MainActivity.this.getResources().getColor(R.drawable.gray2));
}
@Override
public void onAnimationRepeat(Animation animation) {
}
@Override
public void onAnimationEnd(Animation animation) {
((TextView) columnTitleLayout.getChildAt(currTabIndex)).setTextColor(MainActivity.this.getResources().getColor(R.drawable.white));
lastTabIndex = currTabIndex;
}
});
animImage.startAnimation(animation);
}
代码可以在 http://download.csdn.net/detail/baidu_nod/7576663下载