漂亮的圖片多選控件
對(duì)比了很多圖片多選的控件讨盒,感覺都不太適合自己,靈活度較低禀苦,往往需要對(duì)源碼做大量的修改遂鹊,自己對(duì)其進(jìn)行了簡單的實(shí)現(xiàn),來更好的適應(yīng)多變的環(huán)境慧邮,本文暫時(shí)不講原理和實(shí)現(xiàn)误澳,之后會(huì)詳細(xì)講解秦躯,首先來講解一下控件的使用。
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)選中的圖片 沒有是返回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()
: 打開相冊(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
中通過attachFragment(R.id.gallery_root);
來完成綁定 即可顯示圖片選擇控件,
通過調(diào)用openAlbum()
方法來打開相冊(cè)踪危,通過我們實(shí)現(xiàn)的一系列回調(diào)方法來獲取需要的大多數(shù)據(jù)猪落,當(dāng)圖片選擇完成后調(diào)用sendPhotos()
方法即可在onChoosePhotos
方法中獲取到我們選擇的詳細(xì)圖片信息,獲取到需要的數(shù)據(jù)后即可通過 activity
的 onActivityResult
或者 eventbus
及類似控件來傳遞數(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)擊圖像的信息。
可以通過配置項(xiàng)來充分的達(dá)到理想的效果况毅,例如通過setDialogMode(Configuration.DIALOG_GRID or Configuration.DIALOG_LIST)
來改變相冊(cè)集的布局方式
Github 歡迎 star follow