android 实现背景滑动效果

效果类似网易新闻的新闻栏目切换时背景滑动效果


 

实现代码如下：

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>