Android中文字轮播控件TextBannerView控件的使用

Posted 2021-08-15 kaolagirl

现在的很多APP特别是类似淘宝京东等这些大型APP都有文字轮播界面，实现循环轮播多个广告词等功能；这种空间俗称“跑马灯”，而TextBannerView已经实现了可垂直跑、可水平跑的跑马灯了。

1.效果图

我这里的需求是在首页进行搜索关键字的轮播，上传不了动图，只能看个静图，如下：

2.控件属性和方法

1、属性

Attributes	describe
setInterval	文字切换时间间隔,默认3000
setAnimDuration	动画持续时间，默认1500
setTextSize	设置文字尺寸
setTextColor	设置文字颜色,默认黑色
setSingleLine	是否为显示单行
setGravity	文字显示位置,默认左边居中；可设置left、center、right
setDirection	文字轮播方向，默认水平从右到左轮播：right_to_left；还可以设置left_to_right（从左到右轮播）、bottom_to_top（从底部到顶部轮播）、top_to_bottom（从顶部到底部轮播）

2 、方法：

方法名	描述
setDatas(List datas)	设置数据
startViewAnimator()	设置开始文字切换（默认自动）
stopViewAnimator()	设置暂停文字切换
setItemOnClickListener(listener)	设置点击监听事件回调
setDatasWithDrawableIcon()	设置带图标的数据；第一个参数：数据 。第二参数：drawable. 第三参数drawable尺寸。第四参数图标位置(仅支持Gravity.LEFT、Gravity.TOP、Gravity.RIGHT、Gravity.BOTTOM)

3.使用步骤

1. 引入依赖

  //文字轮播控件
    implementation 'com.superluo:textbannerview:1.0.5'

2. 布局中使用TextBannerView

  <com.superluo.textbannerlibrary.TextBannerView
                android:id="@+id/tv_banner"
                android:visibility="gone"
                app:setInterval="1500"
                app:setDirection="top_to_bottom"
                app:setTextColor="@color/theme_defaultText"
                app:setTextSize="@dimen/default_size"
                android:background="@color/white"
                android:layout_width="wrap_content"
                android:layout_height="match_parent"/>

3…在Activity或者Fragment中配置TextBannerView

我这里是在Fragment中设置的

// 1.初始化TextBannerView
TextBannerView tv_banner = (TextBannerView) findViewById(R.id.tv_banner);
 
//2. 设置数据
List<String> promoList= new ArrayList<>();

 //我这里的data 是从后台获取到的
for(int i=0;i<data.length();i++){
    JSONObject item = data.getJSONObject(i);
    promoList.add(item.getString("keyword"));
  }
tv_banner.setDatas(promoList);
 
//调用setDatas(List<String>)方法后,TextBannerView自动开始轮播
//注意：此方法目前只接受List<String>类型

 
 // 2.
Drawable drawable = getResources().getDrawable(R.mipmap.ic_launcher);
/**这里可以设置带图标的数据（1.0.2新方法），比setDatas方法多了带图标参数；
第一个参数：数据 。
第二参数：drawable. 
第三参数:drawable尺寸。
第四参数:图标位置仅支持Gravity.LEFT、Gravity.TOP、Gravity.RIGHT、Gravity.BOTTOM
*/
mTvBanner.setDatasWithDrawableIcon(mList,drawable,18, Gravity.LEFT);
        
 
// 3. 设置TextBannerView点击监听事件，返回点击的data数据, 和position位置
 tv_banner.setItemOnClickListener(new ITextBannerItemClickListener() {
            @Override
            public void onItemClick(String data, int position) {
            //获取点击的数据，然后需要做的事情，根据情况而定，我这里是实现跳转
                intent = new Intent(Classify.this.getContext(), GoodSearch.class);
                intent.putExtra("promoKeyWord",promoList.get(position));
                startActivity(intent);
            }
        });


// 4.为了出现重影，还得在onResume和onStop中设置
 @Override
    public void onResume() {
        super.onResume();
        tv_banner.startViewAnimator(); //1.防止出现重影
    }

    @Override
    public void onStop() {
        super.onStop();
       tv_banner.stopViewAnimator();  //2.防止出现重影
    }