AndroidのListView(ArrayAdapter)を拡張するサンプル@tryListView02

2012年3月6日 aa android, 0

ListViewを拡張して、選択されたものだけ内容を展開するようにする。
同じ項目があっても正常に動作するようにする。
ArrayAdapterを拡張しないとダメらしいのでそのようにする。
選択されたものだけ本文を全部表示して、それ以外のものは「…」を表示するようにする。

ListViewの拡張
選択されたビューだけすべての文字列を表示する。
選択されたビュー以外の文字が長すぎる場合「…」省略記号を付けて省略するようにする。
選択されたビューの背景の色を固定化する。

●新しいレイアウトのビューを作る
res/layout/item.xmlを追加
ViewHolderを作る
CustomArrayAdapterDataとCustomArrayAdapterを作る

●選択を有効にする
CheckableLinerLayoutを作る
ListViewのプロパティのChoice modeをsingleChoiceに。
拡張したビュー(res/layout/item.xml)のLinearLayoutを拡張したCheckableLinearLayoutに変更
““を”“に変更

●カスタムビューに使う色の定義
res/value/color.xml(この名前は変更してはいけない)を追加
res/drawable/item_colors.xmlを追加
layout/item.xmlのBackgroundの要素を@drawable/item_colorsに設定

●使ってるもの
setSingleLine();
LayoutInflater
Context.LAYOUT_INFLATER_SERVICE
mergeDrawableStates

package trial.sample.trylistview02;

import android.app.Activity;
import android.content.Context;
import android.os.Bundle;
import android.util.AttributeSet;
import android.util.Log;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.view.Window;
import android.widget.AdapterView;
import android.widget.AdapterView.OnItemClickListener;
import android.widget.ArrayAdapter;
import android.widget.Checkable;
import android.widget.LinearLayout;
import android.widget.ListView;
import android.widget.TextView;

//////////////////////////////////////////////////////////////////

//////////////////////////////////////////////////////////////////
public class TryListView02Activity extends Activity implements OnItemClickListener {
	
	private ListView mListView;	// リストビュー
	private CustomArrayAdapter mAdapter; // アダプタ
	
    /** Called when the activity is first created. */
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        this.requestWindowFeature(Window.FEATURE_NO_TITLE);
        setContentView(R.layout.main);
        
        //////////////////////////////////////////////////////////////////
        // アダプタをリストビューにセットする
        //
        // アダプタを作る
        this.mAdapter = new CustomArrayAdapter(this, R.layout.item);
        // アダプタに項目を追加する
        this.mAdapter.add(new CustomArrayAdapterData("何か長い文章を考えなきゃいけないんだけど、そうそういい文章がうかぶわけないよねー。"));
        this.mAdapter.add(new CustomArrayAdapterData("作家さんってすごいと思うんだ。"));
        this.mAdapter.add(new CustomArrayAdapterData("今週は楽しみにしてた新しいやつの発売だ！"));
        this.mAdapter.add(new CustomArrayAdapterData("android 4.0って使いやすいけど、開発はやっぱ2.2くらいのやつからやらないとだめなんだよね。"));
        this.mAdapter.add(new CustomArrayAdapterData("いっそのこと2.3くらいまで上げてやってしまおうか？"));
        this.mAdapter.add(new CustomArrayAdapterData("----２２２２２２２２２２２----"));
        this.mAdapter.add(new CustomArrayAdapterData("何か長い文章を考えなきゃいけないんだけど、そうそういい文章がうかぶわけないよねー。"));
        this.mAdapter.add(new CustomArrayAdapterData("作家さんってすごいと思うんだ。"));
        this.mAdapter.add(new CustomArrayAdapterData("今週は楽しみにしてた新しいやつの発売だ！"));
        this.mAdapter.add(new CustomArrayAdapterData("android 4.0って使いやすいけど、開発はやっぱ2.2くらいのやつからやらないとだめなんだよね。"));
        this.mAdapter.add(new CustomArrayAdapterData("いっそのこと2.3くらいまで上げてやってしまおうか？"));
        this.mAdapter.add(new CustomArrayAdapterData("----３３３３３３３３３３３----"));
        this.mAdapter.add(new CustomArrayAdapterData("何か長い文章を考えなきゃいけないんだけど、そうそういい文章がうかぶわけないよねー。"));
        this.mAdapter.add(new CustomArrayAdapterData("作家さんってすごいと思うんだ。"));
        this.mAdapter.add(new CustomArrayAdapterData("今週は楽しみにしてた新しいやつの発売だ！"));
        this.mAdapter.add(new CustomArrayAdapterData("android 4.0って使いやすいけど、開発はやっぱ2.2くらいのやつからやらないとだめなんだよね。"));
        this.mAdapter.add(new CustomArrayAdapterData("いっそのこと2.3くらいまで上げてやってしまおうか？"));
        
        // リストビューにアダプタを登録する
        //
        this.mListView = (ListView)this.findViewById(R.id.listView1);
        this.mListView.setAdapter(this.mAdapter);
        this.mListView.setOnItemClickListener(this);
        //////////////////////////////////////////////////////////////////
    }

    /** リストビューが選択された */
	public void onItemClick(AdapterView<?> adapter, View view, int position, long id) {
		this.mAdapter.select(position);
	}
}

//////////////////////////////////////////////////////////////////
// ArrayAdapterの中で使うデータ
class CustomArrayAdapterData {
	String text; // テキスト
	
