GitHub Pagesへ移行しましたmixi-inc.github.ioへお願いします。

目次

ListView

ListAdapter

ListView を表示する

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
 xmlns:tools="http://schemas.android.com/tools"
 android:layout_width="match_parent"
 android:layout_height="match_parent"
 tools:context=".MainActivity" >
 <!-- ListViewを配置 -->
 <ListView
 android:id="@+id/ListView"
 android:layout_width="match_parent"
 android:layout_height="match_parent" />
</RelativeLayout>

 @Override
 protected void onCreate(Bundle savedInstanceState) {
 super.onCreate(savedInstanceState);
 setContentView(R.layout.activity_main);
 mActivity = this;
 // ListViewに表示するデータを作成する
 ArrayList<String> list = new ArrayList<String>();
 for (int i = 0; i < 20; i++) {
 list.add("hoge" + i);
 }
 ListView listView = (ListView) findViewById(R.id.ListView);
 // android.R.layout.simple_list_item_1はAndroidで既に定義されているリストアイテムのレイアウトです
 ArrayAdapter<String> adapter = new ArrayAdapter<String>(mActivity,
 android.R.layout.simple_list_item_1, list);
 listView.setAdapter(adapter);
 // タップした時の動作を定義する
 listView.setOnItemClickListener(new OnItemClickListener() {
 @Override
 public void onItemClick(AdapterView<?> parent, View view, int position, long id) {
 // Adapterからタップした位置のデータを取得する
 String str = (String) parent.getItemAtPosition(position);
 Toast.makeText(mActivity, str, Toast.LENGTH_SHORT).show();
 }
 });
 }

カスタマイズしたリストアイテムを表示する

リストアイテムのレイアウトxmlを作成する

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
 xmlns:tools="http://schemas.android.com/tools"
 android:layout_width="match_parent"
 android:layout_height="wrap_content"
 android:layout_margin="4dp" >
 <ImageView
 android:id="@+id/imageView1"
 android:layout_width="wrap_content"
 android:layout_height="wrap_content"
 android:layout_alignParentLeft="true"
 android:layout_alignParentTop="true"
 android:src="@drawable/ic_launcher" />
 <TextView
 android:id="@+id/TitleText"
 android:layout_width="wrap_content"
 android:layout_height="wrap_content"
 android:layout_alignParentRight="true"
 android:layout_alignParentTop="true"
 android:layout_toRightOf="@+id/imageView1"
 android:textSize="18sp" />
 <TextView
 android:id="@+id/SubTitleText"
 android:layout_width="wrap_content"
 android:layout_height="wrap_content"
 android:layout_alignLeft="@+id/TitleText"
 android:layout_alignParentRight="true"
 android:layout_below="@+id/TitleText" />
</RelativeLayout>

独自 Adapter を作成します

public class CustomListItemAdapter extends ArrayAdapter<String> {
 private LayoutInflater mLayoutInflater;
 public CustomListItemAdapter(Context context, List<String> objects) {
 // 第2引数はtextViewResourceIdとされていますが、カスタムリストアイテムを使用する場合は特に意識する必要のない引数です
 super(context, 0, objects);
 // レイアウト生成に使用するインフレーター
 mLayoutInflater = (LayoutInflater) context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
 }
 @Override
 public View getView(int position, View convertView, ViewGroup parent) {
 View view = null;
 // ListViewに表示する分のレイアウトが生成されていない場合レイアウトを作成する
 if (convertView == null) {
 // レイアウトファイルからViewを生成する
 view = mLayoutInflater.inflate(R.layout.custom_list_item, parent, false);
 } else {
 // レイアウトが存在する場合は再利用する
 view = convertView;
 }
 // リストアイテムに対応するデータを取得する
 String item = getItem(position);
 // 各Viewに表示する情報を設定
 TextView text1 = (TextView) view.findViewById(R.id.TitleText);
 text1.setText("Title:" + item);
 TextView text2 = (TextView) view.findViewById(R.id.SubTitleText);
 text2.setText("SubTitle:" + item);
 return view;
 }
}

View の再利用について

 @Override
 public View getView(int position, View convertView, ViewGroup parent) {
 View view = null;
 // ListViewに表示する分のレイアウトが生成されていない場合レイアウトを作成する
 if (convertView == null) {
 // レイアウトファイルからViewを生成する
 view = mLayoutInflater.inflate(R.layout.custom_list_item, parent, false);
 
 // リストアイテムに対応するデータを取得する
 String item = getItem(position);
 // 各Viewに表示する情報を設定
 TextView text1 = (TextView) view.findViewById(R.id.TitleText);
 text1.setText("Title:" + item);
 TextView text2 = (TextView) view.findViewById(R.id.SubTitleText);
 text2.setText("SubTitle:" + item);
 } else {
 // レイアウトが存在する場合は再利用する
 view = convertView;
 }
 // 一度作成したレイアウトの表示データを変更しないことにより、再利用されたデータがどこに表示されるかを確認する
 return view;
 }

