Android PhotoPicker 自定義圖片選擇器

我們來先看效果圖
Paste_Image.png
20170814133628.gif
概述

關于手機圖片加載器蕴掏,在當今像素隨隨便便破千萬的時代,一張圖片占據(jù)的內(nèi)存都相當可觀伴奥,作為高大尚程序猿的我們,有必要掌握圖片的壓縮翼闽,緩存等處理拾徙,以到達縱使你有萬張照片,縱使你的像素再高感局,我們也能正確的顯示所有的圖片尼啡。

簡單描述一下

1.顯示手機上所有的圖片
2.選中時候圖片變暗。
3.可多選

實現(xiàn)
  <uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE"/>
  compile 'com.android.support:recyclerview-v7:26.0.0-alpha1'
  compile 'com.github.bumptech.glide:glide:3.6.1'

這里我們沒有寫6.0獲取權限 自行代碼獲取

1.既然我們需要顯示手機上的所有圖片询微,那么我們首先就需要拿到手機上的所有圖片地址,當然這個過程在子線程理的崖瞭,當 獲取完成后通過handler發(fā)送完成消息

private void getImages() {

    new Thread(new Runnable() {
        @Override
        public void run() {
            fileNames = new ArrayList();
            Cursor cursor = getContentResolver().query(
                    MediaStore.Images.Media.EXTERNAL_CONTENT_URI, null, null, null, null);
            if (cursor == null) {
                Log.i(TAG, "run: 空");
                return;
            }
            while (cursor.moveToNext()) {
                //獲取圖片的地址
                byte[] data = cursor.getBlob(cursor.getColumnIndex(MediaStore.Images.Media.DATA));
                fileNames.add(new String(data, 0, data.length - 1));
                Log.i(TAG, "run: " + new String(data, 0, data.length - 1));
            }
            mHandler.sendMessage(mHandler.obtainMessage());
            cursor.close();
        }
    }).start();
}



Handler mHandler = new Handler() {
    @Override
    public void handleMessage(Message msg) {
        Log.i(TAG, "handleMessage: 完成");
        mRv.setAdapter(mPhotoPickerAdapter = new PhotoPickerAdapter(fileNames));
    }
};

2.這個時候我們已經(jīng)有了所有圖片的地址接下來我們需要顯示圖片了,我們看到效果撑毛,每行有3個书聚,并且條目之間是有間距的,我這里使用的是RecyclerView藻雌,

@Override
protected void onCreate(@Nullable Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_photo);
    mRv = findViewById(R.id.rv);
    mRv.setLayoutManager(new GridLayoutManager(this, 3));
    mRv.addItemDecoration(new SpaceItemDecoration(5));
    getImages();
}





public class SpaceItemDecoration extends RecyclerView.ItemDecoration {
    private  int  space;
    public SpaceItemDecoration(int space) {
        this.space = space;
    }
  /**這里定義的間距*/
    @Override
 public void getItemOffsets(Rect outRect, View view, RecyclerView parent, RecyclerView.State state) {
        outRect.left = space;
        outRect.right = space;
        outRect.bottom = space;
        outRect.top = space;
    }
}

3.這個時候我們RecyclerView 基本配置配置完成雌续。接下來我們看下adapter,從下列代碼我們可以看到,我這里直接采用的是谷歌推薦的圖片加載Glide加載圖片的蹦疑,圖片選中的時候調(diào)用setAlpha 設置透明度西雀。
這里提供了一個getImages 方法。 取到所有的已經(jīng)選中圖片的地址歉摧;

public class PhotoPickerAdapter extends RecyclerView.Adapter<PhotoPickerAdapter.MyViewHolder> {
    private ArrayList<String> images;
    private ArrayList<Boolean> cb;
    private Context mContext;
    public PhotoPickerAdapter(ArrayList<String> images){
        this.images=images;
        cb=new ArrayList<>();
        for (int i = 0; i < images.size(); i++) {
            cb.add(false);
        }
    }

    public ArrayList<String> getImages(){
        ArrayList<String> strings =new ArrayList<>();
        for (int i = 0; i < cb.size(); i++) {
            if(cb.get(i)){
                strings.add(images.get(i));
            }
        }
        return strings;
    }
    @Override
    public MyViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
        mContext=parent.getContext();
        MyViewHolder holder = new MyViewHolder(LayoutInflater.from(
                mContext).inflate(R.layout.photo_item, parent,
                false));
        return holder;
    }

    @Override
    public void onBindViewHolder(final MyViewHolder holder, final int position) {
        Glide.with(mContext)
                .load(images.get(position))
                .crossFade()
                .into(holder.iv);

        holder.cb.setOnCheckedChangeListener(new CompoundButton.OnCheckedChangeListener() {
            @Override
            public void onCheckedChanged(CompoundButton compoundButton, boolean b) {
                cb.set(position,b);
                holder.iv.setAlpha(cb.get(position)==true?0.5f:1f);
            }
        });
        holder.cb.setChecked(cb.get(position));
        holder.iv.setAlpha(cb.get(position)==true?0.5f:1f);

    }

    @Override
    public int getItemCount() {
        return images.size();
    }

    public class MyViewHolder extends RecyclerView.ViewHolder{
        public ImageView iv;
        public CheckBox cb;
        public MyViewHolder(View itemView) {
            super(itemView);
            iv=itemView.findViewById(R.id.iv);
            cb=itemView.findViewById(R.id.cb);
        }

    }

}
完整代碼

