Android 最新左右可见上下页的banner实现demo
运行效果，可见上下页样式
demo链接：https://download.****.net/download/meixi_android/11045703
实现方法
首先添加必要依赖
implementation ('com.android.support:recyclerview-v7:27.0.2'){
force = true
}
implementation ('com.android.support:cardview-v7:27.0.2'){
force = true
}
implementation 'com.github.bumptech.glide:glide:3.6.1'
1、创建自定义banner类
public class BannerLayout extends FrameLayout {
private int autoPlayDuration;//刷新间隔时间
private boolean showIndicator;//是否显示指示器
private RecyclerView indicatorContainer;
private Drawable mSelectedDrawable;
private Drawable mUnselectedDrawable;
private IndicatorAdapter indicatorAdapter;
private int indicatorMargin;//指示器间距
private RecyclerView mRecyclerView;
private BannerLayoutManager mLayoutManager;
private int WHAT_AUTO_PLAY = 1000;
private boolean hasInit;
private int bannerSize = 1;
private int currentIndex;
private boolean isPlaying = false;
private boolean isAutoPlaying = true;
int itemSpace;
float centerScale;
float moveSpeed;
protected Handler mHandler = new Handler(new Handler.Callback() {
@Override
public boolean handleMessage(Message msg) {
if (msg.what == WHAT_AUTO_PLAY) {
if (currentIndex == mLayoutManager.getCurrentPosition()) {
++currentIndex;
mRecyclerView.smoothScrollToPosition(currentIndex);
mHandler.sendEmptyMessageDelayed(WHAT_AUTO_PLAY, autoPlayDuration);
refreshIndicator();
}
}
return false;
}
});
public BannerLayout(Context context) {
this(context, null);
}
public BannerLayout(Context context, AttributeSet attrs) {
this(context, attrs, 0);
}
public BannerLayout(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
initView(context, attrs);
}
protected void initView(Context context, AttributeSet attrs) {
TypedArray a = context.obtainStyledAttributes(attrs, R.styleable.BannerLayout);
showIndicator = a.getBoolean(R.styleable.BannerLayout_showIndicator, true);
autoPlayDuration = a.getInt(R.styleable.BannerLayout_interval, 4000);
isAutoPlaying = a.getBoolean(R.styleable.BannerLayout_autoPlaying, true);
itemSpace = a.getInt(R.styleable.BannerLayout_itemSpace, 20);
centerScale = a.getFloat(R.styleable.BannerLayout_centerScale, 1.2f);
moveSpeed = a.getFloat(R.styleable.BannerLayout_moveSpeed, 1.0f);
if (mSelectedDrawable == null) {
//绘制默认选中状态图形
GradientDrawable selectedGradientDrawable = new GradientDrawable();
selectedGradientDrawable.setShape(GradientDrawable.OVAL);
selectedGradientDrawable.setColor(Color.GREEN);
selectedGradientDrawable.setSize(dp2px(5), dp2px(5));
selectedGradientDrawable.setCornerRadius(dp2px(5) / 2);
mSelectedDrawable = new LayerDrawable(new Drawable[]{selectedGradientDrawable});
}
if (mUnselectedDrawable == null) {
//绘制默认未选中状态图形
GradientDrawable unSelectedGradientDrawable = new GradientDrawable();
unSelectedGradientDrawable.setShape(GradientDrawable.OVAL);
unSelectedGradientDrawable.setColor(Color.GRAY);
unSelectedGradientDrawable.setSize(dp2px(5), dp2px(5));
unSelectedGradientDrawable.setCornerRadius(dp2px(5) / 2);
mUnselectedDrawable = new LayerDrawable(new Drawable[]{unSelectedGradientDrawable});
}
indicatorMargin = dp2px(4);
int marginLeft = dp2px(16);
int marginRight = dp2px(0);
int marginBottom = dp2px(11);
int gravity = GravityCompat.START;
int o = a.getInt(R.styleable.BannerLayout_orientation, 0);
int orientation = 0;
if (o == 0) {
orientation = OrientationHelper.HORIZONTAL;
} else if (o == 1) {
orientation = OrientationHelper.VERTICAL;
}
a.recycle();
//轮播图部分
mRecyclerView = new RecyclerView(context);
LayoutParams vpLayoutParams = new LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT,
ViewGroup.LayoutParams.MATCH_PARENT);
addView(mRecyclerView, vpLayoutParams);
mLayoutManager = new BannerLayoutManager(getContext(), orientation);
mLayoutManager.setItemSpace(itemSpace);
mLayoutManager.setCenterScale(centerScale);
mLayoutManager.setMoveSpeed(moveSpeed);
mRecyclerView.setLayoutManager(mLayoutManager);
new CenterSnapHelper().attachToRecyclerView(mRecyclerView);
//指示器部分
indicatorContainer = new RecyclerView(context);
LinearLayoutManager indicatorLayoutManager = new LinearLayoutManager(context, orientation, false);
indicatorContainer.setLayoutManager(indicatorLayoutManager);
indicatorAdapter = new IndicatorAdapter();
indicatorContainer.setAdapter(indicatorAdapter);
LayoutParams params = new LayoutParams(ViewGroup.LayoutParams.WRAP_CONTENT,
ViewGroup.LayoutParams.WRAP_CONTENT);
params.gravity = Gravity.BOTTOM | gravity;
params.setMargins(marginLeft, 0, marginRight, marginBottom);
addView(indicatorContainer, params);
if (!showIndicator) {
indicatorContainer.setVisibility(GONE);
}
}
3、activity代码
public class MainActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
BannerLayout recyclerBanner = findViewById(R.id.recycler);
List<String> list = new ArrayList<>();
list.add("http://ww1.sinaimg.cn/large/b7cd25cagw1f55lgujsvuj20qo0z1n2o.jpg");
list.add("http://b-ssl.duitang.com/uploads/item/201802/13/20180213092931_vlmdh.jpg");
list.add("http://p2.qhimgs4.com/t010eb5908d6f28cf14.jpg");
list.add("http://b-ssl.duitang.com/uploads/item/201802/13/20180213124050_gkhxt.jpg");
list.add("http://dingyue.nosdn.127.net/3tqSsnfhfRRea6kZVlS0reiWcPFx9SR1jJ=cHkyEJLREO1530066845542compressflag.jpg");
list.add("http://b-ssl.duitang.com/uploads/item/201802/13/20180213123947_cdkha.jpg");
WebBannerAdapter webBannerAdapter=new WebBannerAdapter(this,list);
webBannerAdapter.setOnBannerItemClickListener(new BannerLayout.OnBannerItemClickListener() {
@Override
public void onItemClick(int position) {
Toast.makeText(MainActivity.this, "点击了第 " + position+" 项", Toast.LENGTH_SHORT).show();
}
});
recyclerBanner.setAdapter(webBannerAdapter);
}
}
activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
tools:context=".MainActivity">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Hello World!"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<com.example.library.banner.BannerLayout
android:id="@+id/recycler"
android:layout_width="match_parent"
android:layout_height="200dp"
app:autoPlaying="true"
app:centerScale="1.3"
app:itemSpace="20"
app:moveSpeed="1.8"/>
</LinearLayout>adapter类
public class WebBannerAdapter extends RecyclerView.Adapter<WebBannerAdapter.MzViewHolder> {
private Context context;
private List<String> urlList;
private BannerLayout.OnBannerItemClickListener onBannerItemClickListener;
public WebBannerAdapter(Context context, List<String> urlList) {
this.context = context;
this.urlList = urlList;
}
public void setOnBannerItemClickListener(BannerLayout.OnBannerItemClickListener onBannerItemClickListener) {
this.onBannerItemClickListener = onBannerItemClickListener;
}
@Override
public WebBannerAdapter.MzViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
return new MzViewHolder(LayoutInflater.from(parent.getContext()).inflate(R.layout.item_image, parent, false));
}
@Override
public void onBindViewHolder(WebBannerAdapter.MzViewHolder holder, final int position) {
if (urlList == null || urlList.isEmpty())
return;
final int P = position % urlList.size();
String url = urlList.get(P);
ImageView img = (ImageView) holder.imageView;
Glide.with(context).load(url).into(img);
holder.textView.setText(urlList.get(position));
img.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
if (onBannerItemClickListener != null) {
onBannerItemClickListener.onItemClick(P);
}
}
});
}
@Override
public int getItemCount() {
if (urlList != null) {
return urlList.size();
}
return 0;
}
class MzViewHolder extends RecyclerView.ViewHolder {
ImageView imageView;
TextView textView;
MzViewHolder(View itemView) {
super(itemView);
imageView = (ImageView) itemView.findViewById(R.id.image);
textView = (TextView)itemView.findViewById(R.id.itemte);
}
}
}item_image.xml
<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="250dp"
android:layout_height="100dp"
app:cardCornerRadius="5dp">
<ImageView
android:id="@+id/image"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scaleType="fitXY"/>
<TextView
android:id="@+id/itemte"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="aaa"/>
</android.support.v7.widget.CardView>