	/** コンストラクタ */
	public CustomArrayAdapterData(String text) {
		this.text = text;
	}
}

//////////////////////////////////////////////////////////////////
// リストビュー内の項目と関連付けるデータ
class ViewHolder {
	TextView text;
	TextView subText;
}

//////////////////////////////////////////////////////////////////
// ArrayAdapterの拡張
class CustomArrayAdapter extends ArrayAdapter<CustomArrayAdapterData> {

	private LayoutInflater mInflater; // レイアウトXMLファイルからビューを作ってくれるもの
	private int mLayoutId;	// このアダプタのレイアウトID
	private int mSelectedItem;	// 選択されているアイテム
	
	/** コンストラクタ */
	public CustomArrayAdapter(Context context, int layoutId) {
		super(context, layoutId);
		
		// ビューを作るためのサービスを取り出す
		this.mInflater = (LayoutInflater)context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
		this.mLayoutId = layoutId;
		
		this.mSelectedItem = -1;
	}

	/** 選択されているものを設定する */
	public void select(int position) {
		// 新しく選択されたものをセットする
		this.mSelectedItem = position;
		
		// 変更を通知する
		this.notifyDataSetChanged();
	}

	/** ビューに変化があった時に呼ばれる */
	@Override
	public View getView(int position, View convertView, ViewGroup parent) {
		View view = convertView;
		ViewHolder vh = null;
		
		// 初期状態
		if (view == null) {
			Log.v("[N]getView", "position=" + position + " convertView=" + convertView);
			
			//////////////////////////////////////////////////////////////////
			// カスタムビューをリストビューに登録する
			view = this.mInflater.inflate(this.mLayoutId, parent, false);
			vh = new ViewHolder();
			vh.text = (TextView)view.findViewById(R.id.item_text);
			vh.subText = (TextView)view.findViewById(R.id.item_sub_text);
			//////////////////////////////////////////////////////////////////
			
			// ビューに登録する
			view.setTag(vh);
		} else {
			Log.v("[R]getView", "position=" + position + " convertView=" + convertView);
			vh = (ViewHolder)view.getTag();
		}
		
		// 今設定しないといけないアイテムを取り出す
		CustomArrayAdapterData data = (CustomArrayAdapterData)this.getItem(position);
		vh.text.setText(data.text);
		
		// 選択されているものはすべての文章を表示
		if (this.mSelectedItem == position) {
			vh.subText.setText("選択中！");
			
			//////////////////////////////////////////////////////////////////
			// 文字列を全てを表示する
			vh.text.setSingleLine(false);
			//////////////////////////////////////////////////////////////////
			
		// 未選択のもので長すぎるものは「...」を表示。
		} else {
			vh.subText.setText("");
			
			//////////////////////////////////////////////////////////////////
			// 文字列が長すぎる場合は「...」を表示する
			vh.text.setSingleLine();
			//////////////////////////////////////////////////////////////////
		}
		
		return view;
	}
}

//////////////////////////////////////////////////////////////////
// 選択したときに背景色を変えたままにするようなレイアウト
// Single Choiceするために必要なもの
class CheckableLinearLayout extends LinearLayout implements Checkable {

	private boolean mChecked;	// ﾁｪｯｸされているかどうか
	private static final int[] CHECKED_STATE_SET = {
		android.R.attr.state_checked
	};
	
	/** コンストラクタ */
	public CheckableLinearLayout(Context context) {
		super(context);
		// TODO 自動生成されたコンストラクター・スタブ
	}
	
	/** コンストラクタ */
	public CheckableLinearLayout(Context context, AttributeSet attrs) {
		super(context, attrs);
	}
	
	/** 選択されているかどうかを返すもの */
	public boolean isChecked() {
		return this.mChecked;
	}
	
	/** 選択されたときに呼ばれるようなものかな？ */
	public void setChecked(boolean checked) {
		if (this.mChecked != checked) {
			this.mChecked = checked;
			this.refreshDrawableState();
		}
	}
	/** 選択と選択解除の切り替えの時に呼ばれる感じ？ */
	public void toggle() {
		this.mChecked = !this.mChecked;
		this.refreshDrawableState();
	}
	/** これなんだろね？やってることはステータスの変更だけど */
	@Override
	protected int[] onCreateDrawableState(int extraSpace) {
		// 新しいオプションを追加するためにextraSpaceより１つ多めの領域を作ってる？
		final int[] drawableState = super.onCreateDrawableState(extraSpace + 1);
		if (this.isChecked()) {
			// android.R.attr.state_checked機能を追加するようにする
			mergeDrawableStates(drawableState, CHECKED_STATE_SET);
		}
		return drawableState;
	}
	
}

java, ListView, サンプルプログラム

AndroidのListViewで未選択の時に省略記号を表示するサンプル@tryListView01 GLES20の解説書

AndroidのListView(ArrayAdapter)を拡張するサンプル@tryListView02

コメントを残すコメントをキャンセル

買った良かったベスト５！

こんな事をやってます

参考になりそうなもの

カテゴリー

最近の投稿

←に関連してる記事

AAKAKAxSOFTのつぶやき

AndroidのListView(ArrayAdapter)を拡張するサンプル@tryListView02

コメントを残す コメントをキャンセル

買った良かったベスト５！

こんな事をやってます

参考になりそうなもの

カテゴリー

最近の投稿

←に関連してる記事

AAKAKAxSOFTのつぶやき

コメントを残すコメントをキャンセル