パフォーマンスについて

ViewPager

PagerAdapter

PagerAdapterの使い方

ViewPagerをレイアウトxmlに配置

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
 xmlns:tools="http://schemas.android.com/tools"
 android:layout_width="match_parent"
 android:layout_height="match_parent"
 tools:context=".MainActivity" >
 <android.support.v4.view.ViewPager
 android:id="@+id/Pager"
 android:layout_width="match_parent"
 android:layout_height="match_parent" />
</RelativeLayout>

独自 PagerAdapter を実装

class SamplePagerAdapter extends PagerAdapter {
 private static final int PAGE_COUNT = 5;
 private Context mContext;
 public SamplePagerAdapter(Context context) {
 super();
 mContext = context;
 }
 @Override
 public Object instantiateItem(ViewGroup container, int position) {
 // TextViewを生成
 TextView textView = new TextView(mContext);
 textView.setText("Position:" + position);
 //コンテナに追加
 container.addView(textView);
 // ここではTextView自体をキーとして返しています
 return textView;
 }
 @Override
 public void destroyItem(ViewGroup container, int position, Object object) {
 // viewの削除
 // objectはinstantiateItemで返却したオブジェクトです
 container.removeView((View) object);
 }
 @Override
 public int getCount() {
 // ページ数を返します。今回は固定値としています。
 return PAGE_COUNT;
 }
 @Override
 public boolean isViewFromObject(View view, Object object) {
 // キーが正しいかを判定
 return view == (TextView) object;
 }

ViewPagerにAdapterをセットする

 @Override
 protected void onCreate(Bundle savedInstanceState) {
 super.onCreate(savedInstanceState);
 setContentView(R.layout.activity_main);
 ViewPager pager = (ViewPager) findViewById(R.id.Pager);
 pager.setAdapter(new SamplePagerAdapter(this));
 }

FragmentPagerAdapter

FragmentPagerAdapter の使い方

ViewPagerをレイアウトxmlに配置

Fragmentを作成

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
 xmlns:tools="http://schemas.android.com/tools"
 android:layout_width="match_parent"
 android:layout_height="match_parent"
 android:background="@android:color/black" >
 <TextView
 android:id="@+id/TextView1"
 android:layout_width="match_parent"
 android:layout_height="match_parent"
 android:layout_margin="4dp"
 android:background="@android:color/white"
 android:gravity="center"
 android:textSize="90sp"
 android:textStyle="bold" />
</FrameLayout>

public class SampleFragment extends Fragment {
 public static SampleFragment newInstance(int position) {
 SampleFragment sampleFragment = new SampleFragment();
 Bundle bundle = new Bundle();
 bundle.putInt("position", position);
 sampleFragment.setArguments(bundle);
 return sampleFragment;
 }
 @Override
 public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
 Bundle bundle = getArguments();
 int position = 0;
 if (bundle != null) {
 position = bundle.getInt("position");
 }
 View view = inflater.inflate(R.layout.fragment_main, container, false);
 TextView text = (TextView) view.findViewById(R.id.TextView1);
 text.setText(String.valueOf(position));
 return view;
 }
}

独自 FragmentPagerAdapter を実装

public class SampleFragmentPagerAdapter extends FragmentPagerAdapter {
 private static final int PAGE_COUNT = 5;
 public SampleFragmentPagerAdapter(FragmentManager fm) {
 super(fm);
 }
 @Override
 public Fragment getItem(int position) {
 return SampleFragment.newInstance(position);
 }
 @Override
 public int getCount() {
 return PAGE_COUNT;
 }
}

ViewPager に Adapter をセットする

 @Override
 protected void onCreate(Bundle savedInstanceState) {
 super.onCreate(savedInstanceState);
 setContentView(R.layout.activity_main);
 ViewPager pager = (ViewPager) findViewById(R.id.Pager);
 
 FragmentManager fm = getSupportFragmentManager();
 SampleFragmentPagerAdapter sampleFragmentPagerAdapter = new SampleFragmentPagerAdapter(fm);
 
 pager.setAdapter(sampleFragmentPagerAdapter);
 }

実習・課題

ListView

ViewPager