Android实现文字上下滚动效果

关于Android实现文字上下滚动这个功能,我目前有两种方法实现:

一个是在TextView 中加上翻转的动画效果,然后设置循环滚动;一种是改写ViewPager 的滚动方向,使它从下到上进行滚动,并设置循环滚动;

首先介绍第一种方法:

实现思路:自定义TextView,在TextView中加上从下到上滚动的动画效果,然后设置循环播放;

创建一个AutoTextVieW使之继承TextView,然后在onDraw方法中调用getHeight()方法获取textview当前的高度。
在接下来的动画翻转效果中,根据这个高度设置TextView上下滚动的距离。下面是动画实现的方法:

/**
 * 向上脱离屏幕的动画效果
 */
private void animationStart() {
  ObjectAnimator translate = ObjectAnimator.ofFloat(this, "translationY", 0, -height);
  ObjectAnimator alpha = ObjectAnimator.ofFloat(this, "alpha", 1f, 0f);
  mAnimStart = new AnimatorSet();
  mAnimStart.play(translate).with(alpha);
  mAnimStart.setDuration(DURATION);
  mAnimStart.addListener(this);

}

/**
 * 从屏幕下面向上的动画效果
 */
public void animationOver() {
  ObjectAnimator translate = ObjectAnimator.ofFloat(this, "translationY", height, 0);
  ObjectAnimator alpha = ObjectAnimator.ofFloat(this, "alpha", 0f, 1f);
  mAnimOver = new AnimatorSet();
  mAnimOver.play(translate).with(alpha);
  mAnimOver.setDuration(DURATION);

}

接下来实现ObjectAnimator的监听事件,在onAnimationEnd 调用setText方法,在动画没结束一次更新文字,并且继续执行动画效果

@Override
public void onAnimationEnd(Animator animator) {
  super.setText(mText);
  if (mAnimOver == null) {
    animationOver();

  }

  mAnimOver.start();
}

然后调用一个可以设置循环滚动的类,这里可以使用ScheduledExecutorService,也可以使用 Timer几设置计时滚动,在更新UI的时候,调用Handler方法更新;

因为采用Timer执行定时任务时只创建一个线程,所以这里建议采用ScheduledExecutorService;

/**
 * 获取数据并设置滚动播放
 * @param textView
 * @param list
 * @param autoPlayTime
 */
public void getTextData(final IdeaAutoTextview textView, List<String> list, int autoPlayTime) {
  this.textView = textView;
  this.textList = list;

  if (autoPlayTime != 0) {

    scheduledExecutorService = Executors.newSingleThreadScheduledExecutor();
    scheduledExecutorService.scheduleWithFixedDelay(new WeakTimerTask(this), autoPlayTime, autoPlayTime, TimeUnit.SECONDS);
  }
}

private TimeTaskHandler mHandler = new TimeTaskHandler(this);

private static class WeakTimerTask extends TimerTask {
  private WeakReference<IdeaAutoTextview> autoTextReference;

  public WeakTimerTask(IdeaAutoTextview mautoText) {
    this.autoTextReference = new WeakReference<>(mautoText);
  }

  @Override
  public void run() {
    IdeaAutoTextview autoText = autoTextReference.get();
    if (autoText != null) {
      if (autoText.isShown()) {
        autoText.mHandler.sendEmptyMessage(0);
      }
    } else {
      cancel();
    }
  }
}

定时刷新频率较高,容易产生内存泄漏,这里采用弱引用避免这个情况发生

private final class TimeTaskHandler extends Handler {
  private WeakReference<IdeaAutoTextview> autoTextReference;

  public TimeTaskHandler(IdeaAutoTextview autoText) {
    this.autoTextReference = new WeakReference<>(autoText);
  }

  @Override
  public void handleMessage(Message msg) {
    IdeaAutoTextview autoText = autoTextReference.get();

    if (autoText!=null)
    {
      /**
       * 设置当前文字
       */
      String text = textList.get(index);
      index++;
      if (index > textList.size() - 1) {
        index = 0;
      }
      textView.setAutoText(text);
    }

  }
}

到此第一种方法介绍完毕。

第二种方法实现的原理和轮播图的原理类似,轮播图一般是左右横向滚动,这里需要把ViewPager改成上下滑动,关于上下滑动的viewpager,可以在给github上找到;
其次轮播图中播放的是图片,把图片换成文字即可;
然后同样调用Timer或者ScheduledExecutorService使ViewPager自行滚动;
以下是代码:

