1. 程式人生 > >自定義控制元件之輪播圖的實現

自定義控制元件之輪播圖的實現

public class BannerView extends RelativeLayout {

    private boolean startAndclose;
    private List<String> images = new ArrayList<>();
    private Context mcontext;
    private ViewPager viewpage;
    private int STARTBANNER = 1;
    private int bannerTime = 3000;
    private LinearLayout mPiont;

    //handler
    private Handler handler = new Handler() {
        @Override
        public void handleMessage(Message msg) {
            super.handleMessage(msg);
            if (msg.what == STARTBANNER) {
                int item = viewpage.getCurrentItem();
                item++;
                viewpage.setCurrentItem(item);
            }
            handler.sendEmptyMessageDelayed(STARTBANNER, bannerTime);
        }
    };

    //內部構造
    public BannerView(Context context) {
        super(context);
        mcontext = context;
        init(context);
    }


    public BannerView(Context context, AttributeSet attrs) {
        super(context, attrs);
        mcontext = context;
        //自定義屬性
        TypedArray typedArray = context.obtainStyledAttributes(attrs, R.styleable.BannerView);
        //獲取是否開啟輪播的屬性
        startAndclose = typedArray.getBoolean(R.styleable.BannerView_startAndclose, false);
        //獲取輪播秒數的屬性
        bannerTime = typedArray.getInteger(R.styleable.BannerView_startTime, 1000);
        //釋放
        typedArray.recycle();
        //初始化控制元件
        init(context);
    }

    public BannerView(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        mcontext = context;
        init(context);
    }

    /**
     * 設定時間
     *
     * @param time
     */
    public void setBannerTime(int time) {
        bannerTime = time;
    }

    //設定iamge圖片的url地址
    public void setImageUrl(List<String> picUrls) {
        images.clear();
        images.addAll(picUrls);
        setAdapter();
    }


    /**
     * 初始化控制元件設定事件
     *
     * @param context
     */
    private void init(Context context) {
        View view = View.inflate(context, R.layout.layout_view_bannerviewpage, null);
        viewpage = view.findViewById(R.id.bannerviewpage);
        mPiont = view.findViewById(R.id.point);
        viewpage.addOnPageChangeListener(new ViewPager.OnPageChangeListener() {
            @Override
            public void onPageScrolled(int i, float v, int i1) {

            }

            @Override
            public void onPageSelected(int i) {
                setPoint(i % images.size());
            }

            @Override
            public void onPageScrollStateChanged(int i) {

            }
        });
        this.addView(view);
    }


    //程式碼方式設定是否輪播
    public void setStartAndclose(boolean flage) {
        if (flage) {
            handler.sendEmptyMessageDelayed(STARTBANNER, bannerTime);
        } else {
            handler.removeMessages(STARTBANNER);
        }
    }

    /**
     * 設定介面卡
     */
    private void setAdapter() {
        MyViewPageAdapter myViewPageAdapter = new MyViewPageAdapter();
        viewpage.setAdapter(myViewPageAdapter);
        myViewPageAdapter.notifyDataSetChanged();
        viewpage.setCurrentItem(Integer.MAX_VALUE % 2 - 1);
        setPoint(0);
        setStartAndclose(startAndclose);
        /*viewpage.setCurrentItem(Integer.MAX_VALUE % 2 + 1);*/
    }


    /**
     * 設定小圓點
     */

    public void setPoint(int point) {
        mPiont.removeAllViews();
        Log.d("Tag", "" + point);
        for (int a = 0; a < images.size(); a++) {
            ImageView imageView = new ImageView(mcontext);
            if (point == a) {
                imageView.setBackgroundResource(R.drawable.soild);
            } else {
                imageView.setBackgroundResource(R.drawable.unsoild);
            }
            mPiont.addView(imageView);
            ViewGroup.LayoutParams layoutParams = imageView.getLayoutParams();
            layoutParams.width = 20;
            layoutParams.height = 20;
            imageView.setLayoutParams(layoutParams);
        }

    }


    /**
     * 定義PagerAdapter
     */
    class MyViewPageAdapter extends PagerAdapter {

        @Override
        public int getCount() {
            return Integer.MAX_VALUE;
        }

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

        @NonNull
        @Override
        public Object instantiateItem(@NonNull ViewGroup container, int position) {
            View view = View.inflate(mcontext, R.layout.layout_view_banneriamge, null);
            ImageView imageView = view.findViewById(R.id.bannerImage);
            Picasso.get().load(images.get(position % images.size())).into(imageView);
            container.addView(view);
            return view;
        }

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

 自定義屬性的xml

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <declare-styleable name="BannerView">
        <attr name="startAndclose" format="boolean"></attr>
        <attr name="startTime" format="integer"></attr>
    </declare-styleable>
</resources>

使用方法1(通過程式碼進行設定):

public class MainActivity extends AppCompatActivity {

    private List<String> iamges = new ArrayList<>();

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        BannerView bannerView = findViewById(R.id.banner);
        //初始化資料
        iamges.add("http://img.zcool.cn/community/
[email protected]
_1l_2o_100sh.jpg"); iamges.add("http://img.zcool.cn/community/[email protected]_1l_2o_100sh.jpg"); iamges.add("http://pic.58pic.com/58pic/14/62/50/62558PICxm8_1024.jpg"); //設定圖片的網路資訊 bannerView.setImageUrl(iamges); //設定輪播圖的時間 bannerView.setBannerTime(3000); //設定是否開啟輪播圖 bannerView.setStartAndclose(true); } }

使用方法1(通過自定義屬性進行設定): 

<zhoujianfeng.main.bwie.com.view.BannerView
        android:id="@+id/banner"
        android:layout_width="match_parent"
        android:layout_height="200dp"
        banner:startAndclose="true"//設定是否開啟輪播
        banner:startTime="1000">   //設定輪播時長
</zhoujianfeng.main.bwie.com.view.BannerView>

 實現效果: