现在恰好有个项目需要做个轮播图效果，这个需求也是很常见的需求，于是就做个笔记写一下实现过程
分为加载本地图片和网络图片
加载本地图片
第一步：先在build.gradle中加入banner和glide的依赖
//banner依赖
implementation 'com.youth.banner:banner:1.4.9'
//Glide框架
implementation "com.github.bumptech.glide:glide:4.6.1"
第二步：xml布局
<com.youth.banner.Banner
android:id="@ id/banner"
android:layout_width="match_parent"
android:layout_height="300dp"
/>
第三步：MainActivity
public class MainActivity extends AppCompatActivity {
private Banner mBanner;
private LocalImageLoader mImageLoader;
private ArrayList<Integer> imagePath;
private ArrayList<String> imageTitle;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
intView();
intDate();
}
private void intDate() {
imagePath = new ArrayList<>();
imageTitle = new ArrayList<>();
imagePath.add(R.mipmap.ic_launcher);
imagePath.add(R.mipmap.ic_launcher);
imagePath.add(R.mipmap.ic_launcher);
imagePath.add(R.mipmap.ic_launcher);
imagePath.add(R.mipmap.ic_launcher);
imageTitle.add("第一");
imageTitle.add("第二");
imageTitle.add("第三");
imageTitle.add("第四");
imageTitle.add("第五");
}
private void intView() {
mImageLoader = new LocalImageLoader();
mBanner = findViewById(R.id.banner);
//样式
mBanner.setBannerStyle(BannerConfig.CIRCLE_INDICATOR_TITLE);
//加载器
mBanner.setImageLoader(mImageLoader);
//动画效果
mBanner.setBannerAnimation(Transformer.ZoomOutSlide);
//图片标题
mBanner.setBannerTitles(imageTitle);
//间隔时间
mBanner.setDelayTime(4500);
//是否为自动轮播
mBanner.isAutoPlay(true);
//图片小点显示所在位置
mBanner.setIndicatorGravity(BannerConfig.CENTER);
//图片加载地址
mBanner.setImages(imagePath);
//启动轮播图。
mBanner.start();
//监听轮播图
mBanner.setOnBannerListener(new OnBannerListener() {
@Override
public void OnBannerClick(int position) {
Toast.makeText(MainActivity.this, "点击了" (position 1) "张轮播图", Toast.LENGTH_SHORT).show();
}
});
}
/**
* 图片加载类
*/
private class LocalImageLoader extends ImageLoader {
@Override
public void displayImage(Context context, Object path, ImageView imageView) {
Glide.with(context.getApplicationContext())
.load(path)
.into(imageView);
}
}
}
加载网络图片
只要修改一下intDate(）和LocalImageLoader（）方法就好了
例如：
private void initData() {
list_path.add("https://image.baidu.com/search/detail?ct=503316480&z=0&ipn=d&word=哆啦A梦&step_word=&hs=0&pn=8&spn=0&di=118140&pi=0&rn=1&tn=baiduimagedetail&is=0,0&istype=0&ie=utf-8&oe=utf-8&in=&cl=2&lm=-1&st=undefined&cs=3835923757,1980937759&os=265876109,1976020808&simid=0,0&adpicid=0&lpn=0&ln=1495&fr=&fmq=1573545585312_R&fm=&ic=undefined&s=undefined&hd=undefined&latest=undefined©right=undefined&se=&sme=&tab=0&width=undefined&height=undefined&face=undefined&ist=&jit=&cg=&bdtype=0&oriquery=&objurl=http://img24.pplive.cn/cs180x240/2017/11/08/18331958489.jpg&fromurl=ippr_z2C$qAzdH3FAzdH3Fe_z&e3Brrpe_z&e3Bv54AzdH3Frw2jAzdH3Ftwtk9F2rHzdii0tkWE_z&e3Bip4s&gsm=&rpstart=0&rpnum=0&islist=&querylist=&force=undefined");
list_path.add("https://image.baidu.com/search/detail?ct=503316480&z=0&ipn=d&word=哆啦A梦&step_word=&hs=0&pn=8&spn=0&di=118140&pi=0&rn=1&tn=baiduimagedetail&is=0,0&istype=0&ie=utf-8&oe=utf-8&in=&cl=2&lm=-1&st=undefined&cs=3835923757,1980937759&os=265876109,1976020808&simid=0,0&adpicid=0&lpn=0&ln=1495&fr=&fmq=1573545585312_R&fm=&ic=undefined&s=undefined&hd=undefined&latest=undefined©right=undefined&se=&sme=&tab=0&width=undefined&height=undefined&face=undefined&ist=&jit=&cg=&bdtype=0&oriquery=&objurl=http://img24.pplive.cn/cs180x240/2017/11/08/18331958489.jpg&fromurl=ippr_z2C$qAzdH3FAzdH3Fe_z&e3Brrpe_z&e3Bv54AzdH3Frw2jAzdH3Ftwtk9F2rHzdii0tkWE_z&e3Bip4s&gsm=&rpstart=0&rpnum=0&islist=&querylist=&force=undefined");
list_path.add("https://image.baidu.com/search/detail?ct=503316480&z=0&ipn=d&word=哆啦A梦&step_word=&hs=0&pn=8&spn=0&di=118140&pi=0&rn=1&tn=baiduimagedetail&is=0,0&istype=0&ie=utf-8&oe=utf-8&in=&cl=2&lm=-1&st=undefined&cs=3835923757,1980937759&os=265876109,1976020808&simid=0,0&adpicid=0&lpn=0&ln=1495&fr=&fmq=1573545585312_R&fm=&ic=undefined&s=undefined&hd=undefined&latest=undefined©right=undefined&se=&sme=&tab=0&width=undefined&height=undefined&face=undefined&ist=&jit=&cg=&bdtype=0&oriquery=&objurl=http://img24.pplive.cn/cs180x240/2017/11/08/18331958489.jpg&fromurl=ippr_z2C$qAzdH3FAzdH3Fe_z&e3Brrpe_z&e3Bv54AzdH3Frw2jAzdH3Ftwtk9F2rHzdii0tkWE_z&e3Bip4s&gsm=&rpstart=0&rpnum=0&islist=&querylist=&force=undefined");
list_path.add("https://image.baidu.com/search/detail?ct=503316480&z=0&ipn=d&word=哆啦A梦&step_word=&hs=0&pn=8&spn=0&di=118140&pi=0&rn=1&tn=baiduimagedetail&is=0,0&istype=0&ie=utf-8&oe=utf-8&in=&cl=2&lm=-1&st=undefined&cs=3835923757,1980937759&os=265876109,1976020808&simid=0,0&adpicid=0&lpn=0&ln=1495&fr=&fmq=1573545585312_R&fm=&ic=undefined&s=undefined&hd=undefined&latest=undefined©right=undefined&se=&sme=&tab=0&width=undefined&height=undefined&face=undefined&ist=&jit=&cg=&bdtype=0&oriquery=&objurl=http://img24.pplive.cn/cs180x240/2017/11/08/18331958489.jpg&fromurl=ippr_z2C$qAzdH3FAzdH3Fe_z&e3Brrpe_z&e3Bv54AzdH3Frw2jAzdH3Ftwtk9F2rHzdii0tkWE_z&e3Bip4s&gsm=&rpstart=0&rpnum=0&islist=&querylist=&force=undefined");
list_path.add("https://image.baidu.com/search/detail?ct=503316480&z=0&ipn=d&word=哆啦A梦&step_word=&hs=0&pn=8&spn=0&di=118140&pi=0&rn=1&tn=baiduimagedetail&is=0,0&istype=0&ie=utf-8&oe=utf-8&in=&cl=2&lm=-1&st=undefined&cs=3835923757,1980937759&os=265876109,1976020808&simid=0,0&adpicid=0&lpn=0&ln=1495&fr=&fmq=1573545585312_R&fm=&ic=undefined&s=undefined&hd=undefined&latest=undefined©right=undefined&se=&sme=&tab=0&width=undefined&height=undefined&face=undefined&ist=&jit=&cg=&bdtype=0&oriquery=&objurl=http://img24.pplive.cn/cs180x240/2017/11/08/18331958489.jpg&fromurl=ippr_z2C$qAzdH3FAzdH3Fe_z&e3Brrpe_z&e3Bv54AzdH3Frw2jAzdH3Ftwtk9F2rHzdii0tkWE_z&e3Bip4s&gsm=&rpstart=0&rpnum=0&islist=&querylist=&force=undefined");
list_path.add("https://image.baidu.com/search/detail?ct=503316480&z=0&ipn=d&word=哆啦A梦&step_word=&hs=0&pn=8&spn=0&di=118140&pi=0&rn=1&tn=baiduimagedetail&is=0,0&istype=0&ie=utf-8&oe=utf-8&in=&cl=2&lm=-1&st=undefined&cs=3835923757,1980937759&os=265876109,1976020808&simid=0,0&adpicid=0&lpn=0&ln=1495&fr=&fmq=1573545585312_R&fm=&ic=undefined&s=undefined&hd=undefined&latest=undefined©right=undefined&se=&sme=&tab=0&width=undefined&height=undefined&face=undefined&ist=&jit=&cg=&bdtype=0&oriquery=&objurl=http://img24.pplive.cn/cs180x240/2017/11/08/18331958489.jpg&fromurl=ippr_z2C$qAzdH3FAzdH3Fe_z&e3Brrpe_z&e3Bv54AzdH3Frw2jAzdH3Ftwtk9F2rHzdii0tkWE_z&e3Bip4s&gsm=&rpstart=0&rpnum=0&islist=&querylist=&force=undefined");
list_title.add("哆啦A梦1");
list_title.add("哆啦A梦2");
list_title.add("哆啦A梦3");
list_title.add("哆啦A梦4");
list_title.add("哆啦A梦5");
list_title.add("哆啦A梦6");
}
private class LocalImageLoader extends ImageLoader {
@Override
public void displayImage(Context context, Object path, ImageView imageView) {
Glide.with(context.getApplicationContext())
.load((String) path)
.into(imageView);
}
}
下载网络图片的时候要记得添加网络权限
<uses-permission android:name="android.permission.INTERNET" />
补充。轮播图几种默认样式对比。。。PS：如果轮播图不想要title，就更改样式就好了
需要注意的是，如果设置有标题出现的样式，那么一定要设置setBannerTitles属性，不然会报错
样式一：CIRCLE_INDICATOR：无标题，有小圆点
//banner无标题样式 mBanner.setBannerStyle(BannerConfig.CIRCLE_INDICATOR);
效果图：
样式二：CIRCLE_INDICATOR_TITLE_INSIDE：小圆点和标题在同一栏
mBanner.setBannerStyle(BannerConfig.CIRCLE_INDICATOR_TITLE_INSIDE);
效果图
样式三：CIRCLE_INDICATOR_TITLE：标题和小圆点同时出现
mBanner.setBannerStyle(BannerConfig.CIRCLE_INDICATOR_TITLE);
效果图：
到此这篇关于Android Banner本地和网络轮播图使用介绍的文章就介绍到这了,更多相关Android本地和网络轮播图内容请搜索Devmax以前的文章或继续浏览下面的相关文章希望大家以后多多支持Devmax！