温馨提示×

温馨提示×

您好,登录后才能下订单哦!

密码登录×
登录注册×
其他方式登录
点击 登录注册 即表示同意《亿速云用户服务条款》

android怎么制作轮播图组件

发布时间:2021-08-19 17:44:04 来源:亿速云 阅读:113 作者:chen 栏目:开发技术

本篇内容主要讲解“android怎么制作轮播图组件”,感兴趣的朋友不妨来看看。本文介绍的方法操作简单快捷,实用性强。下面就让小编来带大家学习“android怎么制作轮播图组件”吧!

本文实例为大家分享了android轮播图组件的制作方法,供大家参考,具体内容如下

BannerLayout

package com.coral3.common_module.components;

import android.content.Context;
import android.os.Handler;
import android.os.Message;
import android.util.AttributeSet;
import android.view.LayoutInflater;
import android.view.MotionEvent;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ImageView;
import android.widget.LinearLayout;
import androidx.annotation.NonNull;
import androidx.annotation.Nullable;
import androidx.viewpager.widget.PagerAdapter;
import androidx.viewpager.widget.ViewPager;
import com.coral3.common_module.R;
import com.coral3.common_module.utils.LogUtil;
import com.coral3.common_module.viewPager.ChildViewPager;
import java.util.ArrayList;
import java.util.List;
import java.util.concurrent.atomic.AtomicInteger;

public class BannerLayout extends LinearLayout {

    private Context mContext;
    private View view;
    private ChildViewPager viewPager;
    private ImageView indicator;
    private ImageView[] indicators;
    private Boolean isContinue = true;
    private ViewGroup group;
    private AtomicInteger index = new AtomicInteger();
    private Handler handler = new Handler(new Handler.Callback(){

        @Override
        public boolean handleMessage(Message message) {
            viewPager.setCurrentItem(message.what);
            return false;
        }
    });

    public BannerLayout(Context context, @Nullable AttributeSet attrs) {
        super(context, attrs);
        mContext = context;
        initView();
        initListener();
    }

    private void initView(){
        view = LayoutInflater.from(mContext).inflate(R.layout.layout_banner, this);
        group = view.findViewById(R.id.view_indicators);
        viewPager = view.findViewById(R.id.view_banners);
        // 动态加入图片
        List<View> listPics = new ArrayList<>();
        ImageView img1 = new ImageView(mContext);
        img1.setBackgroundResource(R.drawable.banner1);
        listPics.add(img1);
        ImageView img2 = new ImageView(mContext);
        img2.setBackgroundResource(R.drawable.banner2);
        listPics.add(img2);
        ImageView img3 = new ImageView(mContext);
        img3.setBackgroundResource(R.drawable.banner3);
        listPics.add(img3);
        ImageView img4 = new ImageView(mContext);
        img4.setBackgroundResource(R.drawable.banner4);
        listPics.add(img4);
        ImageView img5 = new ImageView(mContext);
        img5.setBackgroundResource(R.drawable.banner4);
        listPics.add(0, img5);
        ImageView img0 = new ImageView(mContext);
        img0.setBackgroundResource(R.drawable.banner1);
        listPics.add(img0);
        //动态加入指示器
        indicators = new ImageView[listPics.size()];
        for(int i = 0; i < indicators.length; i++){
            indicator = new ImageView(mContext);
            LinearLayout.LayoutParams layoutParams = new LinearLayout.LayoutParams(15, 15);
            layoutParams.setMargins(0, 0, 10, 0);
            indicator.setLayoutParams(layoutParams);
            indicators[i] = indicator;
            if(i == 1){
                indicators[i].setBackgroundResource(R.drawable.shape_banner_checked);
            }else{
                indicators[i].setBackgroundResource(R.drawable.shape_banner_unchecked);
            }
            if(i == 0 || i == 5){
                indicators[i].setVisibility(View.INVISIBLE);
            }
            group.addView(indicators[i]);
        }
        viewPager.setAdapter(new MyPagerAdapter(listPics));
        index.incrementAndGet();
        // 轮播
        new Thread(new Runnable() {

            @Override
            public void run() {
                while (true){
                    if(isContinue){
                        handler.sendEmptyMessage(index.get());
                        whatOption();
                    }
                }
            }
        }).start();
    }

