コンピュータクワガタ

かっぱのかっぱによるコンピュータ関連のサイトです

Androidアプリ入門 No.27 GridViewの基本

GridView

GridViewの基本

GridViewの主な属性は以下。

属性 説明
columnWidth 列の幅。
numColumns 列の数。
verticalSpacing 垂直方向のグリッド間のスペース。
horizontalSpacing 水平方向のグリッド間のスペース。

まず、columnWidth、numColumns、verticalSpacing、horizontalSpacingの例を確認する。まず、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="fill_parent" 
    android:layout_height="fill_parent"
    android:columnWidth="60dp"
    android:numColumns="auto_fit"
    android:verticalSpacing="15dp"
    android:horizontalSpacing="15dp"
/>

Gridに表示するAdapterをBaseAdapterを継承してTextAdapter.javaを作成する。

package sample.at;

import android.content.Context;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import android.widget.TextView;

public class TextAdapter extends BaseAdapter {
    private Context context;
    private String[] strings;

    public TextAdapter(Context context) {
        this.context = context;
        strings = new String[100];

        for (int i = 0; i < strings.length; i++) {
            strings[i] = i + "番目";
        }
    }

    @Override
    public View getView(int position, View convertView, ViewGroup parent) {
        TextView textView = null;

        if (convertView == null) {
            textView = new TextView(context);
        } else {
            textView = (TextView) convertView;
        }
        textView.setText(strings[position]);

        return textView;
    }

    @Override
    public long getItemId(int position) {
        return 0;
    }

    @Override
    public Object getItem(int position) {
        return null;
    }

    @Override
    public int getCount() {
        return strings.length;
    }
}

ここで、getViewの中身に注目する。getViewの引数は以下のようになっている。

引数 説明
position ビューの何番目が必要になったが。
convertView 可能な場合不要なビューを再利用する。膨大な量の情報を出力する場合にオブジェクトを可能な限り再利用する。nullの場合には再利用できるオブジェクトがないため、オブジェクトを生成する。
parent 選択されたAdapterのビューとなる。要するにGridViewを取得できる。

特にほかの場合もそうだが、convertViewが非常に重要になる。今回はテキストを表示しているので大したことはないが、携帯端末ということでメモリ領域が非常に限られる場合がある。その場合に大量の画像等を表示するとヒープ領域が足りなくなる恐れがある。そのため、再利用可能なViewがconvertViewとしてgetViewの引数に渡されるので適切に再設定してオブジェクトを使用する。
最後に、MainActivity.javaを作成する。

package sample.at;

import android.app.Activity;
import android.os.Bundle;
import android.widget.GridView;

public class MainActivity extends Activity {
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);

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

実行結果は以下のようになる。numColumnsをauto_fitにしているためはみ出さないちょうどいい状態で表示される。

main.xmlのcolumnWidthを6にしてどうなるか確認する。

<?xml version="1.0" encoding="utf-8"?>
<GridView xmlns:android="http://schemas.android.com/apk/res/android" 
    android:id="@+id/gridview"
    android:layout_width="fill_parent" 
    android:layout_height="fill_parent"
    android:columnWidth="60dp"
    android:numColumns="6"
    android:verticalSpacing="15dp"
    android:horizontalSpacing="15dp"
/>

実行結果は以下のようになる。

次に逆にmain.xmlのcolumnWidthを2にしてどうなるか確認する。

<?xml version="1.0" encoding="utf-8"?>
<GridView xmlns:android="http://schemas.android.com/apk/res/android" 
    android:id="@+id/gridview"
    android:layout_width="fill_parent" 
    android:layout_height="fill_parent"
    android:columnWidth="60dp"
    android:numColumns="2"
    android:verticalSpacing="15dp"
    android:horizontalSpacing="15dp"
/>

実行結果は以下のようになる。サイズとしては余裕があるちょうど半分になるようにグリッドがレイアウトされる。