package com.idea.idea.viewutils;

import android.content.Context;
import android.os.Handler;
import android.os.Message;
import android.support.v4.view.PagerAdapter;
import android.support.v4.view.ViewPager;
import android.util.AttributeSet;
import android.widget.RelativeLayout;

import java.lang.ref.WeakReference;
import java.util.TimerTask;
import java.util.concurrent.Executors;
import java.util.concurrent.ScheduledExecutorService;
import java.util.concurrent.TimeUnit;

/**
 * todo:修改ViewPager方法实现文字滚动
 *
 * @author: Create by qjj
 * @email: gxuqjj@163.com
 */
public class AutoViewpager extends RelativeLayout{

  private VerticalViewPager mVerticalViewPager;
  private PagerAdapter mAdapter;
  private int autoPlayTime;
  private ScheduledExecutorService scheduledExecutorService;

  public AutoViewpager(Context context){
    this(context,null);
  }

  public AutoViewpager(Context context, AttributeSet attrs) {
    this(context, attrs, 0);

  }

  public AutoViewpager(Context context, AttributeSet attrs, int defStyle) {
    super(context, attrs, defStyle);
    initView();
  }

  /**
   * 初始化view
   */
  private void initView(){
    if(mVerticalViewPager!=null){
      removeView(mVerticalViewPager);
    }
    mVerticalViewPager = new VerticalViewPager(getContext());
    mVerticalViewPager.setLayoutParams(new LayoutParams(LayoutParams.MATCH_PARENT, LayoutParams.MATCH_PARENT));
    addView(mVerticalViewPager);

  }

  private final static class TimeTaskHandler extends Handler {
    private WeakReference<AutoViewpager> mRollPagerViewWeakReference;

    public TimeTaskHandler(AutoViewpager autoViewpager) {
      this.mRollPagerViewWeakReference = new WeakReference<>(autoViewpager);
    }

    @Override
    public void handleMessage(Message msg) {
      AutoViewpager autoViewpager = mRollPagerViewWeakReference.get();
      int cur = autoViewpager.getViewPager().getCurrentItem()+1;
      if(cur>= autoViewpager.mAdapter.getCount()){
        cur=0;
      }
      autoViewpager.getViewPager().setCurrentItem(cur);

    }
  }
  private TimeTaskHandler mHandler = new TimeTaskHandler(this);

  private static class WeakTimerTask extends TimerTask {
    private WeakReference<AutoViewpager> mRollPagerViewWeakReference;

    public WeakTimerTask(AutoViewpager mAutoViewpager) {
      this.mRollPagerViewWeakReference = new WeakReference<>(mAutoViewpager);
    }

    @Override
    public void run() {
      AutoViewpager autoViewpager = mRollPagerViewWeakReference.get();
      if (autoViewpager !=null){
        if(autoViewpager.isShown()){
          autoViewpager.mHandler.sendEmptyMessage(0);
        }
      }else{
        cancel();
      }
    }
  }

  /**
   * 开始滚动
   */
  private void autoPlay(){
    if(autoPlayTime<=0||mAdapter == null||mAdapter.getCount()<=1){
      return;
    }

    scheduledExecutorService = Executors.newSingleThreadScheduledExecutor();
    scheduledExecutorService.scheduleWithFixedDelay(new WeakTimerTask(this), autoPlayTime, autoPlayTime, TimeUnit.SECONDS);
  }

  public void setAutoTime(int autoPlayTime){
    this.autoPlayTime = autoPlayTime;
    autoPlay();
  }

  /**
   * viewpager
   * @return
   */
  public ViewPager getViewPager() {
    return mVerticalViewPager;
  }

  /**
   * 设置Adapter
   * @param adapter
   */
  public void setAdapter(PagerAdapter adapter){
    mVerticalViewPager.setAdapter(adapter);
    mAdapter = adapter;
    dataChanged();
  }
  private void dataChanged(){
    autoPlay();
  }

}

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持我们。

(0)

