Android搜索栏之文字轮播控件TextBanner

相信大多数App都会有搜索这一功能，而搜索栏里会放置提示文字（热搜词，亦或个性化推荐）。当多个提示文字的时候，为了能“公平”的显示这些文字提示，就需要轮播切换显示这些文字。
虽然这个功能实现起来很简单，但是用的场景还是很多的，搜索栏文字提示，淘宝京东App首页的头条资讯。
闲话不多说，先看效果图：

text_banner.gif

Github传送门 biu biu biu ~~~

实现思路

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;
}

4. 动画交替View并设置数据（说明一下，currentPosition是用来记录显示的View数据所在的数据集合的位置）

/**
 * 动画替换下一个View
 */
private void updateTipAndPlayAnimation() {
    checkAdapterNotNull();
    if (mAdapter.getCount() == 0) {
        return;
    }
    currentPosition++;
    if (currentPosition % SIZE == 0) {
        bindViewData(viewFirst, currentPosition % mAdapter.getCount());
        startAnimation(viewFirst, viewSecond);
        this.bringChildToFront(viewSecond);
    } else {
        bindViewData(viewSecond, currentPosition % mAdapter.getCount());
        startAnimation(viewSecond, viewFirst);
        this.bringChildToFront(viewFirst);
    }
}

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上就好了：
Github传送门 biu biu biu ~~~

最后

如果你有什么意见和反馈，欢迎到Github提issue（最喜欢别人提issue了）哈哈哈~