轮播图 + fragment+小圆点+刷新页面

最新推荐文章于 2023-10-21 21:01:11 发布

原创最新推荐文章于 2023-10-21 21:01:11 发布 · 358 阅读

CC 4.0 BY-SA版权

本文介绍了一种实现自动轮播图与ListView集成的方法，包括页面布局、适配器代码及小圆点的绘制。通过自定义Fragment，实现了轮播图的自动切换和指示器的动态更新，并结合PullToRefresh功能，增强了用户体验。

页面代码

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
     android:layout_width="match_parent"
    android:layout_height="match_parent">


    <com.handmark.pulltorefresh.library.PullToRefreshScrollView
        android:id="@+id/pull_wo"
        android:layout_width="match_parent"
        android:layout_height="match_parent">
        <LinearLayout
            android:orientation="vertical"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            >
            <RelativeLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content">
                <android.support.v4.view.ViewPager
                    android:layout_width="match_parent"
                    android:layout_height="200dp"
                    android:id="@+id/pager_wo"
                    ></android.support.v4.view.ViewPager>
                <LinearLayout
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:id="@+id/lin_piont"
                    android:orientation="horizontal"
                    android:layout_alignParentBottom="true"
                    android:gravity="center"
                    >

                </LinearLayout>
            </RelativeLayout>

            <com.example.zhonghe.UI_Listview
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:id="@+id/list_wo">

            </com.example.zhonghe.UI_Listview>
        </LinearLayout>
    </com.handmark.pulltorefresh.library.PullToRefreshScrollView>



    </RelativeLayout>

适配器代码

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical" android:layout_width="match_parent"
    android:layout_height="match_parent">

    <ImageView
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:id="@+id/image_item"/>
    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="100dp"
        android:orientation="vertical"
        >
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textSize="20dp"
            android:textStyle="bold"
            android:ellipsize="end"
            android:lines="2"

            android:id="@+id/text1_item"/>
        <TextView
            android:layout_marginTop="20dp"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textColor="#f00"

            android:id="@+id/text2_item"/>
    </LinearLayout>
</LinearLayout>

//自动轮播+fragment代码+小圆点

public class Fragment_wo extends Fragment {

    private List<ImageView> piont=new ArrayList<ImageView>();
    private ViewPager viewPager;
    private LinearLayout lin_pager;
    private ListView listView;
    private List<String> imgurl;
    private int index=1;
    private Handler handler = new Handler(){
        @Override
        public void handleMessage(Message msg) {
            super.handleMessage(msg);
            int currentItem = viewPager.getCurrentItem();
            currentItem++;
            viewPager.setCurrentItem(currentItem);
            //指示器自动轮播
            for (int i = 0; i < piont.size(); i++) {
                if (i==currentItem%piont.size()){
                    piont.get(i).setImageResource(R.drawable.shape_selected);
                }else {
                    piont.get(i).setImageResource(R.drawable.shape_un);
                }
            }
            sendEmptyMessageDelayed(1,1000);

        }
    };
    private List<ResultData.DataBean> data;
    private List<ResultData.DataBean> datas = new ArrayList<>();
    private boolean b;
    private PullToRefreshScrollView pull;

    @Nullable
    @Override
    public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
        View view = inflater.inflate(R.layout.fragment_wo,container,false);

        initData(view);
        viewPager.setAdapter(new Pager(getActivity(),imgurl));

        //加入小圆点
        addpiont();
        // 设置自动轮播图

        viewPager.setCurrentItem(imgurl.size()*10000);
        handler.sendEmptyMessageDelayed(1,1000);
        //设置listview
        setList();
        refresh();
        return view;
    }