相关推荐

  • Android实现文字滚动效果

    Android 实现文字滚动效果,自己写了个timer小计时器,textview文字上下翻动效果: public class AutoTextView extends TextSwitcher implements ViewSwitcher.ViewFactory { private float mHeight; private Context mContext; //mInUp,mOutUp分别构成向下翻页的进出动画 private Rotate3dAnimation mInUp; priva

  • Android实现文字上下滚动效果

    关于Android实现文字上下滚动这个功能,我目前有两种方法实现: 一个是在TextView 中加上翻转的动画效果,然后设置循环滚动:一种是改写ViewPager 的滚动方向,使它从下到上进行滚动,并设置循环滚动: 首先介绍第一种方法: 实现思路:自定义TextView,在TextView中加上从下到上滚动的动画效果,然后设置循环播放: 创建一个AutoTextVieW使之继承TextView,然后在onDraw方法中调用getHeight()方法获取textview当前的高度. 在接下来的动画

  • Android实现文字垂直滚动、纵向走马灯效果的实现方式汇总

    方法一.使用系统控件ViewFlipper方式: 布局文件: <ViewFlipper android:id="@+id/view_flipper" android:layout_width="300dp" android:layout_height="35dp" android:layout_centerInParent="true" android:autoStart="true" android

  • JS实现的新浪微博大厅文字内容滚动效果代码

    本文实例讲述了JS实现的新浪微博大厅文字内容滚动效果代码.分享给大家供大家参考,具体如下: 新浪微博大厅滚动tweets-slide,JavaScript实现,貌似这些天有不少朋友需要这功能,前几天已经发了几个了,不过今天发现这款竟然还要好,不敢独享,希望需要的朋友喜欢哦. 运行效果截图如下: 在线演示地址如下: http://demo.jb51.net/js/2015/js-sina-txt-scroll-tweets-slide-codes/ 具体代码如下: <!doctype html>

  • jQuery文字横向滚动效果的实现代码

    很多网站都有公告,并且都喜欢用横向滚动的方式来展现.最近自己用jQuery也写了文字横向滚动,实现了自定义滚动速度,鼠标经过时暂停的功能. HTML代码如下: <div id="s" style="width:100px; position:relative; white-space:nowrap; overflow:hidden; height:20px;"> <div id="noticeList" style="

  • javascript跟随鼠标的文字带滚动效果

    比较简单常用的跟随鼠标文字滚动效果 跟随鼠标的文字带滚动效果 var scroller_msg='欢迎进入我的站点' var dismissafter=0 var initialvisible=0 if (document.all) document.write(''+scroller_msg+'') function followcursor(){ //move cursor function for IE if (initialvisible==0){ curscroll.style.vis

  • Android TextView实现垂直滚动效果的方法

    本文实例讲述了Android TextView实现垂直滚动效果的方法.分享给大家供大家参考,具体如下: 在TextView中,如果文本很长,可能需要实现垂直滚动显示文本的效果.这里需要在XML布局文件中为TextView设置如下几个属性. Android:scrollbars="vertical" android:scrollbarStyle="X" 其中X为outsideOverlay或insideOverlay. android:scrollbarFadeDur

  • javascript实现文字无缝滚动效果

    本文实例为大家分享了文字无缝滚动效果,供大家参考,具体内容如下 html <dl id="marquee" class="marquee"> <dt> <ul class="right-content"> <li> <a href="#" rel="external nofollow" rel="external nofollow"

  • Vue替代marquee标签超出宽度文字横向滚动效果

    一.npm 安装 如果你想安装插件(自己写的) 安装 # install dependencies npm i marquee-components 使用 在main.js引入 import marquee from 'marquee-components' Vue.use(marquee ); 在页面使用 <template> <div id="app"> <marquee :val="msg"></marquee>

  • vue实现公告栏文字上下滚动效果的示例代码

    本文详细的介绍了vue实现公告栏文字上下滚动效果的示例代码,分享给大家,具体入如下: 代码实现: 在项目结构的components中新建text-scroll.vue文件 <template> <div class="text-container"> <transition class="" name="slide" mode="out-in"> <p class="text

  • Android使用ScrollView实现滚动效果

    本文实例为大家分享了ScrollView实现滚动效果的具体代码,供大家参考,具体内容如下 如果长文本的内容超过一屏幕 则只能显示一屏幕的内容 设置ScrollView 通过滚动浏览下面的内容 若将标签更改为<HorizontalScrollView></HorizontalScrollView>则为水平滚动效果 xml文件: <?xml version="1.0" encoding="utf-8"?> <android.su

随机推荐