整合大量开源库项目（五）跳动的TextView JumpingBeans,良好体验的滚动栏ConvenientBanner

转载请注明出处：王亟亟的大牛之路

时间过得很快，这一系列已经写了第五篇了（感觉还要写好久），今天又引入了2个很好用的库JumpingBeans,ConvenientBanner.首先，先看一下效果。

1.这2个控件做了什么？

JumpingBeans是加载页面时那个蓝色跳动的动画效果。
JumpingBeans:https://github.com/frakbot/JumpingBeans

ConvenientBanner是滚动的那个广告栏。
ConvenientBanner:https://github.com/saiwu-bigkoo/Android-ConvenientBanner

2.怎么下载？

  compile 'net.frakbot:jumpingbeans:1.3.0'
  compile 'com.bigkoo:convenientbanner:1.1.4'

3.为什么要用？
TextView之类的控件的跳动可以用动画实现，甚至可以拼接多个控件然后根据运算进行位置的模拟变化，但是JumpingBeans封装的更简单，很方便我们使用。

滚动的广告栏几乎在大多数的线上产品中都有出现（诸如ViewPager+Fragment），ConvenientBanner对本地/网络的情况都做了简单实用的处理，让我们省去了换算时间，监听注册一系列重复低效的操作。

接下来我们来说下如何使用

JumpingBeans

a.还是正常的一个TextView像这样：

  <TextView
      android:id="@+id/jumpTextView"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:layout_below="@+id/circleProgressBar"
      android:layout_centerHorizontal="true"
      android:layout_marginTop="20dp"
      android:text="加 载 中 。。"
      android:textColor="@color/DoderBlue"
      android:textSize="20dp" />

b.然后和往常一样findViewByIdjumpTextView = (TextView) findViewById(R.id.jumpTextView);

c.声明一个JumpingBeans 对象private JumpingBeans jumpingBeans;

d.然后对动画效果进行设置，我们来看一下怎么实现的
jumpingBeans = JumpingBeans.with(jumpTextView)
.makeTextJump(0, jumpTextView.getText().toString().indexOf(' '))
.setIsWave(true)
.setLoopDuration(800) // ms
.build();

e.把这个TextView绑定到JumpingBeans 中

  public static Builder with(@NonNull TextView textView) {
        return new Builder(textView);
    }

具体动作的哪几个字如传入(0,3)就是第1-第4个字有动画效果

   public Builder makeTextJump(int startPos, int endPos) {
            CharSequence text = textView.getText();
            ensureTextCanJump(startPos, endPos, text);

            this.text = text;
            this.wave = true;
            this.startPos = startPos;
            this.endPos = endPos;

            return this;
        }

对makeTextJump方法传入参数的检验，以保证不会start>end这种情况

    private static CharSequence ensureTextCanJump(int startPos, int endPos, CharSequence text) {
        if (text == null) {
            throw new NullPointerException("The textView text must not be null");
        }

        if (endPos < startPos) {
            throw new IllegalArgumentException("The start position must be smaller than the end position");
        }

        if (startPos < 0) {
            throw new IndexOutOfBoundsException("The start position must be non-negative");
        }

        if (endPos > text.length()) {
            throw new IndexOutOfBoundsException("The end position must be smaller than the text length");
        }
        return text;
    }

是否允许有动画

  public Builder setIsWave(boolean wave) {
            this.wave = wave;
            return this;
        }

效果持续的时间，毫秒为单位

public Builder setLoopDuration(int loopDuration) {
            if (loopDuration < 1) {
                throw new IllegalArgumentException("The loop duration must be bigger than zero");
            }
            this.loopDuration = loopDuration;
            return this;
        }

判断一系列参数，构建效果并执行（重新对TextView的字符串内容进行拼接）

   public JumpingBeans build() {
            SpannableStringBuilder sbb = new SpannableStringBuilder(text);
            JumpingBeansSpan[] spans;
            if (wave) {
                spans = getJumpingBeansSpans(sbb);
            } else {
                spans = buildSingleSpan(sbb);
            }

            textView.setText(sbb);
            return new JumpingBeans(spans, textView);
        }

f.结束时记得把开启的动画关了，不然内存泄漏你懂的，调用stopJumping（）

  public void stopJumping() {
        for (JumpingBeansSpan bean : jumpingBeans) {
            if (bean != null) {
                bean.teardown();
            }
        }

        cleanupSpansFrom(textView.get());
    }

使用起来 是不是很简单？

ConvenientBanner

a.先放一个控件，只需要一个哦！一般实现的方式需要布局的ViewPager fragment之类的还要标签点的imageview等等还是蛮麻烦的。

<com.bigkoo.convenientbanner.ConvenientBanner
       android:id="@+id/convenientBanner"
       android:layout_width="match_parent"
       android:layout_height="200dp"
       app:canLoop="true"/>

b.声明private ConvenientBanner convenientBanner;

c.获取控件convenientBanner = (ConvenientBanner) findViewById(R.id.convenientBanner);

d.对具体的内容进行设置：

//自定义你的Holder，实现更多复杂的界面，不一定是图片翻页，其他任何控件翻页亦可。
convenientBanner.setPages(
                new CBViewHolderCreator<LocalImageHolderView>() {
                    @Override
                    public LocalImageHolderView createHolder() {
                        return new LocalImageHolderView();
                    }
                }, localImages)
                //设置两个点图片作为翻页指示器，不设置则没有指示器，可以根据自己需求自行配合自己的指示器,不需要圆点指示器可用不设
                .setPageIndicator(new int[]{R.drawable.ic_page_indicator, R.drawable.ic_page_indicator_focused})
                //设置指示器的方向
                .setPageIndicatorAlign(ConvenientBanner.PageIndicatorAlign.ALIGN_PARENT_RIGHT)
                //设置翻页的效果，不需要翻页效果可用不设
                .setPageTransformer(Transformer.DefaultTransformer);
//        convenientBanner.setManualPageable(false);//设置不能手动影响

public class LocalImageHolderView implements CBPageAdapter.Holder<Integer>{
    private ImageView imageView;
    @Override
    public View createView(Context context) {
        imageView = new ImageView(context);
        imageView.setScaleType(ImageView.ScaleType.FIT_XY);
        return imageView;
    }

    @Override
    public void UpdateUI(Context context, final int position, Integer data) {
        imageView.setImageResource(data);
    }
}

https://github.com/saiwu-bigkoo/Android-ConvenientBanner有详细的Demo (并且，项目仍在维护当中，感谢作者https://github.com/saiwu-bigkoo)

Soyi项目代码地址：https://github.com/ddwhan0123/SoyiGit

观众老爷麻烦点个赞，谢谢你的支持