android 自定义banner样式_Android Banner 实现自动轮播 ,小圆点标题

本文介绍了如何在Android应用中实现一个带有自动轮播和小圆点标题的自定义Banner。文章详细讲解了依赖引入、布局配置、代码实现以及轮播图监听方法,同时提供了Glide作为图片加载器的示例,并给出了混淆代码以确保Release版本的正常运行。
摘要由CSDN通过智能技术生成

Android Banner 现实自动轮播 ,小圆点 标题

效果图如上,这里用到的是更具体可以前往链接查看

添加banner依赖:

implementation 'com.youth.banner:banner:1.4.9'

implementation 'com.github.bumptech.glide:glide:3.7.0'

对应布局:

android:id="@+id/banner"

android:layout_width="wrap_content"

android:layout_height="@dimen/dp_180" />

下面来看具体的代码实现:

public class MainActivity extends AppCompatActivity implements OnBannerListener {

Banner banner;

private ArrayList list_path;//这里需要注意 标题和图片使用ArrayList的数组接收

private ArrayList list_title;//需要把数据遍历保存在string数组中

@Override

protected void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.activity_main);

banner = findViewById(R.id.banner);

initView();

}

private void initView() {

banner = (Banner) findViewById(R.id.banner);

//放图片地址的集合

list_path = new ArrayList<>();

//放标题的集合

list_title = new ArrayList<>();

list_path.add("http://ww4.sinaimg.cn/large/006uZZy8jw1faic21363tj30ci08ct96.jpg");

list_path.add("http://ww4.sinaimg.cn/large/006uZZy8jw1faic259ohaj30ci08c74r.jpg");

list_path.add("http://ww4.sinaimg.cn/large/006uZZy8jw1faic2b16zuj30ci08cwf4.jpg");

list_path.add("http://ww4.sinaimg.cn/large/006uZZy8jw1faic2e7vsaj30ci08cglz.jpg");

list_title.add("好好学习");

list_title.add("天天向上");

list_title.add("热爱劳动");

list_title.add("不搞对象");

//设置内置样式,共有六种可以点入方法内逐一体验使用。

banner.setBannerStyle(BannerConfig.CIRCLE_INDICATOR_TITLE_INSIDE);

//设置图片加载器,图片加载器在下方

banner.setImageLoader(new MyLoader());

//设置图片网址或地址的集合

banner.setImages(list_path);

//设置轮播的动画效果,内含多种特效,可点入方法内查找后内逐一体验

banner.setBannerAnimation(Transformer.Default);

//设置轮播图的标题集合

banner.setBannerTitles(list_title);

//设置轮播间隔时间

banner.setDelayTime(3000);

//设置是否为自动轮播,默认是“是”。

banner.isAutoPlay(true);

//设置指示器的位置,小点点,左中右。

banner.setIndicatorGravity(BannerConfig.CENTER)

//以上内容都可写成链式布局,这是轮播图的监听。比较重要。方法在下面。

.setOnBannerListener(this)

//必须最后调用的方法,启动轮播图。

.start();

}

//轮播图的监听方法 设置点击事件

@Override

public void OnBannerClick(int position) {

Log.i("tag", "你点了第" + position + "张轮播图");

}

//自定义的图片加载器

private class MyLoader extends ImageLoader {

@Override

public void displayImage(Context context, Object path, ImageView imageView) {

Glide.with(context).load((String) path).into(imageView);

}

}

还要加代码混淆,防止在release版本出现异常(正式环境报错)

# glide 的混淆代码

-keep public class * implements com.bumptech.glide.module.GlideModule

-keep public enum com.bumptech.glide.load.resource.bitmap.ImageHeaderParser$** {

**[] $VALUES;

public *;

}

# banner 的混淆代码

-keep class com.youth.banner.** {*;}

书到用时方恨少,纸上得来终觉浅。共勉。

本文地址:https://blog.csdn.net/qq_33721320/article/details/107761183

如您对本文有疑问或者有任何想说的,请点击进行留言回复,万千网友为您解惑!

  • 1
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
现在的APP Banner大多数千篇一律,前几天看到魅族手机上所有魅族自家APP上的Banner效果不错,于是就想着来仿着做一个类似的效果。因此就有了这个库。但是为了使用方便,这个库不仅仅只有仿魅族效果的BannerView 来使用,还可以当作普通的BannerView 来使用,还可以当作一个ViewPager 来使用。使用很方便,具体使用方法和API 请看后面的示例。 ---  左图为魅族APP上的Banner效果,右图是高仿效果。MZBannerView 有以下功能:1 . 仿魅族BannerView 效果。2 . 当普通Banner 使用3 . 当普通ViewPager 使用。4 . 当普通ViewPager使用(有魅族Banner效果)5 . 仿某视频网站Banner效果。Demo APKgif图片有点模糊,可以扫描下方二维码下载APK体验相关博客ViewPager系列之 仿魅族应用的广告BannerView更新日志v1.1.1 : 增加按住Banner 停止轮播,松开开始自动轮播的功能v1.1.0 : fix 在从网上获取数据后,banner 显示 造成 ANR 的bug(如果在onCreate()中设置资源显示则没问题)v1.1.2 : fix 更改数据之后,调用setPages重新刷新数据会crush的bugv2.0.0 :1,add: 添加仿魅族Banner效果,中间Page覆盖两边。 -- 2,fix 部分bug: 添加OnPageChangeListener 回调 pisition 不对的bug.DependencyAdd it in your root build.gradle at the end of repositories:allprojects {      repositories {           ...           maven { url 'https://jitpack.io' }      } }Step 2. Add the dependencydependencies {          compile 'com.github.pinguo-zhouwei:MZBannerView:v2.0.0' }自定义属性属性名属性意义取值open_mz_mode是否开启魅族模式true 为魅族Banner效果,false 则普通Banner效果canLoop是否轮播true 轮播,false 则为普通ViewPagerindicatorPaddingLeft设置指示器距离左侧的距离单位为 dp 的值indicatorPaddingRight设置指示器距离右侧的距离单位为 dp 的值indicatorAlign设置指示器的位置有三个取值:left 左边,center 剧中显示,right 右侧显示middle_page_cover设置中间Page是否覆盖(真正的魅族Banner效果)true 覆盖,false 无覆盖效果使用方法1 . xml 布局文件2 . activity中代码:mMZBanner = (MZBannerView) view.findViewById(R.id.banner);              // 设置数据         mMZBanner.setPages(list, new MZHolderCreator() {             @Override             public BannerViewHolder createViewHolder() {                 return new BannerViewHolder();             }         });  public static class BannerViewHolder implements MZViewHolder {         private ImageView mImageView;         @Override         public View createView(Context cont
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值