Android 圖片輪播

原創

2020-02-21 06:03

圖片輪播是APP中比較基礎，常見的控件，本次通過rollviewpager來實現簡單的圖片輪播

第一步：不必說，自然是先引入巨人的肩膀

    compile 'com.jude:rollviewpager:1.4.6'

第二步：在佈局當中定義好我們的輪播控件

    <com.jude.rollviewpager.RollPagerView
        android:id="@+id/view_pager"
        android:layout_width="match_parent"
        android:layout_height="300dp"
        app:rollviewpager_play_delay="3000"/>

此處的屬性可將大神的註釋借用一下

app:rollviewpager_play_delay="3000" period，unit is ms。0 for no auto-play。default is 0.
app:rollviewpager_hint_gravity="center" graviengty. left,center,right。default is center.
app:rollviewpager_hint_color="#7c7c7c" color for indicator's container.default is black.
app:rollviewpager_hint_alpha="80" alpha for indicator's container。0 for complete transparent，255 for no transparent。default is 0.
app:rollviewpager_hint_paddingLeft="16dp" padding for indicator's container
app:rollviewpager_hint_paddingRight="16dp"
app:rollviewpager_hint_paddingTop="16dp"
app:rollviewpager_hint_paddingBottom="16dp"

第三步：來看一下具體邏輯

首先找到你的控件，此處我用了ButterKnife

    @BindView(R.id.view_pager)
    RollPagerView viewPager;

然後呢，編寫Adapter

此處我們看到，有一個StaticPagerAdapter可以用，看了一下大神的寫法，繼承自PagerAdapter，應該很習慣其中的方法了，果然。

我們直接寫死一組圖，在Adapter當中，然後通過getView（）方法，將這組圖放進每一個position當中，很簡單

private class ImageNormalAdapter extends StaticPagerAdapter {
        int[] imgs = new int[]{
                R.mipmap.img1,
                R.mipmap.img2,
                R.mipmap.img3,
                R.mipmap.img4,
                R.mipmap.img5,
        };

        @Override
        public View getView(ViewGroup container, int position) {
            ImageView view = new ImageView(container.getContext());
            view.setScaleType(ImageView.ScaleType.FIT_START);
            view.setLayoutParams(new ViewGroup.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.MATCH_PARENT));
            view.setImageResource(imgs[position]);
            return view;
        }


        @Override
        public int getCount() {
            return imgs.length;
        }
    }

那麼這樣子將你的Adapter設置給RollPager，搞定