2012年11月1日木曜日

Android GridViewにSDカードの画像を表示する

前回「Android GridView 基本的な使い方」に続いてGridViewにSDカードの画像を表示します。

  1. GridView内で画像を表示するViewを作成する。
  2. GridViewに画像を設定するためのアダプターを作成する
  3. データとなるSDカード内の画像を配列に取得する
  4. グリッドにアダプターを設定する

Android 4.0 / API 14

まずMainActivityのレイアウトです。
GridViewを配置します。
res/layout/activity_main.xml
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/container"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity" >

    <GridView
        android:id="@+id/gridView1"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:horizontalSpacing="10dp"
        android:numColumns="3"
        android:verticalSpacing="10dp" >
    </GridView>

</FrameLayout>

次にGridView内で画像を表示するためのレイアウトを作成します。
ImageViewを配置します。
res/layout/grid_item.xml
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent" >

    <ImageView
        android:id="@+id/imageView1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/ic_action_search" />

</LinearLayout>

画像を設定するためのアダプターを作成します。
ArrayAdapterを継承して作成します。
getView()メソッドでは先ほど作成したレイアウト「grid_item」よりImageViewを取得し画像を設定しています。
public class BitmapAdapter extends ArrayAdapter<Bitmap> {
 
 //GridView内で画像を表示するために作成したレイアウト
    private static final int RESOURCE_ID = R.layout.grid_item;
    
    private LayoutInflater mInflater;
    
    public BitmapAdapter(Context context, List<Bitmap> objects) {
        super(context, RESOURCE_ID, objects);
        mInflater = (LayoutInflater)context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
        
    }

    @Override
    public View getView(int position, View convertView, ViewGroup parent) {
        if (convertView == null) {
            convertView = mInflater.inflate(RESOURCE_ID, null);
        }
        ImageView imageView = (ImageView) convertView.findViewById(R.id.imageView1);
        imageView.setImageBitmap(getItem(position));
        return convertView;
    }
    
}

MainActivityのコードです。
Androidではすべての画像はデータベースで管理されており、以下のコードでCursorオブジェクトを取得します。
Uri uri = MediaStore.Images.Media.EXTERNAL_CONTENT_URI;
Cursor cursor = getContentResolver().query(uri, null, null, null, null);
SDカードではなく本体に保存された画像を取得するには、「INTERNAL_CONTENT_URI」を指定します。
Uri uri = MediaStore.Images.Media.INTERNAL_CONTENT_URI;
次にCursorオブジェクトをループし、 MediaStore.Images.Thumbnails.getThumbnail()メソッドでサムネイル画像を取得し配列に格納していきます。
※getThumbnail()メソッドはサムネイル画像がなければ生成して返してくれます。
public class MainActivity extends Activity {

    private GridView mGridView = null;
    
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        
        mGridView = (GridView)findViewById(R.id.gridView1);
        
        //グリッド4列表示
        mGridView.setNumColumns(4);
        //表示する画像を取得
        Uri uri = MediaStore.Images.Media.EXTERNAL_CONTENT_URI; //SDカード       
        Cursor cursor = getContentResolver().query(uri, null, null, null, null);
        ContentResolver cr = getContentResolver();
        ArrayList<Bitmap> lstBitmap = new ArrayList<Bitmap>();
        cursor.moveToFirst();   
        for (int i = 0; i < cursor.getCount(); i++){
            long id = cursor.getLong(cursor.getColumnIndexOrThrow("_id"));
            Bitmap bmp = MediaStore.Images.Thumbnails.getThumbnail(cr, id, MediaStore.Images.Thumbnails.MICRO_KIND, null);
            lstBitmap.add(bmp);
            cursor.moveToNext();
        }
        //アダプター作成
        BitmapAdapter adapter = new BitmapAdapter(getApplicationContext(), lstBitmap);
        //グリッドにアダプタを設定
        mGridView.setAdapter(adapter);
        
       
    }
}

0 件のコメント: