Android--图片轮播(banner)
使用步骤
Step 1.依赖banner
Gradle
dependencies{
compile 'com.youth.banner:banner:1.4.10' //最新版本
}
或者引用本地lib
compile project(':banner')
Step 2.添加权限到你的 AndroidManifest.xml
<!-- if you want to load images from the internet -->
<uses-permission android:name="android.permission.INTERNET" />
<!-- if you want to load images from a file OR from the internet -->
<uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE" />
Step 3.在布局文件中添加Banner,可以设置自定义属性
!!!此步骤可以省略,直接在Activity或者Fragment中new Banner();
<com.youth.banner.Banner
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="@+id/banner"
android:layout_width="match_parent"
android:layout_height="高度自己设置" />
Step 4.重写图片加载器
public class GlideImageLoader extends ImageLoader {
@Override
public void displayImage(Context context, Object path, ImageView imageView) {
/**
注意:
1.图片加载器由自己选择,这里不限制,只是提供几种使用方法
2.返回的图片路径为Object类型,由于不能确定你到底使用的那种图片加载器,
传输的到的是什么格式,那么这种就使用Object接收和返回,你只需要强转成你传输的类型就行,
切记不要胡乱强转!
*/
eg:
//Glide 加载图片简单用法
Glide.with(context).load(path).into(imageView);
//Picasso 加载图片简单用法
Picasso.with(context).load(path).into(imageView);
//用fresco加载图片简单用法,记得要写下面的createImageView方法
Uri uri = Uri.parse((String) path);
imageView.setImageURI(uri);
}
//提供createImageView 方法,如果不用可以不重写这个方法,主要是方便自定义ImageView的创建
@Override
public ImageView createImageView(Context context) {
//使用fresco,需要创建它提供的ImageView,当然你也可以用自己自定义的具有图片加载功能的ImageView
SimpleDraweeView simpleDraweeView=new SimpleDraweeView(context);
return simpleDraweeView;
}
}
Step 5.在Activity或者Fragment中配置Banner
- 注意!start()方法必须放到最后执行,点击事件请放到start()前,每次都提交问题问为什么点击没有反应?需要轮播一圈才能点击?点击第一个怎么返回1?麻烦仔细阅读文档。
--------------------------简单使用-------------------------------
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
Banner banner = (Banner) findViewById(R.id.banner);
//设置图片加载器
banner.setImageLoader(new GlideImageLoader());
//设置图片集合
banner.setImages(images);
//banner设置方法全部调用完毕时最后调用
banner.start();
}
--------------------------详细使用-------------------------------
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
Banner banner = (Banner) findViewById(R.id.banner);
//设置banner样式
banner.setBannerStyle(BannerConfig.CIRCLE_INDICATOR_TITLE);
//设置图片加载器
banner.setImageLoader(new GlideImageLoader());
//设置图片集合
banner.setImages(images);
//设置banner动画效果
banner.setBannerAnimation(Transformer.DepthPage);
//设置标题集合(当banner样式有显示title时)
banner.setBannerTitles(titles);
//设置自动轮播,默认为true
banner.isAutoPlay(true);
//设置轮播时间
banner.setDelayTime(1500);
//设置指示器位置(当banner模式中有指示器时)
banner.setIndicatorGravity(BannerConfig.CENTER);
//banner设置方法全部调用完毕时最后调用
banner.start();
}
-----------------当然如果你想偷下懒也可以这么用--------------------
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
Banner banner = (Banner) findViewById(R.id.banner);
banner.setImages(images).setImageLoader(new GlideImageLoader()).start();
}
Step 6.(可选)增加体验
//如果你需要考虑更好的体验,可以这么操作
@Override
protected void onStart() {
super.onStart();
//开始轮播
banner.startAutoPlay();
}
@Override
protected void onStop() {
super.onStop();
//结束轮播
banner.stopAutoPlay();
}
混淆代码
# 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.** {
*;
}
Demo
MainActivity.java
import android.app.Activity;
import android.content.Context;
import android.os.Bundle;
import android.widget.ImageView;
import android.widget.Toast;
import com.bumptech.glide.Glide;
import com.youth.banner.Banner;
import com.youth.banner.BannerConfig;
import com.youth.banner.listener.OnBannerListener;
import com.youth.banner.loader.ImageLoader;
import java.util.ArrayList;
public class MainActivity extends Activity {
private Banner mBanner;
private ArrayList<String> images;
private ArrayList<String> imageTitle;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
mBanner = findViewById(R.id.banner);
//初始化数据
initData();
//初始化view
initView();
}
private void initView() {
mBanner = findViewById(R.id.banner);
//设置样式,默认为:Banner.NOT_INDICATOR(不显示指示器和标题)
//可选样式如下:
//1. Banner.CIRCLE_INDICATOR 显示圆形指示器
//2. Banner.NUM_INDICATOR 显示数字指示器
//3. Banner.NUM_INDICATOR_TITLE 显示数字指示器和标题
//4. Banner.CIRCLE_INDICATOR_TITLE 显示圆形指示器和标题
//设置banner样式
mBanner.setBannerStyle(BannerConfig.CIRCLE_INDICATOR_TITLE);
//设置图片加载器
mBanner.setImageLoader(new GlideImageLoader());
//设置标题集合(当banner样式有显示title时)
mBanner.setBannerTitles(imageTitle);
//设置轮播样式(没有标题默认为右边,有标题时默认左边)
//可选样式:
//Banner.LEFT 指示器居左
//Banner.CENTER 指示器居中
//Banner.RIGHT 指示器居右
mBanner.setIndicatorGravity(BannerConfig.CENTER);
//设置是否允许手动滑动轮播图
mBanner.setViewPagerIsScroll(true);
//设置是否自动轮播(不设置则默认自动)
mBanner.isAutoPlay(true);
//设置轮播图片间隔时间(不设置默认为2000)
mBanner.setDelayTime(1500);
//设置图片资源:可选图片网址/资源文件,默认用Glide加载,也可自定义图片的加载框架
//所有设置参数方法都放在此方法之前执行
mBanner.setIndicatorGravity(BannerConfig.CENTER);
mBanner.setImages(images)
.setOnBannerListener(new OnBannerListener() {
@Override
public void OnBannerClick(int position) {
Toast.makeText(MainActivity.this, "你点了第" + (position + 1) + "张轮播图", Toast.LENGTH_SHORT).show();
}
})
.start();
}
private void initData() {
//设置图片资源:url或本地资源
images = new ArrayList<>();
images.add("http://img.zcool.cn/community/0166c756e1427432f875520f7cc838.jpg");
images.add("http://img.zcool.cn/community/018fdb56e1428632f875520f7b67cb.jpg");
images.add("http://img.zcool.cn/community/01c8dc56e1428e6ac72531cbaa5f2c.jpg");
images.add("http://img.zcool.cn/community/01fda356640b706ac725b2c8b99b08.jpg");
images.add("http://img.zcool.cn/community/01fd2756e142716ac72531cbf8bbbf.jpg");
images.add("http://img.zcool.cn/community/0114a856640b6d32f87545731c076a.jpg");
//设置图片标题:自动对应
imageTitle = new ArrayList<>();
imageTitle.add("十大星级品牌联盟,全场2折起");
imageTitle.add("嗨购5折不要停");
imageTitle.add("双12趁现在");
imageTitle.add("嗨购5折不要停,12.12趁现在");
imageTitle.add("实打实大优惠");
imageTitle.add("买到就是赚到");
}
/**
* 网络加载图片
* 使用了Glide图片加载框架
*/
public class GlideImageLoader extends ImageLoader {
@Override
public void displayImage(Context context, Object path, ImageView imageView) {
Glide.with(context)
.load((String) path)
.into(imageView);
}
}
@Override
protected void onResume() {
super.onResume();
}
@Override
protected void onStop() {
super.onStop();
}
@Override
protected void onDestroy() {
super.onDestroy();
}
}
main_layout.xml
<com.youth.banner.Banner
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="@+id/banner"
android:layout_width="match_parent"
android:layout_height="300dp" />
Android--图片轮播(banner)的更多相关文章
- 一起写一个Android图片轮播控件
注:本文提到的Android轮播控件Demo地址: Android图片轮播控件 1. 轮播控件的组成部分 我们以知乎日报Android客户端的轮播控件为例,分析一下轮播控件的主要组成: 首先我们要有用 ...
- Android图片轮播控件
Android广告图片轮播控件,支持无限循环和多种主题,可以灵活设置轮播样式.动画.轮播和切换时间.位置.图片加载框架等! 使用步骤 Step 1.依赖banner Gradle dependenci ...
- Android——图片轮播
Android技术——轮播功能 轮播需要什么? 答:实现图片与广告语展示.循环播发以及手动切换.支持加载本地与网络图片. 性能优化? 答:多张图片与指示器展示.自动与定时.循环播发.滑动流畅并且无卡顿 ...
- Android 图片轮播(最简单的)
布局文件 <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android ...
- 【Android】android图片轮播
第一步,先写一个布局文件 <com.main.util.SlideShowView android:id="@+id/slideshowView" android:layou ...
- Android 开发最牛的图片轮播控件,基本什么都包含了。
Android图片轮播控件 源码下载地址: Android 图片轮播 现在的绝大数app都有banner界面,实现循环播放多个广告图片和手动滑动循环等功能.因为ViewPager并不支持循环翻页, ...
- Android开发(九)——ViewFlipper实现图片轮播
图片轮播的实现方法有很多,主要有View.ViewFilpper.ViewFilpper系统自带的一个多页面管理控件,它可以实现子界面的自动切换. 首先 需要为ViewFlipper加入View (1 ...
- android 使用图片轮播图---banner 使用
转自:https://github.com/youth5201314/banner 使用步骤 Step 1.依赖banner Gradle dependencies{ compile 'com.you ...
- Android——播放器和图片轮播
layout文件: <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:an ...
- Android学习笔记之图片轮播...
PS:一个bug又折腾了一个下午....哎... 学习内容: 1.Android利用ViewPager和PagerAdapter实现图片轮播... 2.使用反射机制获取Android的资源信息... ...
随机推荐
- 【Vue笔记】-- 详解vue生命周期
针对于Vue的生命周期进行详细的说明,方面加深对各个方法的引用. 引言: 前几天重新回顾vue官网时,看到vue的生命周期,想着自己用vue开发了快一年了,就总结总结vue知识,再次加深自己对vue的 ...
- C++STL模板库关联容器之set/multiset
目录 一丶关联容器简介.set/multiset 二丶演示代码. 一丶关联容器简介.set/multiset 我们的序列容器,底层都是线性表构成的. 比如 vector list deque. 关联容 ...
- Java——代码复用(组合和继承)
前言 "复用代码是Java众多引人注目的功能之一.但要想成为极具革命性的语言,仅仅能够复制代码并对之加以改变是不够的,它必须还能够做更多的事情." Java解决问题都围绕类展开的, ...
- 【野草】SQL Server之索引解析(二)
1.堆表 堆表通过IAM连接一起,查询时全表扫描. 1.1 非聚集索引 结构 叶子节点数据结构:行数据结构+Rid(8字节) 中间节点数据结构: (非聚集非唯一索引)行数据结构+Page(4)+2+ ...
- 一统江湖的大前端(2)—— Mock.js + Node.js 如何与后端潇洒分手
<一统江湖的大前端>系列是自己的前端学习笔记,旨在介绍javascript在非网页开发领域的应用案例和发现各类好玩的js库,不定期更新.如果你对前端的理解还是写写页面绑绑事件,那你真的是有 ...
- 20, CSS 定义选择器
1. ID 与类 2. 层叠 3. 分组 4. 继承 5. 上下文选择器 6. 子类选择器 7. 其他选择器 8. 结构与注释 20.1 ID 与类 选择器是用于控制页面设计的样式.即 ID 选择器何 ...
- Vue项目用了脚手架vue-cli3.0,会报错You are using the runtime-only build of Vue where the template compiler is not available.....
摘自: https://blog.csdn.net/wxl1555/article/details/83187647 报错信息如下图: 报错原因是:vue有两种形式的代码:一种是compiler(模版 ...
- 跨域iframe如何实现高度自适应?
经常有项目会要求实现iframe高度自适应,如果是同域的还好说,如果是跨域的,父页面没有办法操作子页面,想要正确获取子页面高度的话,可以采用以下办法: 方法一:使用HTML5 postMessage ...
- 一句话总结K均值算法
一句话总结K均值算法 核心:把样本分配到离它最近的类中心所属的类,类中心由属于这个类的所有样本确定. k均值算法是一种无监督的聚类算法.算法将每个样本分配到离它最近的那个类中心所代表的类,而类中心的确 ...
- iOS----------教你如何使用 GitHub Desktop
1.先创建一个工程项目Test 2.创建一个仓库Repository 3.提交到master(记得写标题) 4.推送到github上 5.创建仓库Respository成功