Hello, Views (Grid View編)

Grid View | Android Developers

http://developer.android.com/intl/ja/resources/tutorials/views/hello-gridview.html
んー。説明読んでもよくわからない。
とりあえずやってみる。

プロジェクトHelloGridViewを作成します。
アクティビティ名はHelloGridViewとします。
チュートリアルのページから、sample_images.zipをダウンロードし、res/drawable/に展開しておきます。
res/layout/main.xml を開き、以下のように変更します。

<?xml version="1.0" encoding="utf-8"?>
<GridView xmlns:android="http://schemas.android.com/apk/res/android" 
    android:id="@+id/gridview"
    android:layout_width="match_parent" 
    android:layout_height="match_parent"
    android:columnWidth="90dp"
    android:numColumns="auto_fit"
    android:verticalSpacing="10dp"
    android:horizontalSpacing="10dp"
    android:stretchMode="columnWidth"
    android:gravity="center"
/>

src/パッケージ名/HelloGridView.javaを以下のように変更します。

package com.blogspot.logroid.helloGridView;

import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.widget.AdapterView;
import android.widget.AdapterView.OnItemClickListener;
import android.widget.GridView;
import android.widget.Toast;

public class HelloGridView extends Activity {
    /** Called when the activity is first created. */
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);

        GridView gridview = (GridView) findViewById(R.id.gridview);
        gridview.setAdapter(new ImageAdapter(this));

        gridview.setOnItemClickListener(new OnItemClickListener() {
            public void onItemClick(AdapterView<?> parent, View v, int position, long id) {
                Toast.makeText(HelloGridView.this, "" + position, Toast.LENGTH_SHORT).show();
            }
        });
    }
}

新規にクラスファイルを作成します。
クラス名はImageAdapterとします。
スーパークラスはBaseAdapterを指定します。

package com.blogspot.logroid.helloGridView;

import android.content.Context;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import android.widget.GridView;
import android.widget.ImageView;

public class ImageAdapter extends BaseAdapter {
 private Context mContext;

 public ImageAdapter(Context c) {
        mContext = c;
    }

 public int getCount() {
  return mThumbIds.length;
 }

 public Object getItem(int position) {
  // TODO 自動生成されたメソッド・スタブ
  return null;
 }

 public long getItemId(int position) {
  // TODO 自動生成されたメソッド・スタブ
  return 0;
 }

 public View getView(int position, View convertView, ViewGroup parent) {
        ImageView imageView;
        if (convertView == null) {  // if it's not recycled, initialize some attributes
            imageView = new ImageView(mContext);
            imageView.setLayoutParams(new GridView.LayoutParams(85, 85));
            imageView.setScaleType(ImageView.ScaleType.CENTER_CROP);
            imageView.setPadding(8, 8, 8, 8);
        } else {
            imageView = (ImageView) convertView;
        }

        imageView.setImageResource(mThumbIds[position]);
        return imageView;
 }

    // references to our images
    private Integer[] mThumbIds = {
            R.drawable.sample_2, R.drawable.sample_3,
            R.drawable.sample_4, R.drawable.sample_5,
            R.drawable.sample_6, R.drawable.sample_7,
            R.drawable.sample_0, R.drawable.sample_1,
            R.drawable.sample_2, R.drawable.sample_3,
            R.drawable.sample_4, R.drawable.sample_5,
            R.drawable.sample_6, R.drawable.sample_7,
            R.drawable.sample_0, R.drawable.sample_1,
            R.drawable.sample_2, R.drawable.sample_3,
            R.drawable.sample_4, R.drawable.sample_5,
            R.drawable.sample_6, R.drawable.sample_7
    };
}

実行します。

左上の画像をタップしてみました

今回出てきたキーワードについて解説。

GridView

ビューをグリッドで表示することが出来るレイアウト

BaseAdapter

基本的なアダプター
xmlで、ビューを配置するのではなく、java側で要素の数に合わせて繰り返しビューを配置したい場合などに利用する
getCount、getItem、getItemId、getViewを実装すれば良いみたい

getCount

BaseAdapterのメソッド
この数の分だけgetViewで作成したオブジェクトを並べる
今回は、画像を定義したmThumbIdsの長さを返している

getItem

対応するオブジェクトを返す
必要ない場合はnullを返す

getItemId

対応するIDを返す
必要ない場合は0を返す

getView

ビューオブジェクトを返すメソッド
getCountの数分呼ばれる