PhotoPickerActivity

public class PhotoPickerActivity extends Activity implements View.OnClickListener {
    private static final String TAG = "PhotoPickerActivity";
    private ArrayList<String> fileNames;
    private PhotoPickerAdapter mPhotoPickerAdapter;
    Handler mHandler = new Handler() {
        @Override
        public void handleMessage(Message msg) {
            Log.i(TAG, "handleMessage: 完成");
            mRv.setAdapter(mPhotoPickerAdapter = new PhotoPickerAdapter(fileNames));
        }
    };
    private RecyclerView mRv;

    @Override
    protected void onCreate(@Nullable Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_photo);
        mRv = findViewById(R.id.rv);
        mRv.setLayoutManager(new GridLayoutManager(this, 3));
        mRv.addItemDecoration(new SpaceItemDecoration(5));
        getImages();
    }


    private void getImages() {

        new Thread(new Runnable() {
            @Override
            public void run() {
                fileNames = new ArrayList();
                Cursor cursor = getContentResolver().query(
                        MediaStore.Images.Media.EXTERNAL_CONTENT_URI, null, null, null, null);
                if (cursor == null) {
                    Log.i(TAG, "run: 空");
                    return;
                }
                while (cursor.moveToNext()) {
                    //獲取圖片的地址
                    byte[] data = cursor.getBlob(cursor.getColumnIndex(MediaStore.Images.Media.DATA));
                    fileNames.add(new String(data, 0, data.length - 1));
                    Log.i(TAG, "run: " + new String(data, 0, data.length - 1));
                }
                mHandler.sendMessage(mHandler.obtainMessage());
                cursor.close();
            }
        }).start();
    }
    @Override
    public void onClick(View view) {
        switch (view.getId()) {
            case R.id.confirm:
                StringBuffer stringBuffer = new StringBuffer();
                stringBuffer.append("選中的圖片"+"\r\n");
                ArrayList<String> arrayList = mPhotoPickerAdapter.getImages();
                for (int i = 0; i < arrayList.size(); i++) {
                    String  s=arrayList.get(i);
                    String[]  strs=  s.split("/");
                    stringBuffer.append(strs[strs.length-1]+"\r\n");
                }
                Toast.makeText(PhotoPickerActivity.this,stringBuffer.toString(),Toast.LENGTH_SHORT).show();
                break;
        }
    }
}

activity_photo

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
              android:orientation="vertical"
              android:layout_width="match_parent"
              android:layout_height="match_parent">


    <android.support.v7.widget.RecyclerView
        android:layout_weight="1"
        android:background="#272727"
        android:id="@+id/rv"
        android:layout_width="match_parent"
        android:layout_height="match_parent">
    </android.support.v7.widget.RecyclerView>

    <RelativeLayout
        android:background="@android:color/white"
        android:layout_width="match_parent"
        android:layout_height="40dp">
        <TextView
            android:onClick="onClick"
            android:id="@+id/confirm"
            android:background="#0094ff"
            android:layout_alignParentRight="true"
            android:layout_margin="5dp"
            android:text="確定"
            android:textColor="#844200"
            android:gravity="center"
            android:textSize="14sp"
            android:layout_width="60dp"
            android:layout_height="match_parent"/>
    </RelativeLayout>
</LinearLayout>

SpaceItemDecoration

public class SpaceItemDecoration extends RecyclerView.ItemDecoration {
    private  int  space;
    public SpaceItemDecoration(int space) {
        this.space = space;
    }

    @Override
    public void getItemOffsets(Rect outRect, View view,
                               RecyclerView parent, RecyclerView.State state) {
        outRect.left = space;
        outRect.right = space;
        outRect.bottom = space;

        // Add top margin only for the first item to avoid double space between items
       // if(parent.getChildPosition(view) != 0)
            outRect.top = space;
    }
}

PhotoPickerAdapter

public class PhotoPickerAdapter extends RecyclerView.Adapter<PhotoPickerAdapter.MyViewHolder> {
    private ArrayList<String> images;
    private ArrayList<Boolean> cb;
    private Context mContext;
    public PhotoPickerAdapter(ArrayList<String> images){
        this.images=images;
        cb=new ArrayList<>();
        for (int i = 0; i < images.size(); i++) {
            cb.add(false);
        }
    }