    private void initListener(){
        // 设置监听器
        viewPager.addOnPageChangeListener(new ViewPager.OnPageChangeListener() {

            @Override
            public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
                LogUtil.d(positionOffset + "-" + positionOffsetPixels);
                // 无缝滚动均滑
//                if(positionOffset == 0.0){
//                    LogUtil.d(position + "");
//                    if(position == 5) {
//                        viewPager.setCurrentItem(1, false);
//                    }
//                    if(position == 0) {
//                        viewPager.setCurrentItem(4, false);
//                    }
//                }
            }

            @Override
            public void onPageSelected(int position) {
                index.getAndSet(position);
                if(position == 5) {
                    viewPager.setCurrentItem(1, false);
                }
                if(position == 0) {
                    viewPager.setCurrentItem(4, false);
                }
                for(int i = 0; i < indicators.length; i++){
                    if(i == index.get()){
                        indicators[i].setBackgroundResource(R.drawable.shape_banner_checked);
                    }else{
                        indicators[i].setBackgroundResource(R.drawable.shape_banner_unchecked);
                    }
                }
                if(position == 0) indicators[4].setBackgroundResource(R.drawable.shape_banner_checked);
                if(position == 5) indicators[1].setBackgroundResource(R.drawable.shape_banner_checked);
            }

            @Override
            public void onPageScrollStateChanged(int state) {}
        });
        // 设置触摸时停止定时
        viewPager.setOnTouchListener(new View.OnTouchListener() {

            @Override
            public boolean onTouch(View view, MotionEvent motionEvent) {
                switch (motionEvent.getAction()){
                    case MotionEvent.ACTION_DOWN:
                        isContinue = false;
                        break;
                    case MotionEvent.ACTION_UP:
                        isContinue = true;
                        break;
                }
                return false;
            }
        });
    }

    class MyPagerAdapter extends PagerAdapter {

        private List<View> listView;

        @Override
        public int getCount() {
            return listView.size();
        }

        public MyPagerAdapter(List<View> listView){
            this.listView = listView;
        }

        @Override
        public boolean isViewFromObject(@NonNull View view, @NonNull Object object) {
            return view == object;
        }

        @NonNull
        @Override
        public Object instantiateItem(@NonNull ViewGroup container, int position) {
            container.addView(listView.get(position));
            return listView.get(position);
        }

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

    private void whatOption(){
        index.incrementAndGet();
        if(index.get() > indicators.length - 2){
            index.getAndAdd(-4);
        }
        try {
            Thread.sleep(3000);
        } catch (InterruptedException e) {
            e.printStackTrace();
        }
    }
}

layout_banner

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:orientation="vertical"
    android:layout_height="match_parent">
    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content">
        <com.coral3.common_module.viewPager.ChildViewPager
            android:id="@+id/view_banners"
            android:layout_width="match_parent"
            android:layout_height="200dp"/>
        <LinearLayout
            android:id="@+id/view_indicators"
            android:layout_below="@+id/view_banners"
            android:gravity="center"
            android:layout_marginTop="-15dp"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="horizontal" />
    </RelativeLayout>
</LinearLayout>

ChildViewPager

package com.coral3.common_module.viewPager;

import android.content.Context;
import android.graphics.PointF;
import android.util.AttributeSet;
import android.view.MotionEvent;
import androidx.viewpager.widget.ViewPager;

public class ChildViewPager extends ViewPager {
    /** 触摸时按下的点 **/
    PointF downP = new PointF();
    /** 触摸时当前的点 **/
    PointF curP = new PointF();
    public ChildViewPager(Context context) {
        super(context);
    }

    public ChildViewPager(Context context, AttributeSet attrs) {
        super(context, attrs);
    }

    private static final String TAG = "ChildViewpager";
    @Override
    public boolean onTouchEvent(MotionEvent arg0) {
        //每次进行onTouch事件都记录当前的按下的坐标
        if(getChildCount()<=1)
        {
            return super.onTouchEvent(arg0);
        }
        curP.x = arg0.getX();
        curP.y = arg0.getY();

        if(arg0.getAction() == MotionEvent.ACTION_DOWN)
        {

            //记录按下时候的坐标
            //切记不可用 downP = curP ,这样在改变curP的时候,downP也会改变
            downP.x = arg0.getX();
            downP.y = arg0.getY();
            //此句代码是为了通知他的父ViewPager现在进行的是本控件的操作,不要对我的操作进行干扰
            getParent().requestDisallowInterceptTouchEvent(true);
        }

        if(arg0.getAction() == MotionEvent.ACTION_MOVE){
            //此句代码是为了通知他的父ViewPager现在进行的是本控件的操作,不要对我的操作进行干扰
            getParent().requestDisallowInterceptTouchEvent(true);
        }

        if(arg0.getAction() == MotionEvent.ACTION_UP || arg0.getAction() == MotionEvent.ACTION_CANCEL){
            //在up时判断是否按下和松手的坐标为一个点
            //如果是一个点,将执行点击事件,这是我自己写的点击事件,而不是onclick
            getParent().requestDisallowInterceptTouchEvent(false);
            if(downP.x==curP.x && downP.y==curP.y){
                return true;
            }
        }
        super.onTouchEvent(arg0); //注意这句不能 return super.onTouchEvent(arg0); 否则触发parent滑动
        return true;
    }
}

使用

<com.coral3.common_module.components.BannerLayout
            android:id="@+id/home_banner"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"/>

到此,相信大家对“android怎么制作轮播图组件”有了更深的了解,不妨来实际操作一番吧!这里是亿速云网站,更多相关内容可以进入相关频道进行查询,关注我们,继续学习!

向AI问一下细节

免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。

AI