漂亮的圖片多選控件

對(duì)比了很多圖片多選的控件，感覺(jué)都不太適合自己，靈活度較低，往往需要對(duì)源碼做大量的修改，自己對(duì)其進(jìn)行了簡(jiǎn)單的實(shí)現(xiàn)，來(lái)更好的適應(yīng)多變的環(huán)境，本文暫時(shí)不講原理和實(shí)現(xiàn)，之后會(huì)詳細(xì)講解，首先來(lái)講解一下控件的使用。

Gradle

repositories { 
    maven { url "https://jitpack.io" }
}
dependencies {
    compile 'com.github.sd6352051:android-image-picker:v1.0.1'
}

如何使用

Step 0: 添加權(quán)限

    <uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE" />
    <uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />

Step 2: 添加控件的根布局

提供一個(gè)ViewGroup id 可以隨意定義，之后綁定時(shí)需要用到

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    <FrameLayout
        android:id="@+id/gallery_root"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        />
</RelativeLayout>      

Step 3: 在你的activity中調(diào)用此方法attachFragment(R.id.gallery_root)

  @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        attachFragment(R.id.gallery_root);
    }

Step 4: 實(shí)現(xiàn)接口

  @Override
    public Configuration getConfiguration() {
        //返回控件配置
        Configuration cfg=new Configuration.Builder()
                .build();
        return cfg;
    }

    @Override
    public List<PhotoEntry> getSelectPhotos() {
        //返回當(dāng)前已經(jīng)選中的圖片 沒(méi)有是返回null
        return mSelectedPhotos;
    }

    @Override
    public void onSelectedCountChanged(int count) {
        //這個(gè)方法將在你圖選擇發(fā)生變化時(shí)調(diào)用 
        // count:當(dāng)前被選中圖像數(shù)量
    }

    @Override
    public void onAlbumChanged(String name) {
        //這個(gè)方法將在相冊(cè)選擇發(fā)生變化時(shí)調(diào)用
        //name:當(dāng)前選中的相冊(cè)名稱
    }

    @Override
    public void onTakePhoto(PhotoEntry entry) {
        //這個(gè)方法將在你拍照后調(diào)用
        //entry：返回拍照后的圖片信息
    }

    @Override
    public void onChoosePhotos(List<PhotoEntry> entries) {
        //這個(gè)方法將在你調(diào)用 sendPhotos() 方法后調(diào)用
        //entries：返回你選中的圖片信息
    }

    @Override
    public void onPhotoClick(PhotoEntry entry) {
        //這個(gè)方法將在你點(diǎn)擊圖像時(shí)調(diào)用，如果configuration hasPreview(false)時(shí) 將不回調(diào)此方法
        //entry: 返回當(dāng)前點(diǎn)擊的圖像信息
    }

Step 5: 其他方法

openAlbum(): 打開(kāi)相冊(cè)彈窗

sendPhotos(): 這個(gè)方法將會(huì)被調(diào)用 onChoosePhotos(List<PhotoEntry> entries)

配置項(xiàng)

默認(rèn)配置

Configuration cfg=new Configuration.Builder()
                //是否包含相機(jī)按鈕
                .hasCamera(true)
                //圖片選中后是否包含一個(gè)浮層
                .hasShade(true)
                //是否包含圖像預(yù)覽功能，為false時(shí)點(diǎn)擊圖像將執(zhí)行反選效果，true則會(huì)調(diào)用onPhotoClick方法
                .hasPreview(true)
                //GridView間隔
                .setSpaceSize(4)
                //圖像最大寬度
                .setPhotoMaxWidth(120)
                //Checkbox 背景色
                .setCheckBoxColor(0xFF3F51B5)
                //相冊(cè)彈出默認(rèn)高度
                .setDialogHeight(Configuration.DIALOG_HALF)
                //相冊(cè)模式  DIALOG_GRID  網(wǎng)格形式  DIALOG_LIST 列表形式
                .setDialogMode(Configuration.DIALOG_GRID)
                //圖像最大選中
                .setMaximum(9)
                //圖像達(dá)到最大選中時(shí)的提示
                .setTip(null)
                //相冊(cè)標(biāo)題
                .setAblumsTitle(null)
                .build();

詳細(xì)

該控件只提供了基礎(chǔ)的圖片多選功能，我可以在自己的activity中通過(guò)attachFragment(R.id.gallery_root);來(lái)完成綁定 即可顯示圖片選擇控件，
通過(guò)調(diào)用openAlbum()方法來(lái)打開(kāi)相冊(cè)，通過(guò)我們實(shí)現(xiàn)的一系列回調(diào)方法來(lái)獲取需要的大多數(shù)據(jù)，當(dāng)圖片選擇完成后調(diào)用sendPhotos()方法即可在onChoosePhotos方法中獲取到我們選擇的詳細(xì)圖片信息，獲取到需要的數(shù)據(jù)后即可通過(guò) activity 的 onActivityResult 或者 eventbus 及類似控件來(lái)傳遞數(shù)據(jù) ,下面介紹一下實(shí)現(xiàn)的回調(diào)接口的作用。

• 1 getConfiguration : 獲取配置信息，可以高度的定義控件的屬性，上面有詳細(xì)講到每個(gè)屬性的作用。
• 2 getSelectPhotos: 當(dāng)前已經(jīng)選中的圖片，例如我們第一次選擇了3張，但我們還要繼續(xù)選擇，下次選擇就需要攜帶上一次選中的3張圖片的信息。
• 3 onSelectedCountChanged:當(dāng)被選中的圖像數(shù)量發(fā)生改變將調(diào)用此方法，大部分情況我們的界面上可能需要顯示當(dāng)前選中的數(shù)量，可以在此做跟新
• 4 onAlbumChanged: 當(dāng)相冊(cè)名稱發(fā)生變化將調(diào)用次方法，如果你的界面需要此信息，可以在此獲取
• 5 onTakePhoto: 當(dāng)拍照完成后會(huì)調(diào)用次方法，可以在此獲取的剛拍的照片信息，例如我們通常會(huì)在此關(guān)閉當(dāng)前activiy,傳遞圖像信息等。
• 6 onChoosePhotos:此回調(diào)需要手動(dòng)調(diào)用sendPhotos觸發(fā)，將得到當(dāng)前選中的所有圖片信息，例如通常會(huì)在此關(guān)閉當(dāng)前圖片選中activity，傳遞信息到需要的地方
• 7 onPhotoClick:此回調(diào)會(huì)受 配置項(xiàng)中hasPreview 影響，為false時(shí)將不執(zhí)行此回調(diào)，通常我們會(huì)增加圖片的瀏覽功能可以使用photoview或其他控件，當(dāng)點(diǎn)擊圖像，就可以在此接口中獲取點(diǎn)擊圖像的信息。

可以通過(guò)配置項(xiàng)來(lái)充分的達(dá)到理想的效果，例如通過(guò)setDialogMode(Configuration.DIALOG_GRID or Configuration.DIALOG_LIST) 來(lái)改變相冊(cè)集的布局方式

查看示例代碼

下載示例應(yīng)用

Github 歡迎 star follow