2025年4月1日 星期二 乙巳(蛇)年 正月初二 设为首页 加入收藏
rss
您当前的位置:首页 > 计算机 > 编程开发 > 安卓(android)开发

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

时间:12-05来源:作者:点击数:19
CDSY,CDSY.XYZ

首先看下效果图,淘宝的首页通知和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方法,可以很方便的使用。

CDSY,CDSY.XYZ
方便获取更多学习、工作、生活信息请关注本站微信公众号城东书院 微信服务号城东书院 微信订阅号
推荐内容
相关内容
栏目更新
栏目热门
本栏推荐