效果类似网易新闻的新闻栏目切换时背景滑动效果
实现代码如下:
package com.example.viewpager;
import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.view.animation.Animation;
import android.view.animation.Animation.AnimationListener;
import android.view.animation.TranslateAnimation;
import android.widget.ImageView;
import android.widget.TextView;
public class Scroll extends Activity {
final int SUM = 6;
TextView[] mTVs;
ImageView[] mBGs;
int mPreClickID = 0;
int mCurClickID = 0;
@Override
public void onCreate(Bundle savedInstanceState){
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
initView();
}
public void initView(){
mTVs = new TextView[SUM];
mTVs[0] = (TextView) this.findViewById(R.id.text_btn1);
mTVs[1] = (TextView) this.findViewById(R.id.text_btn2);
mTVs[2] = (TextView) this.findViewById(R.id.text_btn3);
mTVs[3] = (TextView) this.findViewById(R.id.text_btn4);
mTVs[4] = (TextView) this.findViewById(R.id.text_btn5);
mTVs[5] = (TextView) this.findViewById(R.id.text_btn6);
mBGs = new ImageView[SUM];
mBGs[0] = (ImageView) this.findViewById(R.id.img_btn1);
mBGs[1] = (ImageView) this.findViewById(R.id.img_btn2);
mBGs[2]= (ImageView) this.findViewById(R.id.img_btn3);
mBGs[3]= (ImageView) this.findViewById(R.id.img_btn4);
mBGs[4]= (ImageView) this.findViewById(R.id.img_btn5);
mBGs[5]= (ImageView) this.findViewById(R.id.img_btn6);
for(int i = 0; i < SUM; i++){
mTVs[i].setOnClickListener(clickListener);
}
mTVs[0].setEnabled(false);
mPreClickID = 0;
}
private void updataCurView(int curClickID){
if(0 <= curClickID && SUM > curClickID){
mTVs[mPreClickID].setEnabled(true);
mTVs[curClickID].setEnabled(false);
mBGs[mPreClickID].setVisibility(View.INVISIBLE);
mBGs[curClickID].setVisibility(View.VISIBLE);
mPreClickID = curClickID;
}
}
private void startSlip(View v){
Animation a = new TranslateAnimation(0.0f, v.getLeft()-mTVs[mPreClickID].getLeft(), 0.0f, 0.0f);
a.setDuration(300);
a.setFillAfter(false);
a.setFillBefore(false);
for(int i = 0; i < SUM; i++)
{
if(mTVs[i] == v){
mCurClickID = i;
break;
}
}
a.setAnimationListener(new AnimationListener(){
public void onAnimationStart(Animation animation){
// TODO Auto-generated method stub
}
public void onAnimationEnd(Animation animation){
// TODO Auto-generated method stub
updataCurView(mCurClickID);
}
public void onAnimationRepeat(Animation animation){
// TODO Auto-generated method stub
}
});
mBGs[mPreClickID].startAnimation(a);
}
private View.OnClickListener clickListener = new View.OnClickListener(){
public void onClick(final View v){
startSlip(v);
}
};
}
布局文件的代码如下:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:umadsdk="http://schemas.android.com/apk/res/com.LoveBus"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical"
>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@drawable/news_top_bg">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/two_green_bg"
android:id="@+id/img_btn1"/>
<TextView
android:id="@+id/text_btn1"
android:layout_width="wrap_content"
android:layout_height="40dp"
android:padding="2dp"
android:textSize="6pt"
android:layout_marginLeft="-32dp"
android:layout_marginTop="-1dp"
android:text="头条"
android:gravity="center"/>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/two_green_bg"
android:id="@+id/img_btn2"
android:visibility="invisible"/>
<TextView
android:id="@+id/text_btn2"
android:layout_width="wrap_content"
android:layout_height="40dp"
android:layout_marginLeft="-32dp"
android:padding="2dp"
android:textSize="6pt"
android:gravity="center"
android:text="政策" />
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/two_green_b1g"
android:id="@+id/img_btn3"
android:visibility="invisible"/>
<TextView
android:id="@+id/text_btn3"
android:layout_width="wrap_content"
android:layout_height="40dp"
android:layout_marginLeft="-55dp"
android:padding="2dp"
android:textSize="6pt"
android:gravity="center"
android:text="地产金融" />
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/two_green_b1g"
android:id="@+id/img_btn4"
android:visibility="invisible"/>
<TextView
android:id="@+id/text_btn4"
android:layout_width="wrap_content"
android:layout_height="40dp"
android:layout_marginLeft="-55dp"
android:padding="2dp"
android:textSize="6pt"
android:gravity="center"
android:text="房企动态" />
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/two_green_b1g"
android:id="@+id/img_btn5"
android:visibility="invisible"
/>
<TextView
android:id="@+id/text_btn5"
android:layout_width="wrap_content"
android:layout_marginLeft="-55dp"
android:layout_height="40dp"
android:padding="2dp"
android:textSize="6pt"
android:gravity="center"
android:text="基金动态" />
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/two_green_b1g"
android:id="@+id/img_btn6"
android:visibility="invisible"/>
<TextView
android:id="@+id/text_btn6"
android:layout_width="wrap_content"
android:layout_height="40dp"
android:layout_marginLeft="-55dp"
android:padding="2dp"
android:textSize="6pt"
android:gravity="center"
android:text="保险信托"/>
</LinearLayout>
</LinearLayout>