Android搜索框中文字轮播控件TextBanner

image

闲话不多说，先看效果图：

image

实现思路

依赖： implementation 'com.haowen:textbanner:1.0.4'
1：想要达到轮播效果，两个View交替出现即可，既然是两个View那么就需要一个父容器（TextBanner继承FrameLayout）：

public class TextBanner extends FrameLayout {
/**
 * 两个View交替出现
 */
private View viewFirst, viewSecond;
}

2：间隔性就用Handler的postDelayed来实现就行了，为了防止内存泄漏，这里采用WeakHandler

   mHandler.postDelayed(task, mDelayTime);

/**
 * 轮播的定时任务：当页数大于1时轮播
 */
private Runnable task = new Runnable() {
@Override
public void run() {
    updateTipAndPlayAnimation();
    mHandler.postDelayed(this, mDelayTime);
}
};

3：交替出现的动画（TextBanner只用了一个简单的Y方向平移动画，并不支持动画设置，因为我觉得没必要花里胡哨的，如果后期有需要，可以考虑提示自定义）

 /**
 * 生成动画
 *
 * @param fromYValue 起始值
 * @param toYValue   结束值
 * @return 动画
 */
  private Animation newAnimation(float fromYValue, float toYValue) {
Animation anim = new TranslateAnimation(Animation.RELATIVE_TO_SELF, 0, Animation.RELATIVE_TO_SELF, 0,
        Animation.RELATIVE_TO_SELF, fromYValue, Animation.RELATIVE_TO_SELF, toYValue);
anim.setDuration(mDuration);
anim.setInterpolator(new DecelerateInterpolator());
return anim;
}

5：数据设置适配器，这里采用Adapter的形式（看方法名应该很好理解，似曾相识）:

onCreateView设置显示View
getCount数据个数
onBindViewData给View设置数据显示

notifyDataChange数据更新通知

 /**
 * 数据适配器
 */
 public abstract static class Adapter {

  /**
  * 数据更新观察这
   */
  private Observable mObservable;

  /**
 * 注册数据更新观察
 *
 * @param observable 数据更新观察
 */
 private void registerObservable(Observable observable) {
    this.mObservable = observable;
  }

  /**
 * 通知数据更新
 */
  public void notifyDataChange() {
  if (mObservable != null) {
      mObservable.onChange();
    }
  }

  /**
 * Item个数
 *
 * @return Item个数
 */
  public abstract int getCount();

  /**
 * View生成
 *
 * @param parent 父容器
 * @return Item的View
 */
  public abstract View onCreateView(@NonNull ViewGroup parent);

  /**
 * 数据绑定View
 *
 * @param convertView 内容View
 * @param position    位置
 */
public abstract void onBindViewData(@NonNull View convertView, int position);
  }

Github传送门 biu biu biu ~~~

最后编辑于：2019.07.20 08:42:37