Movatterモバイル変換


[0]ホーム

URL:


Skip to content

Navigation Menu

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

Sign up

Android Viewpager rotation control, application guide page controls, support vertical, horizontal cycle scrolling, extended from view support animation, indicator extension and so on;Android viewpager轮播图控件、app引导页控件,支持垂直、水平循环滚动,扩展自viewpager 支持动画,指示器扩展等。

NotificationsYou must be signed in to change notification settings

ymex/banner

Repository files navigation

Download

banner

Android Viewpager rotation control, application guide page controls, support vertical, horizontal cycle scrolling, extended from view support animation, indicator extension and so on.

banner扩展自viewpager 支持动画,指示器扩展等。 可用于轮播图、app引导页。 其支持图片垂直、水平循环滚动。

简介

本库有两种banner组件可供使用, 分别是Banner组件 和RecyclerBanner组件。
Banner组件 基于ViewPager扩展。
RecyclerBanner组件基于RecyclerView扩展。RecyclerBanner在内存占用和帧率上占有一定优势,但动画效果不如Banner容易实现。

gradle 引入

compile 'cn.ymex:banner:1.6.8'

效果

1、app引导页控件

2、轮播图控件
gif
3、设置翻页动画
gif
4、自定义指示器
gif
5、垂直滚动
gif

6、Gallery 效果
png

7、指示器跟随移动

gif

相关属性及方法

banner 及 RecyclerBanner部分方法

方法解释
createView()创建banner 的布局
bindView()处理banner控件元素
execute()填充数据并展示
setOnClickBannerListener()点击事件
setOrientation()滚动方向
setIndicatorable()设置指示器
setPageTransformer()设置转换动画(RecyclerBanner 不支持)
setCurrentItem(int index)切换到指定页
getCurrentItem()当前页面索引

Banner及 RecyclerBanner属性

属性解释
banner_interval滚动间隔 (默认5000ms)
banner_auto_play自动播放 (默认true)
banner_loop循环滚动 (默认true)
banner_scroll是否可以手动滚动 (默认true)
banner_min_loop最小可以循环滚动的数量 (默认 1 v1.6.8)
banner_orientation滚动方向 horizontal(默认),vertical

IndicatorLayout属性

属性解释
indicator_widthindicator的宽,默认8dip
indicator_heightindicator的高,默认8dip
indicator_marginindicator的间距,默认4dip
indicator_selected选中图片或颜色
indicator_unselected未选中图片或颜色
indicator_shapeindicator的形状,circular(默认),rectangle
indicator_flow指示器是否随banner移动而滑动(RecyclerBanner 不支持),默认false
indicator_min_dot指示器最小显示数量 ,默认1。(v1.6.8+)
indicator_max_dot指示器最大显示数量,默认20。( v1.6.8+)

使用

banner基于viewpage 扩展,支持横向与纵向自动循环滚动。可用作 轮播图控件、app引导页控件。需要 appcompat-v7 和 recyclerview 扩展库支持,并引入banner lib.

1、在布局文件中加入控件,IndicatorLayout 是指示器布局,因 Banner 是一个FrameLayout,所以你可以随意定义其位置。
如果 不使用指示器移除它就可以了。当然你也可通过实现IndicatorAble接口去自定义 指示器(具体参看 IndicatorLayout)。

<cn.ymex.widget.banner.Banner    android:id="@+id/banner"    android:layout_width="match_parent"    android:layout_height="240dip"    android:background="@color/colorAccent"    app:banner_auto_play="true"    app:banner_interval="5000">    <cn.ymex.widget.banner.IndicatorLayout        android:layout_width="match_parent"        android:layout_height="wrap_content"        android:layout_gravity="bottom"        android:layout_marginBottom="8dip"        android:gravity="center"        app:indicator_height="8dip"        app:indicator_width="8dip" /></cn.ymex.widget.banner.Banner>

2、使用bindview加载图片资源到banner中,banner默认实现了基于AppCompatImageView的布局