    public ArrayList<String> getImages(){
        ArrayList<String> strings =new ArrayList<>();
        for (int i = 0; i < cb.size(); i++) {
            if(cb.get(i)){
                strings.add(images.get(i));
            }
        }
        return strings;
    }
    @Override
    public MyViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
        mContext=parent.getContext();
        MyViewHolder holder = new MyViewHolder(LayoutInflater.from(
                mContext).inflate(R.layout.photo_item, parent,
                false));
        return holder;
    }

    @Override
    public void onBindViewHolder(final MyViewHolder holder, final int position) {
        Glide.with(mContext)
                .load(images.get(position))
                .crossFade()
                .into(holder.iv);

        holder.cb.setOnCheckedChangeListener(new CompoundButton.OnCheckedChangeListener() {
            @Override
            public void onCheckedChanged(CompoundButton compoundButton, boolean b) {
                cb.set(position,b);
                holder.iv.setAlpha(cb.get(position)==true?0.5f:1f);
            }
        });
        holder.cb.setChecked(cb.get(position));
        holder.iv.setAlpha(cb.get(position)==true?0.5f:1f);

    }

    @Override
    public int getItemCount() {
        return images.size();
    }

    public class MyViewHolder extends RecyclerView.ViewHolder{
        public ImageView iv;
        public CheckBox cb;
        public MyViewHolder(View itemView) {
            super(itemView);
            iv=itemView.findViewById(R.id.iv);
            cb=itemView.findViewById(R.id.cb);
        }

    }

}

photo_item

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
              android:orientation="vertical"
              android:descendantFocusability="blocksDescendants"
              android:layout_width="match_parent"
              android:layout_height="120dp">
    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content">
        <ImageView
            android:scaleType="centerCrop"
            android:id="@+id/iv"
            android:layout_width="match_parent"
            android:layout_height="120dp"/>
        <CheckBox
            android:layout_marginTop="5dp"
            android:layout_marginRight="5dp"
            android:layout_alignParentRight="true"
            android:id="@+id/cb"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"/>
    </RelativeLayout>

</LinearLayout>
最后編輯于
?著作權歸作者所有,轉載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末艇肴,一起剝皮案震驚了整個濱河市腔呜,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌再悼,老刑警劉巖核畴,帶你破解...
    沈念sama閱讀 206,214評論 6 481
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場離奇詭異冲九,居然都是意外死亡谤草,警方通過查閱死者的電腦和手機,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 88,307評論 2 382
  • 文/潘曉璐 我一進店門莺奸,熙熙樓的掌柜王于貴愁眉苦臉地迎上來丑孩,“玉大人,你說我怎么就攤上這事灭贷∥卵В” “怎么了?”我有些...
    開封第一講書人閱讀 152,543評論 0 341
  • 文/不壞的土叔 我叫張陵甚疟,是天一觀的道長仗岖。 經(jīng)常有香客問我,道長览妖,這世上最難降的妖魔是什么轧拄? 我笑而不...
    開封第一講書人閱讀 55,221評論 1 279
  • 正文 為了忘掉前任,我火速辦了婚禮讽膏,結果婚禮上檩电,老公的妹妹穿的比我還像新娘。我一直安慰自己府树,他們只是感情好是嗜,可當我...
    茶點故事閱讀 64,224評論 5 371
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著挺尾,像睡著了一般鹅搪。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上遭铺,一...
    開封第一講書人閱讀 49,007評論 1 284
  • 那天丽柿,我揣著相機與錄音,去河邊找鬼魂挂。 笑死甫题,一個胖子當著我的面吹牛,可吹牛的內(nèi)容都是我干的涂召。 我是一名探鬼主播坠非,決...
    沈念sama閱讀 38,313評論 3 399
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼果正!你這毒婦竟也來了炎码?” 一聲冷哼從身側響起盟迟,我...
    開封第一講書人閱讀 36,956評論 0 259
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎潦闲,沒想到半個月后攒菠,有當?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 43,441評論 1 300
  • 正文 獨居荒郊野嶺守林人離奇死亡歉闰,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 35,925評論 2 323
  • 正文 我和宋清朗相戀三年辖众,在試婚紗的時候發(fā)現(xiàn)自己被綠了。 大學時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片和敬。...
    茶點故事閱讀 38,018評論 1 333
  • 序言:一個原本活蹦亂跳的男人離奇死亡凹炸,死狀恐怖,靈堂內(nèi)的尸體忽然破棺而出昼弟,到底是詐尸還是另有隱情还惠,我是刑警寧澤,帶...
    沈念sama閱讀 33,685評論 4 322
  • 正文 年R本政府宣布私杜,位于F島的核電站,受9級特大地震影響救欧,放射性物質(zhì)發(fā)生泄漏衰粹。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點故事閱讀 39,234評論 3 307
  • 文/蒙蒙 一笆怠、第九天 我趴在偏房一處隱蔽的房頂上張望铝耻。 院中可真熱鬧,春花似錦蹬刷、人聲如沸瓢捉。這莊子的主人今日做“春日...
    開封第一講書人閱讀 30,240評論 0 19
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽泡态。三九已至,卻和暖如春迂卢,著一層夾襖步出監(jiān)牢的瞬間某弦,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 31,464評論 1 261
  • 我被黑心中介騙來泰國打工而克, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留靶壮,地道東北人。 一個月前我還...
    沈念sama閱讀 45,467評論 2 352
  • 正文 我出身青樓员萍,卻偏偏與公主長得像腾降,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子碎绎,可洞房花燭夜當晚...
    茶點故事閱讀 42,762評論 2 345

推薦閱讀更多精彩內(nèi)容