Android自定义Banner轮播效果
本文实例为大家分享了Android自定义Banner轮播效果展示的具体代码，供大家参考，具体内容如下
自定义View布局
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<android.support.v4.view.ViewPager
android:id="@+id/banner_view_pager"
android:layout_width="match_parent"
android:layout_height="200dp">
</android.support.v4.view.ViewPager>
<LinearLayout
android:id="@+id/linear_bannner"
android:layout_centerHorizontal="true"
android:layout_alignBottom="@+id/banner_view_pager"
android:layout_marginBottom="10dp"
android:orientation="horizontal"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
</LinearLayout>
</RelativeLayout>
自定义View主体内容
public class CustomBanner extends FrameLayout {
@BindView(R.id.banner_view_pager)
ViewPager bannerViewPager;
@BindView(R.id.linear_bannner)
LinearLayout linearBannner;
private List<String> list;
private int time = 2;
private Handler handler = new Handler() {
@Override
public void handleMessage(Message msg) {
if (msg.what == 0) {
int currentItem = bannerViewPager.getCurrentItem();
bannerViewPager.setCurrentItem(currentItem + 1);
//再次发送
sendEmptyMessageDelayed(0, time * 1000);
}
}
};
private List<ImageView> listDoc;
private OnClickLisner onClickLisner;
public CustomBanner(@NonNull Context context) {
super(context);
init();
}
public CustomBanner(@NonNull Context context, @Nullable AttributeSet attrs) {
super(context, attrs);
init();
}
public CustomBanner(@NonNull Context context, @Nullable AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
init();
}
/**
* 初始化
*/
private void init() {
View view = View.inflate(getContext(), R.layout.bannner_layout, this);
ButterKnife.bind(this, view);
}
/**
* 对外提供设置image路径的方法
*/
public void setImageUrls(List<String> list) {
this.list = list;
if (list == null) {
return;
}
//设置适配器
LunBoAdapter lunBoAdapter = new LunBoAdapter(getContext(), list);
bannerViewPager.setAdapter(lunBoAdapter);
initDoc();
//显示中间某个位置
bannerViewPager.setCurrentItem(list.size() * 10000);
//使用handler自动轮播
handler.sendEmptyMessageDelayed(0, time * 1000);
//状态改变的监听事件
bannerViewPager.addOnPageChangeListener(new ViewPager.OnPageChangeListener() {
@Override
public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
}
@Override
public void onPageSelected(int position) {
//在选中某一页的时候,切换小圆点的背景
for (int i = 0; i < listDoc.size(); i++) {
if (position % listDoc.size() == i) {
listDoc.get(i).setBackgroundResource(R.drawable.shape_01);
} else {
listDoc.get(i).setBackgroundResource(R.drawable.shape_02);
}
}
}
@Override
public void onPageScrollStateChanged(int state) {
}
});
}
/**
* 初始化小圆点
*/
private void initDoc() {
//创建一个集合,记录这些小圆点
listDoc = new ArrayList<>();
//清空布局
linearBannner.removeAllViews();
for (int i = 0; i < list.size(); i++) {
ImageView docImage = new ImageView(getContext());
if (i == 0) {
docImage.setBackgroundResource(R.drawable.shape_01);
} else {
docImage.setBackgroundResource(R.drawable.shape_02);
}
//添加到集合
listDoc.add(docImage);
//添加到线性布局
LinearLayout.LayoutParams params = new LinearLayout.LayoutParams(LinearLayout.LayoutParams.WRAP_CONTENT, LinearLayout.LayoutParams.WRAP_CONTENT);
params.setMargins(5, 0, 5, 0);
linearBannner.addView(docImage, params);
}
}
/**
* 对外提供轮播的时间
*/
public void setTimeSecond(int time) {
this.time = time;
}
/**
* 点击事件
*
* @param onClickLisner
*/
public void setClickListner(OnClickLisner onClickLisner) {
this.onClickLisner = onClickLisner;
}
private class LunBoAdapter extends PagerAdapter {
private List<String> list;
private Context context;
public LunBoAdapter(Context context, List<String> list) {
this.context = context;
this.list = list;
}
@Override
public int getCount() {
return Integer.MAX_VALUE;
}
@Override
public boolean isViewFromObject(View view, Object object) {
return view == object;
}
@Override
public Object instantiateItem(ViewGroup container, final int position) {
//创建imageView
ImageView imageView = new ImageView(context);
imageView.setScaleType(ImageView.ScaleType.FIT_XY);
//加载这张图片
Glide.with(context).load(list.get(position % list.size())).into(imageView);
//点击事件
imageView.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View view) {
//触发
onClickLisner.onItemClick(position % list.size());
}
});
//触摸事件
imageView.setOnTouchListener(new OnTouchListener() {
@Override
public boolean onTouch(View view, MotionEvent motionEvent) {
switch (motionEvent.getAction()) {
case MotionEvent.ACTION_DOWN:
//取消handler身上的消息和回调
handler.removeCallbacksAndMessages(null);
break;
case MotionEvent.ACTION_MOVE:
handler.removeCallbacksAndMessages(null);
break;
case MotionEvent.ACTION_CANCEL:
handler.sendEmptyMessageDelayed(0, time * 1000);
break;
case MotionEvent.ACTION_UP:
handler.sendEmptyMessageDelayed(0, time * 1000);
break;
}
return false;
}
});
//添加到容器
container.addView(imageView);
//返回
return imageView;
}
@Override
public void destroyItem(ViewGroup container, int position, Object object) {
container.removeView((View) object);
}
}
public interface OnClickLisner {
void onItemClick(int position);
}
}
自定义小圆点
public class CountView extends View implements View.OnClickListener {
private int count = 0;
public CountView(Context context) {
super(context);
init();
}
public CountView(Context context, @Nullable AttributeSet attrs) {
super(context, attrs);
init();
}
public CountView(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
init();
}
//初始化的方法
private void init() {
this.setOnClickListener(this);
}
@Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
Paint paint = new Paint();
paint.setColor(Color.RED);
paint.setAntiAlias(true);
paint.setStyle(Paint.Style.FILL);
//圆
canvas.drawCircle(300,300,200,paint);
paint.setColor(Color.BLACK);
paint.setTextSize(100);
String text = String.valueOf(count);
//拿到文本的宽度和高度
Rect rect = new Rect();
paint.getTextBounds(text,0,text.length(),rect);
canvas.drawText(text,300-rect.width()/2,300+rect.height()/2,paint);
}
@Override
public void onClick(View view) {
count ++;
//重新绘制
postInvalidate();
}
}
小圆点shape
<?xml version="1.0" encoding="utf-8"?> <shape xmlns:android="http://schemas.android.com/apk/res/android"> <solid android:color="#00ff00"/> <corners android:radius="10dp"/> <size android:height="10dp" android:width="10dp"/> </shape> <?xml version="1.0" encoding="utf-8"?> <shape xmlns:android="http://schemas.android.com/apk/res/android"> <solid android:color="#ff0000"/> <corners android:radius="10dp"/> <size android:height="10dp" android:width="10dp"/> </shape>
在Main中运行
public class MainActivity extends AppCompatActivity {
private CustomBanner customBanner;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
customBanner = findViewById(R.id.custom_banner);
getDataFromNet();
}
private void getDataFromNet() {
OkHttpUtil.doGet("https://www.zhaoapi.cn/ad/getAd", new Callback() {
private List<String> list;
@Override
public void onFailure(Call call, IOException e) {
}
@Override
public void onResponse(Call call, Response response) throws IOException {
if (response.isSuccessful()){
String json = response.body().string();
final HomeBean detalBean = new Gson().fromJson(json,HomeBean.class);
list = new ArrayList<>();
List<HomeBean.DataBean> data = detalBean.getData();
for (int i = 0; i < data.size(); i++) {
String icon = data.get(i).getIcon();
list.add(icon);
}
runOnUiThread(new Runnable() {
@Override
public void run() {
//设置时间
customBanner.setTimeSecond(5);
//设置显示轮播
customBanner.setImageUrls(list);
//banner的点击跳转详情页面的事件
banner.setOnBannerListener(new OnBannerListener() {
@Override
public void OnBannerClick(int position) {
List<ShouBean.DataBean> datab = shouBean.getData();
if (datab.get(position).getType() == 0) {
Intent intent = new Intent(getActivity(), WebViewActivity.class);
intent.putExtra("databurl", datab.get(position).getUrl());
startActivity(intent);
} else {
Toast.makeText(getContext(), "即将跳转到商品详情页面", Toast.LENGTH_SHORT).show();
}
}
});
}
});
}
}
});
}
}
WebView页面
public class WebViewActivity extends AppCompatActivity {
private WebView web_view;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_web_view);
web_view = findViewById(R.id.web_view);
String databurl = getIntent().getStringExtra("databurl");
web_view.loadUrl(databurl);
//webview一系列设置
web_view.setWebViewClient(new WebViewClient());//在当前应用打开,而不是去浏览器
WebSettings settings = web_view.getSettings();
settings.setJavaScriptEnabled(true);
settings.setJavaScriptCanOpenWindowsAutomatically(true);
}
}
以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持我们。
您可能感兴趣的文章:
- android实现banner轮播图无限轮播效果
- Android ViewPager实现无限循环轮播广告位Banner效果
- Android convinientbanner顶部广告轮播控件使用详解
- Android UI实现广告Banner轮播效果
- Android自动播放Banner图片轮播效果
- Android实现Banner界面广告图片循环轮播（包括实现手动滑动循环）
- Android实现图片轮播效果的两种方法
- Android实现图片轮播效果
- Android 使用ViewPager自动滚动循环轮播效果
- Android实现图片自动轮播并且支持手势左右无限滑动
相关推荐
-
Android convinientbanner顶部广告轮播控件使用详解
本文实例为大家分享了convinientbanner顶部广告轮播控件的具体代码,供大家参考,具体内容如下 gradle中添加 compile 'com.bigkoo:convenientbanner:2.0.5' 布局 <com.bigkoo.convenientbanner.ConvenientBanner xmlns:app="http://schemas.android.com/apk/res-auto" android:id="@+id/convenientBa
-
Android实现图片轮播效果
本文实例讲述了JaAndroid实现图片轮播效果代码,分享给大家供大家参考.具体如下: 运行效果截图如下: 具体代码如下: 首先看下一下布局文件: <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_par
-
Android实现Banner界面广告图片循环轮播（包括实现手动滑动循环）
前言:经常会看到有一些app的banner界面可以实现循环播放多个广告图片和手动滑动循环.本以为单纯的ViewPager就可以实现这些功能.但是蛋疼的事情来了,ViewPager并不支持循环翻页.所以要实现循环还得需要自己去动手.自己在网上也找了些例子,本博文的Demo是结合自己找到的一些相关例子的基础上去改造,也希望对读者有用. Demo实现的效果图如下: Demo代码: 工程目录如下图: 废话不多说,上代码. 1.主Activity代码如下: package com.stevenhu.and
-
Android实现图片轮播效果的两种方法
大家在使用APP的过程中,经常会看到上部banner图片轮播的效果,那么今天我们就一起来学习一下,android中图片轮询的几种实现方法: 第一种:使用动画的方法实现:(代码繁琐) 这种发放需要:两个动画效果,一个布局,一个主类来实现,不多说了,来看代码吧: public class IamgeTrActivity extends Activity { /** Called when the activity is first created. */ public ImageView image
-
Android实现图片自动轮播并且支持手势左右无限滑动
废话不多说了,先给大家上左右无限滑动的代码了. 1.左右无限滑动 public class MainActivity extends AppCompatActivity { private static ViewPager viewPager; private RadioGroup group; //图片资源,实际项目需要从网络获取 private int[] imageIds = {R.drawable.ym1, R.drawable.ym2, R.drawable.ym3, R.drawab
-
android实现banner轮播图无限轮播效果
本文实例为大家分享了banner轮播图无限轮播效果的具体代码,供大家参考,具体内容如下 效果展示 第一步(权限配置) <uses-permission android:name="android.permission.INTERNET" /> <uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" /> <uses-permission andr
-
Android自动播放Banner图片轮播效果
先看一下效果图 支持本地图片以及网络图片or本地网络混合. 使用方式: <com.jalen.autobanner.BannerView android:id="@+id/banner" android:layout_width="match_parent" android:layout_height="230dip"> </com.jalen.autobanner.BannerView> 核心代码: int length
-
Android ViewPager实现无限循环轮播广告位Banner效果
现在一些app通常会在头部放一个广告位,底部放置一行小圆圈指示器,指示广告位当前的页码,轮播展示一些图片,这些图片来自于网络.这个广告位banner是典型的android ViewPager实现,但是如果自己实现这样的ViewPager,要解决一系列琐碎的问题,比如: (1)这个广告位ViewPager要支持无限循环轮播,例如,有3张图片,A,B,C,当用户滑到最后C时候再滑就要滑到A,反之亦然. (2)ViewPager要实现自动播放,比如每个若干秒如2秒,自动切换播放到下一张图片. (3)通
-
Android 使用ViewPager自动滚动循环轮播效果
对Android 利用ViewPager实现图片可以左右循环滑动效果,感兴趣的朋友可以直接点击查看内容详情. 主要介绍如何实现ViewPager自动播放,循环滚动的效果及使用.顺便解决ViewPager嵌套(ViewPager inside ViewPager)影响触摸滑动及ViewPager滑动速度设置问题. 先给大家展示下效果图,喜欢的朋友可以下载源码: 1.实现 没有通过ScheduledExecutorService或Timer定期执行某个任务实现,而是简单的通过handler发送消息去
-
Android UI实现广告Banner轮播效果
本篇博客要分享的一个效果是实现广告Banner轮播效果,这个效果也比较常见,一些视频类应用就经常有,就拿360影视大全来举例吧: 用红框框住的那个效果就是小巫今天要分享的,先来思考一下会用到什么控件?有什么用户体验? 控件我们可能一下子就可以想到的自然是ViewPager,没错!用到的就是ViewPager,那么它会有什么用户体验呢,它可能有以下几个体验: 1. 间隔不停的切换图片,指示器也跟着变 2. 点击图片可以跳转到指定的页面 如何实现? 布局开始着手 /BannerAutoScrollD