//下拉刷新
    private void refresh() {
            pull.setMode(PullToRefreshBase.Mode.BOTH);
            pull.setOnRefreshListener(new PullToRefreshBase.OnRefreshListener2<ScrollView>() {
                @Override
                public void onPullDownToRefresh(PullToRefreshBase<ScrollView> pullToRefreshBase) {
                    b=true;
                    index=1;
                    setList();

                }

                @Override
                public void onPullUpToRefresh(PullToRefreshBase<ScrollView> pullToRefreshBase) {
                    b=false;
                    index++;
                    setList();
                }
            });
    }

    private void setList() {
        ImgTask task = new ImgTask();
        task.execute("https://www.zhaoapi.cn/product/searchProducts?keywords=%E6%89%8B%E6%9C%BA&source=android&page="+index);
    }



    //解析轮播图地址

    private class ImgTask extends AsyncTask<String,Void,String> {
        @Override
        protected String doInBackground(String... strings) {
            OkHttpClient okHttpClient = new OkHttpClient();
            Request request = new Request.Builder().url(strings[0]).build();
            try {
                Response response = okHttpClient.newCall(request).execute();
                String s = response.body().string();
                return s;
            } catch (IOException e) {
                e.printStackTrace();
            }

            return null;
        }

        @Override
        protected void onPostExecute(String s) {
            super.onPostExecute(s);
            Gson gson = new Gson();
            ResultData ResultData = gson.fromJson(s, ResultData.class);
            data = ResultData.getData();
            if (data.size()==0){
                Toast.makeText(getActivity(), "没有数据了", Toast.LENGTH_SHORT).show();
            }
                if (b){
                    datas.clear();
                }
                datas.addAll(data);
                pull.onRefreshComplete();
                Base base = new Base(datas,getActivity());
                listView.setAdapter(base);
            }
        }

    private void initData(View view) {
        viewPager = view.findViewById(R.id.pager_wo);
        lin_pager = view.findViewById(R.id.lin_piont);
        listView = view.findViewById(R.id.list_wo);
        pull = view.findViewById(R.id.pull_wo);
        //图片
        imgurl = new ArrayList<>();
        imgurl.add("https://www.zhaoapi.cn/images/quarter/ad1.png");
        imgurl.add("https://www.zhaoapi.cn/images/quarter/ad2.png");
        imgurl.add("https://www.zhaoapi.cn/images/quarter/ad3.png");
        imgurl.add("https://www.zhaoapi.cn/images/quarter/ad4.png");
    }

    //加入小圆点

    private void addpiont() {
        for (int i = 0; i < imgurl.size(); i++) {
            ImageView imageView = new ImageView(getActivity());
            if (i==0){

                imageView.setImageResource(R.drawable.shape_selected);
            }else {
                imageView.setImageResource(R.drawable.shape_un);
            }
            LinearLayout.LayoutParams params = new LinearLayout.LayoutParams(LinearLayout.LayoutParams.WRAP_CONTENT, LinearLayout.LayoutParams.WRAP_CONTENT);
            params.setMargins(0,0,15,0);
            lin_pager.addView(imageView,params);
            piont.add(imageView);
    }

    }




}

listview适配器代码

public class Pager extends PagerAdapter {
   private Context context;
   private List<String> imgurl;
    private final DisplayImageOptions options;

    public Pager(Context context, List<String> imgurl) {
        this.context = context;
        this.imgurl = imgurl;

        options = new DisplayImageOptions.Builder()
                 .cacheInMemory(true)//使用内存缓存
                 .cacheOnDisk(true)//使用磁盘缓存
                 .showImageOnLoading(R.mipmap.ic_launcher)//设置正在下载的图片
                 .showImageForEmptyUri(R.mipmap.ic_launcher)//url为空或请求的资源不存在时
                 .showImageOnFail(R.mipmap.ic_launcher)//下载失败时显示的图片
                 .bitmapConfig(Bitmap.Config.RGB_565)//设置图片色彩模式
                 .imageScaleType(ImageScaleType.EXACTLY)//设置图片的缩放模式
                 .build();
    }

    @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, int position) {

        ImageView imageView = new ImageView(context);
        imageView.setScaleType(ImageView.ScaleType.FIT_XY);
        ImageLoader.getInstance().displayImage(imgurl.get(position%imgurl.size()),imageView,options);
        container.addView(imageView);
        return imageView;
    }

    @Override
    public void destroyItem(ViewGroup container, int position, Object object) {
        container.removeView((View) object);
    }
}

小圆点绘图代码

<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="oval">
    <!--useLevel需要设置为false-->
    <size android:height="12dp" android:width="12dp"></size>
    <stroke android:width="10dp" android:color="@color/colorPrimary"></stroke>
    <solid android:color="@color/colorAccent" ></solid>
</shape>

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">

    <corners android:radius="10dp"></corners>


    <padding android:bottom="12dp"
        android:left="12dp"
        android:right="12dp"
        android:top="12dp"></padding>
    <size android:height="12dp" android:width="12dp"></size>

    <stroke android:width="5dp"
        android:color="@color/colorAccent"></stroke>

</shape>