Androidアプリ開発講座

次のプロジェクトをEclipseにインポートしてください。

プロジェクト名

PhotoViewerPart2.zip

リストの一行のなかに、画像とテキストが含まれたレイアウトを実現するなど
複雑なレイアウトに対応する場合は、ArrayAdapterを継承した独自のAdapterを実装する必要があります。

res/layout/custom_list_item.xmlを次の内容に書き換えてください。

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
  android:orientation="horizontal"
  android:layout_width="fill_parent"
  android:layout_height="wrap_content"
  android:padding="10dip"
  >
  <LinearLayout
    android:orientation="horizontal"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:background="#ffffff"
    android:paddingTop="8dip"
    android:paddingBottom="8dip"
    android:paddingLeft="14dip"
    android:paddingRight="14dip"
    >
    <ImageView
      android:id="@+id/imageview"
      android:layout_width="85dip"
      android:layout_height="85dip"
      android:scaleType="centerCrop"
      android:padding="8dip"
      />
    <TextView
      android:id="@+id/textview"
      android:layout_width="wrap_content"
      android:layout_height="fill_parent"
      android:layout_weight="1"
      android:textColor="@color/dark_blue"
      android:background="#ffffff"
      android:layout_marginLeft="16dip"
      android:layout_marginTop="8dip"
      />
  </LinearLayout>
</FrameLayout>

src/jp.co.example.listview/BindData.javaを、次の内容に書き換えてください。

public class BindData {
// ------------ ↓ここから ------------------
	private String text;
	private int imageResourceId;

	public BindData(String text, int id) {
		this.text = text;
		this.imageResourceId = id;
	}

	public String getText() {
		return text;
	}

	public void setText(String text) {
		this.text = text;
	}

	public int getImageResourceId() {
		return imageResourceId;
	}

	public void setImageResourceId(int imageResourceId) {
		this.imageResourceId = imageResourceId;
	}
// ------------ ↑ここまで ------------------
}

src/jp.co.example.listview/ImageAdapter.javaを、次の内容に書き換えてください。

public class ImageAdapter extends ArrayAdapter<BindData> {
// ------------ ↓ここから ------------------
	private LayoutInflater inflater;

	public ImageAdapter(Context context, List<BindData> objects) {
		super(context, 0, objects);
		this.inflater = (LayoutInflater) context
				.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
	}

	@Override
	public View getView(int position, View convertView, ViewGroup parent) {
		if (convertView == null) {
			// 行を表すビューオブジェクトを取得
			convertView = inflater.inflate(R.layout.custom_list_item, parent,
					false);
		}
		// 画像名と日付の表示エリア
		TextView textView = (TextView) convertView.findViewById(R.id.textview);
		// 画像の表示エリア
		ImageView imageView = (ImageView) convertView
				.findViewById(R.id.imageview);
		// 該当ポジションのデータを取得
		BindData data = getItem(position);
		// テキストビューとイメージビューにセット
		textView.setText(data.getText());
		imageView.setImageResource(data.getImageResourceId());

		return convertView;
	}
// ------------ ↑ここまで ------------------
}

src/jp.co.example.listview/PhotoViewerActivity.javaを、次の内容に書き換えてください。

public class PhotoViewerActivity extends ListActivity {
// ------------ ↓ここから ------------------
	private Integer[] mThumbIds = {
			R.drawable.image1,
			R.drawable.image2,
			R.drawable.image3,
			R.drawable.image4,
			R.drawable.image5,
			R.drawable.image6 };

	private String[] mTitles = {
			"image1\n\n2010/11/20",
			"image2\n\n2010/11/21",
			"image3\n\n2010/11/22",
			"image4\n\n2010/11/23",
			"image5\n\n2010/11/24",
			"image6\n\n2010/11/25" };

	@Override
	public void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.custom_list);
	
		// BindDataのリストを生成し、アダプターにセット
		List<BindData> objects = new ArrayList<BindData>();
		for(int i = 0; i < mTitles.length; i++) {
			BindData data =
				new BindData(mTitles[i], mThumbIds[i]);
			objects.add(data);
		}
		setListAdapter(new ImageAdapter(this, objects));
	}
// ------------ ↑ここまで ------------------
}

次のように表示されましたか？