banner.bindView(new Banner.BindViewCallBack<AppCompatImageView,BanneModel>() {    @Override    public void bindView(AppCompatImageView view, BanneModel data, int position) {        Glide.with(view.getContext())//使用Glide框架进行图片加载                .load(data.getUrl())                .into(view);    }}).setOnClickBannerListener(new OnClickBannerListener<View, BanneModel>() {              @Override              public void onClickBanner(View view, BanneModel data, int position) {//点击事件                  Toast.makeText(view.getContext(), "click position :" + position + "\n标题:" + data.getTitle(), Toast.LENGTH_SHORT).show();              }}).execute(data());

3.自定义banner page

banner.createView(new CreateViewCallBack() {    //创建布局    @Override    public View createView(Context context, ViewGroup parent, int viewType) {        View view = LayoutInflater.from(context).inflate(R.layout.custom_banner_page, null);        return view;    }}).bindView(new BindViewCallBack<View, BanneModel>() {    //布局处理    @Override    public void bindView(View view, BanneModel data, int position) {        ImageView imageView = view.findViewById(R.id.iv_image);        TextView tvTitle = view.findViewById(R.id.tv_title);        Glide.with(view.getContext()).load(data.getUrl()).into(imageView);        tvTitle.setText(data.getTitle());    }}).setOnClickBannerListener(new OnClickBannerListener<View, BanneModel>() {    //点击事件    @Override    public void onClickBanner(View view, BanneModel data, int position) {        Toast.makeText(view.getContext(), "click position :" + position + "\n标题:" + data.getTitle(), Toast.LENGTH_SHORT).show();    }}).execute(DateBox.banneModels());//填充数据

RecyclerBanner

RecyclerBanner是基于RecyclerView 扩展而来的banner 。对于大量的数据很有帮助。RecylerBanner 使用方法完全同Banner,但个别方法不支持,如动画切换的setPageTransformer()

注意事项

1.关于泛型的问题:

  • BindViewCallBack<V, T>()第一个泛型参数是CreateViewCallBack()返回类型,第二个泛型参数是你填充数据的类型。

  • OnClickBannerListener<V, T>() 同上。

  1. 使用glide 框架加载图片的异常,java.lang.IllegalArgumentException: You must not call setTag() on a view Glide is targeting

原因:如果 banner页布局只存在一个ImageView组件,banner 与 glide 都会去操作组件的setTag(),则glide会抛出异常。(banner v1.6.7版本以下的默认布局仅含有一个ImageView 组件,所以使用glide会有这个异常。v1.6.7已经重写了默认布局。)

解决方案:

方案一:设置glide 的ViewTarget.setTagId使用其使用非默认tag

//在你的Application的oncreate 中设置publicclassAppextendsApplication {@OverridepublicvoidonCreate() {super.onCreate();ViewTarget.setTagId(R.id.glide_tag);    }}//在资源文件(src/main/values/ids.xml,如果没有请新建)中加入 :<resources>    <itemtype="id"name="glide_tag" /></resources>

方案二:设置banner.createView(CreateViewCaller.build())(v1.6.7已经重写了默认布局。如果你使用v1.6.7+版本,将不会出现这个问题。)

banner.createView(CreateViewCaller.build())//v1.6.6 版本中提供 CreateViewCaller    .bindView(newBindViewCallBack<FrameLayout,BanneModel>() {@OverridepublicvoidbindView(FrameLayoutview,BanneModeldata,intposition) {//图片处理//使用glide 加载图片到 view组件,data 是你的数据 。ImageViewimageView =CreateViewCaller.findImageView(view);Glide.with(view.getContext()).load(data.getUrl()).into(imageView);        }    }).execute(DateBox.banneModels());//填充数据

版本

v1.6.8

  • 修复部分问题
  • 增加部分参数

v1.6.7

  • 默认布局替换为包裹ImageView布局
  • 循环滚动条目数量限制更改

v1.6.6

  • 增加默认包裹ImageView布局

v1.6.5

  • 增加指示器滑动效果,由indicator_flow 属性控制
  • 修复滚动状态下currentItem 位置
  • 修复RecyclerBanner bug
  • 增加Gallery效果事例

v1.6.2

  • 修复RecyclerBanner 回弹问题,
  • 修复指示器为颜色时无法显示。

v1.6.0

  • 修复getCurrentItem()位置异常
  • 修复IndicatorLayout使用图片时宽高失控
  • 增加默认指示器indicator_shape 属性
  • 重构部分方法

v1.5.0 ~

  • 重构Banner
  • 增加RecyclerBanner
  • banner coding

感谢:

License

Copyright 2017 ymex.cnLicensed under the Apache License, Version 2.0 (the "License");you may not use this file except in compliance with the License.You may obtain a copy of the License at   http://www.apache.org/licenses/LICENSE-2.0Unless required by applicable law or agreed to in writing, softwaredistributed under the License is distributed on an "AS IS" BASIS,WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.See the License for the specific language governing permissions andlimitations under the License.

About

Android Viewpager rotation control, application guide page controls, support vertical, horizontal cycle scrolling, extended from view support animation, indicator extension and so on;Android viewpager轮播图控件、app引导页控件,支持垂直、水平循环滚动,扩展自viewpager 支持动画,指示器扩展等。

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages


[8]ページ先頭

©2009-2025 Movatter.jp