1.ViewPager实现自动滚动效果
轮播图由背景图片、文字描述、导航点组成,图片在适配器里面更新,由于文字描述、导航点是配合ViewPager显示,在滚动到当前item时更新,代码如下:
public class MainActivity extends AppCompatActivity implements ViewPager.OnPageChangeListener {
private ViewPager viewPager;
private int[] picres;//轮播的图片数组
private ArrayList<ImageView> list;
private LinearLayout ll_points;//跟随轮播图的导航点
private String[] desc;///跟随轮播图的文字描述
private TextView tv_desc;
private boolean isRunning = true;//是否在轮播显示
private ImageView imageView;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
initView();//初始化View
initData();//数据初始化
initAdapter();//初始化适配器
//轮询(自动轮番)
new Thread(new Runnable() {
@Override
public void run() {
while (isRunning){
try {
Thread.sleep(2000);//两秒轮播一次
} catch (InterruptedException e) {
e.printStackTrace();
}
runOnUiThread(new Runnable() {
@Override
public void run() {
//设置显示的当前item(每隔2秒自动轮播到下一个)
viewPager.setCurrentItem(viewPager.getCurrentItem() + 1);
}
});
}
}
}).start();
}
private void initAdapter() {
viewPager.setAdapter(new MyAdapter());
viewPager.setCurrentItem(5000000);//初始当前位置(为了可以左右都可以无限滑动)
}
private void initData() {
for (int i= 0;i < picres.length;i++){
imageView = new ImageView(this);
imageView.setBackgroundResource(picres[i]);
list.add(imageView);
View view = new View(this);
view.setBackgroundResource(R.drawable.select_point);
LinearLayout.LayoutParams layoutParams = new LinearLayout.LayoutParams(10, 10);
ll_points.addView(view,layoutParams);
if (i!=0) {
layoutParams.leftMargin = 10;//设置间隙
}
}
}
private void initView() {
viewPager = findViewById(R.id.vp);
viewPager.setOffscreenPageLimit(2);//左右缓存数量
viewPager.addOnPageChangeListener(this);//监听ViewPager
ll_points = findViewById(R.id.ll_points);
tv_desc = findViewById(R.id.tv_desc);//文字描述
picres = new int[]{R.mipmap.a,R.mipmap.b,R.mipmap.c,R.mipmap.d,R.mipmap.e};
desc = new String[]{"读书无疑须有疑","有疑定要求无疑","无疑本自有疑始","有疑方能达无疑","将信将疑"};
list = new ArrayList<>();
}
//滚动时调用
@Override
public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
}
//滚动到当前item调用
@Override
public void onPageSelected(final int position) {
tv_desc.setText(desc[position%5]);//文字描述设置
for (int i=0;i<ll_points.getChildCount();i++){
ll_points.getChildAt(i).setEnabled(position%5 == i);//对滚到的item设置不同背景
}
}
/*此方法是在状态改变的时候调用,其中state这个参数
*有三种状态(0,1,2)
*state=0的时辰默示什么都没做
*state ==1的时辰默示正在滑动
*state==2的时辰默示滑动完毕了
*/
@Override
public void onPageScrollStateChanged(int state) {
}
@Override
protected void onDestroy() {
super.onDestroy();
isRunning = false;//结束轮播
}
}
2.PagerAdapter适配器
public class MyAdapter extends PagerAdapter {
@Override
public int getCount() {
return Integer.MAX_VALUE;//轮播位置的数量,模拟可以无限滑动
}
/**
* 创建要显示的当前条目内容
* @param container:ViewPager
* @param position:当前条目位置
* @return:显示的当前条目内容
*/
@NonNull
@Override
public Object instantiateItem(@NonNull ViewGroup container, final int position) {
ImageView imageView = list.get(position%5);//拿到当前对象
//当前图片点击事件
imageView.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
Toast.makeText(MainActivity.this, desc[position%5], Toast.LENGTH_SHORT).show();
}
});
//将当前对象加到容器
container.addView(imageView);
return imageView;
}
@Override
public void destroyItem(@NonNull ViewGroup container, int position, @NonNull Object object) {
container.removeView((ImageView)object);
}
//判断view是否有缓存复用
@Override
public boolean isViewFromObject(@NonNull View view, @NonNull Object object) {
return view == object;
}
}
3.导航点的设置
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_enabled="true" android:drawable="@drawable/shape_point"/>
<item android:state_enabled="false" android:drawable="@drawable/shape_point_dark"/>
</selector>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="oval">
<corners android:radius="20dp"/>
<solid android:color="#fff" />
</shape>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="oval">
<corners android:radius="20dp"/>
<solid android:color="@android:color/darker_gray" />
</shape>
4.布局
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="200dp"
tools:context=".MainActivity">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<androidx.viewpager.widget.ViewPager
android:id="@+id/vp"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="45dp"
android:background="#80000000"
android:padding="5dp"
android:orientation="vertical"
android:layout_alignParentBottom="true">
<TextView
android:id="@+id/tv_desc"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:maxLines="1"
android:layout_gravity="center_horizontal"
android:ellipsize="end"
android:textColor="@android:color/white"/>
<LinearLayout
android:id="@+id/ll_points"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:layout_gravity="center"
android:layout_marginTop="5dp">
</LinearLayout>
</LinearLayout>
</RelativeLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
待完善