首页通知上下翻滚效果的实现

首先看下效果图，淘宝的首页通知和demo的对比。

实现思路：用平移动画效果，首先textview执行显示位置向上平移的动画，监听动画结束时，改变text，然后设置从底部向上平移到显示位置的动画，循环执行就行。
1.定义动画和通知类
view_out.xml从当前显示的位置上移的动画

<?xml version="1.0" encoding="utf-8"?>
<translate xmlns:android="http://schemas.android.com/apk/res/android"
    android:duration="300"
    android:fromYDelta="0%p"
    android:interpolator="@android:anim/linear_interpolator"
    android:toYDelta="-50%p" >
</translate>

view_in.xml从底部向上平移的动画

<?xml version="1.0" encoding="utf-8"?>
<translate xmlns:android="http://schemas.android.com/apk/res/android"
    android:duration="300"
    android:fromYDelta="0%p"
    android:interpolator="@android:anim/linear_interpolator"
    android:toYDelta="-50%p" >
</translate>

定义通知类Top，包括title和content，实际开发中一般通过解析接口数据获得

public class Top {
    private String title = "";
    private String content = "";
｝

2.布局文件 activity_main.xml,RoundTextView是自定义的带框的textview，由于动画相对的是父控件的位置，所以父控件要指定高度或者使用wrap_content。

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:liushen="http://schemas.android.com/apk/res-auto"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"

    >

    <LinearLayout
        android:id="@+id/layout"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content">

        <com.liushen.textviewscroll.view.RoundTextView
            android:id="@+id/title"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:paddingLeft="5dp"
            android:paddingRight="5dp"
            android:textColor="#ff0000" />

        <TextView
            android:id="@+id/content"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginLeft="10dp"
            />
    </LinearLayout>
</LinearLayout>

3.初始化数据，实际开发解析后台数据获得

private void initDate() {
    Top top1 = new Top("最新","111111111111111111111");
    Top top2 = new Top("置顶","22222222222222222222222222222");
    Top top3 = new Top("活动","333333333333333333333333333");
     ArrayList<Top> tops = new ArrayList<>();
    tops.add(top1);
    tops.add(top2);
    tops.add(top3);
    layout.setDate(tops);
}

4.定义Handler，监听view_out.xml动画执行完成后改变text，执行从底部向上的动画。

Handler handler = new Handler() {
    public void handleMessage(Message msg) {
        initAnim();
        animationOut.setAnimationListener(new Animation.AnimationListener() {

            @Override
            public void onAnimationStart(Animation animation) {
                // TODO Auto-generated method stub

            }

            @Override
            public void onAnimationRepeat(Animation animation) {
                // TODO Auto-generated method stub

            }

            @Override
            public void onAnimationEnd(Animation animation) {
                title.setText(tops.get(index).getTitle());
                content.setText(tops.get(index).getContent());
                layout.startAnimation(animationIn);
            }
        });
        layout.startAnimation(animationOut);

        super.handleMessage(msg);
    }
};

5.定义Thread循环调用

public class MyThread implements Runnable {
    @Override
    public void run() {
        // TODO Auto-generated method stub
        while (scroll) {
            try {
                Log.i("liushen","scroll");
                Thread.sleep(3000);
                if (index < tops.size()-1) {
                    index++;
                } else {
                    index = 0;
                }
                Message message = new Message();
                handler.sendMessage(message);
            } catch (InterruptedException e) {
                // TODO Auto-generated catch block
                e.printStackTrace();
            }
        }
    }
}

6.onResume方法开启线程，onPause方法结束线程，不然会一直循环调用。

@Override
protected void onResume() {
    scroll = true;
    new Thread(new MyThread()).start();
    super.onResume();
}

@Override
protected void onPause() {
    scroll = false;
    super.onPause();
}

demo另外有个自定义了LinearLayout，把实现逻辑写在里面，提供了setData方法，可以很方便的使用。

点击下载