Android商城开发----在商城首页Fragment使用viewPager实现广告轮播
写在前面：本篇文章建立在创建底部导航栏之后，对商城首页进行开发。创建底部导航栏的内容请查看：Android开发–底部导航栏的创建
20221104--广告轮播图
fragment_home.xml布局文件：
创建ViewPager控件
//fragment_home.xml文件：
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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"
tools:context=".ui.home.HomeFragment">
<androidx.appcompat.widget.SearchView
android:id="@+id/searchView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginTop="8dp"
android:layout_marginEnd="8dp"
android:queryHint="请输入搜索内容"
android:textAlignment="center"
android:textSize="20sp" />
<ListView
android:id="@+id/search_list"
android:layout_width="match_parent"
android:layout_height="wrap_content"
/>
<-- 轮播广告使用ViewPager组件-->
<androidx.viewpager.widget.ViewPager
android:id="@+id/ad_viewpager"
android:layout_width="match_parent"
android:layout_height="200dp"
android:layout_below="@+id/searchView" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignBottom="@id/ad_viewpager"
android:background="#33000000"
android:orientation="vertical">
<LinearLayout
android:id="@+id/point_group"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:layout_marginBottom="5dp"
android:orientation="horizontal"></LinearLayout>
</LinearLayout>
</RelativeLayout>
HomeFragment.java:
package com.domain.mainView.ui.home;
import android.app.Activity;
import android.content.Context;
import android.os.Bundle;
import android.os.Handler;
import android.os.Message;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ImageView;
import android.widget.LinearLayout;
import android.widget.TextView;
import androidx.annotation.NonNull;
import androidx.fragment.app.Fragment;
import androidx.lifecycle.ViewModelProvider;
import androidx.viewpager.widget.PagerAdapter;
import androidx.viewpager.widget.ViewPager;
import com.domain.mainView.R;
import com.domain.mainView.databinding.FragmentHomeBinding;
import java.util.ArrayList;
public class HomeFragment extends Fragment {
private FragmentHomeBinding binding;
ViewPager adViewPager;
//图片资源
private int[] imageIds;
private int lastposition=0;
//存放创建ImageView用于轮播图滚动显示的ImageVIew
private ArrayList<View> arrayImageView;
private LinearLayout linearLayout;
private boolean flag=false;
private long INTERVALTIME = 2000; //设置轮播图片间隔的时间
private Activity myActivity;
//这里我延迟播放用的线程实现的，也可以用handler message实现。
// Handler handler=new Handler(){
// public void handleMessage(Message msg){
// int item =adViewPager.getCurrentItem()+1;
// adViewPager.setCurrentItem(item);
// //延迟发送消息
// handler.sendEmptyMessageDelayed(0,3000);
// }
// };
public View onCreateView(@NonNull LayoutInflater inflater,
ViewGroup container, Bundle savedInstanceState) {
HomeViewModel homeViewModel =
new ViewModelProvider(this).get(com.domain.mainView.ui.home.HomeViewModel.class);
binding = FragmentHomeBinding.inflate(inflater, container, false);
myActivity=getActivity();
View root = binding.getRoot();
//实例化广告轮播控件
adViewPager=root.findViewById(R.id.ad_viewpager);
linearLayout=root.findViewById(R.id.point_group);
initData();
//设置适配器
adViewPager.setAdapter(new myPagerAdapter());
//设置向左的无限轮播
adViewPager.setCurrentItem(500000-(500000%arrayImageView.size()));
adViewPager.setOnPageChangeListener(new ViewPager.OnPageChangeListener() {
@Override
public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
}
@Override
public void onPageSelected(int position) {
}
@Override
public void onPageScrollStateChanged(int state) {
}
});
//直接使用while(true)在子线程休眠
new Thread(new Runnable() {
@Override
public void run() {
flag =true;
while (flag){
try {
Thread.sleep(INTERVALTIME);
//切换到主线程进行UI操作
myActivity.runOnUiThread(new Runnable() {
@Override
public void run() {
adViewPager.setCurrentItem(adViewPager.getCurrentItem()+1);
}
});
} catch (InterruptedException e) {
e.printStackTrace();
}
}
}
}).start();
return root;
}
//初始化数据，包括小圆点
private void initData() {
//初始化数据，此处可以进行网络加载，获取数据
imageIds = new int[]{
R.drawable.lunbo1,
R.drawable.lunbo2,
R.drawable.lunbo3,
R.drawable.lunbo4,
};
arrayImageView=new ArrayList<View>();
//创建一个imageview
ImageView imageView;
//小圆点的view
View view;
//参数设置
LinearLayout.LayoutParams params;
for(int i=0;i<imageIds.length;i++){
imageView=new ImageView(myActivity);
//我在这里遇到问题，之前写的是new ImageView(this)报错了 原因是fragment不是context的子类，在这里换成了getActivity()。具体问题点下面的连接查看：
//https://blog.csdn.net/Qingshan_z/article/details/127682441?spm=1001.2014.3001.5501
//给imageview设置图片
imageView.setBackgroundResource(imageIds[i]);
//将设置好的image存在创建好的View集合
arrayImageView.add(imageView);
//创建一个用于填充小圆点的View
view =new View(myActivity);
view.setBackgroundResource(R.drawable.selector_point);
params= new LinearLayout.LayoutParams(30, 30);
if(i!=0){
params.leftMargin=10;
//默认第一个小圆点被选中
view.setEnabled(false);
}
//把小圆点添加至线性布局中
linearLayout.addView(view,params);
}
}
class myPagerAdapter extends PagerAdapter{
@Override
public int getCount() {
//设置最大值，伪无限循环
return Integer.MAX_VALUE;
}
@Override
public boolean isViewFromObject(@NonNull View view, @NonNull Object object) {
return view==object;
}
@Override
public Object instantiateItem(ViewGroup container,int position){
//取模
int newPosition =position%arrayImageView.size();
container.addView(arrayImageView.get(newPosition));
return arrayImageView.get(newPosition);
}
@Override
public void destroyItem(ViewGroup container,int position,Object object){
container.removeView((View)object);
}
}
@Override
public void onDestroyView() {
super.onDestroyView();
flag=false;
binding = null;
}