【Android】多圖選擇器(支持圖片預覽 高效加載不怕OOM)

      現在凡是設計到圖片上傳的 Android App 一般都免不了"圖片選擇器"的模塊。偷懶的直接調用系統的圖庫讓用戶一張一張的添加(比如知乎)，但大多數還是自己造輪子實現一次添加多張圖片的功能。在這塊，騰訊系的一些App都做的不錯，圖片加載速度非常塊絲毫沒有卡頓之感，還支持圖片預覽和編輯。現在自己手頭上在做的一個項目也涉及到了這個，本來是調用系統圖庫，但是我覺得每次都只能添加一張體驗並不好，於是準備自己寫一個換掉。目前實現的效果就是多圖選擇預覽,預覽支持圖片手勢縮放。

視頻演示地址:http://v.youku.com/v_show/id_XMTM3ODM3MzcyMA==.html?firsttime=0&from=y1.4-2

gif 圖 製作出了點問題，暫時先放幾張效果圖

                        

     功能貌似並不難，但是實際實現過程中還是會遇到一些問題

大致思路:

1. 圖片是通過系統提供的Content Provider 讀取的，獲取到的是圖片對應的Uri

2. 採用GridView 用於佈局圖片：

1) 已選圖片的Item 佈局就是2個ImageView，一個用來防止圖片，一個用作刪除按鈕。

2) 選擇圖片頁面的Item佈局是一個ImageView 和 一個CheckBox

3.圖片的加載使用的是強大的第三方圖片緩存庫Fresco,預覽圖片是使用第三方庫Gesture-ImageView 用於支持圖片    的手勢縮放。 開始圖片的加載使用的是Picasso ,但滾動的時候會有卡頓，改用Fresco後近千張圖 隨便滑。

4.Activity 之間的跳轉需要傳遞“被選圖片”列表 ArrayList<ImageBean>,這裏的ImageBean是我自定義的， 用於存儲圖    片信息。這裏要注意的是ImageBean 要實現Serializable 接口，同時ImageBean中所有的屬性必須是基本數據類型      或者是實現了Serializable接口的對象。這樣傳遞ArrayList<ImageBean> 再加一個Serializable強轉就可以了。

具體代碼如下:

/**
 * Created by mummyding on 15-11-3.
 */
public class ImageBean implements Serializable{
    private String imageUri;
    private boolean isChecked;
    private int ID;

    public int getID() {
        return ID;
    }

    public ImageBean setID(int ID) {
        this.ID = ID;
        return this;
    }

    public String getImageUri() {
        return imageUri;
    }

    public ImageBean setImageUri(String imageUri) {
        this.imageUri = imageUri;
        return this;
    }

    public boolean isChecked() {
        return isChecked;
    }

    public void setIsChecked(boolean isChecked) {
        this.isChecked = isChecked;
    }
}

查了下，Uri是沒有實現Serializable接口的，於是就存儲Uri對應的字符串，這裏使用實現了Serializable的String。

5.前面說到了，選擇圖片界面中的Item 我是使用ImageView + CheckBox，這裏有大坑！！！ 你點擊GridView的CheckBox再向下翻幾頁後你會發現你本沒有選的CheckBox也處於選中狀態，然後你再滑回去之前本被你選中的CheckBox 可能又處於非選中狀態，CheckBox的狀態是混亂的！！ 不僅僅是GridView，ListView也會出現這種情況，它倆繼承的是同一個父類。這是由於它們的重用機制導致的。於是我這裏是在getView中從ImageBean中獲取狀態值再手動設置CheckBox狀態。

6. 選擇圖片界面的預覽圖片我是使用OnItemClick觸發的，但是這裏的CheckBox會"奪去"Item的焦點，導致       OnItemClick無法響應。我們可以在XML中將CheckBox的focusable屬性設爲false。

7. 預覽圖片的時候需要提供圖片格式，也就是說要根據Uri 找到原圖。顯然，直接讀取原圖很可能造成OOM，所以我   在讀取的時候是讀取它的縮略圖(寬度與手機屏幕大小一直)。其中使用到的方法之前在【Android】自定義圓形ImageView(圓形頭像 可指定大小) 有使用到。

最後附上項目中類 截圖

當然，這個Demo實際上細節還不少，需要自己動手才清楚。

-----------------------------------update 2015.11.08--------------------------------

更換了圖片預覽手勢縮放控件 將Gesture-ImageView 換成了更加強大的PhotoView。

現在還要藉助這些優秀的開源庫，現在要逐步自己實現了～_~

完整代碼: https://github.com/MummyDing/MultiImageChooser/  (如果覺得好 就不要吝嗇你的star吧~_~)

【轉載請註明出處】

Author: MummyDing

出處:http://blog.csdn.net/mummyding/