Androidアプリ開発　画像とアイテムのリストを表示していく

Master-Detailを構築する

Building a Master-Detail User InterFace

Android3.0ではじめていくと、フラグを使って、
アクティビティを事前設定し、結果、いろんなデバイスのサイズ用に
アプリケーションのユーザインターフェースの改良をする上で、
すごい適応性を持つことになります。
１つのポピュラーなユーザインターフェースは、
人々が一般的に使うMaster-Detail関係です。
landscapeモードで（タブレットで）
アプリケーションがデバイス上で走っているときに、
２つのパネルが確認できるでしょう。
左のパネルはアイテムのリストを表示し、
右のパネルは左のパネルで選択されたアイテムについての
詳細を表示します。
もしアプリケーションが、portraitモードで２つのパネルを
表示するデバイス上で走っていたら、
（スマートフォンのような小さいスクリーン上で走っていたら）
左のパネルはアイテムのリストを含んでいて、
スクリーン全体を占める様になります。
リストからアイテムを選んでいくと、選ばれたアイテムについての
詳細をほかのアクティビティがローディングする結果になります。
ここでは、フラグを使ってこのタイプのユーザインターフェースを
どのように構築するかを示します。
まず３つのXMLファイルをres/layoutフォルダに作成していきます。
●選択されたアイテムについて示すユーザインターフェースを
含んでいるXMLファイルーーactivity_detail.xml

●２つのフラグを持つユーザインターフェースを含み、
１つはアイテムのリスト用に、ほかは選択されたアイテムについての
詳細をしめすためのもので、このユーザインターフェースは
デバイスがlandscape指向にある時に表示されます。
ーーactivity_landscape_main.xml

●アイテムのリストを示すユーザインターフェースを含み、
このユーザインターフェースはデバイスが
portrait指向にある時に表示されます。ーーactivity_main.xml
activity_main.xmlの内容は以下のようにします。

activity_landscape_main.xmlファイルの内容は以下のようにします。

activity_detail.xmlファイルの内容は以下のようにします。

開発するアプリケーションのsrcフォルダを見ると３つの追加の
JAVAクラスを含み、加えて、すでにMainActivityクラスが存在してます。
●アイテムのリストを含むフラグーーMasterFragment.java

●選択されたアイテムについての詳細を含むフラグ。
activity_detail.xmlからユーザインターフェースをロードします。
ーーDetailFragment.java

●デバイスがportrait指向の時にアクティビティが表示され、
activity_detail.xmlからユーザインターフェースをロードします。
ーーDetailActivity.java

●アプリケーションが走っているときに呼び出されるアクティビティで、
このアクティビティはMasterFragment.javaとDetailFragment.javaの
クラスをlandscape指向の時にロードします。
portrait指向の時にはMasterFragment.javaクラスをロードします。
ーーMainActivity.java

MainActivity.javaのコードは以下のようにします。

package net.learn2develop.fragmentexample;

import android.content.res.Configuration;
import android.os.Bundle;
import android.support.v4.app.FragmentActivity;
import android.view.Menu;

public class MainActivity extends FragmentActivity{

　 @Override
　 public void onCreate(Bundle savedInstanceState){
　　 super.onCreate(savedInstanceState);
　　 setContentView(R.layout.activity_main);

　　 if(getResources().getConfiguration().orientation ==
　　　　　 Configuration.ORIENTATION_LANDSCAPE){
　　　 //---landscape mode---
　　　 setContentView(R.layout.activity_landscape_main);
　　 }else{
　　　 //---portrait mode---
　　　 setContentView(R.layout.activity_main);
　　 }
　 }

　 @Override
　 public boolean onCreateOptionsMenu(Menu menu){
　　 getMenuInflater().inflate(R.menu.activity_main.menu);
　　 return true;
　 }
}

Mainactivityクラスはランタイムの間、
デバイスがlandscape指向にあるかどうかを調査します。
もしそうなら、
Mainactivityクラスはactivity_landscape_main.xmlから
ユーザインターフェースをロードし、違えば、
activity_main.xmlからユーザインターフェースをロードします。

---

ちょっと注釈

importステートメントにあるandroid.support.v4.app.Fragmentという
パッケージ名を使っていることに注目してください。
このパッケージはAndroid OSの初期バージョンで使える様にしてくれます。

---

次に、DetailFragment.javaファイルのコードを以下のようにします。

package net.learn2develop.fragmentexample;

import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.TextView;
import android.support.v4.app.Fragment;

public class DetailFragment extends Fragment{
　 @Override
　 public void onActivityCreated(Bundle savedInstanceState){
　　 super.onActivityCreated(savedInstanceState);
　 }

　 @Override
　 public View onCreateView(LayoutInflater inflater ViewGroup container,
　　　　 Bundle savedInstanceState){
　　 View view = inflater.inflate(
　　　　 R.layout.activity_detail, container, false);
　　 return view;
　 }

　 public void setSelectedos(String name){
　　 TextView view = (TextView)
　　　　　 getView(9.findViewById(R.id.txtSelectedos);
　　 view.setText("You have selected " + name);
　 }
}


DetailFragmentクラスはFragmentクラスの拡張です。
DetailFragmentクラスはactivity_detail.xmlファイルから
そのユーザインターフェースをロードします。
このクラスでは、setSelectedos()と名付けたメソッドに
選択されたOSの名前を渡すことをMasterFragmentクラスが
できるようにするために関わりを持たせています。
そして、MasterFragment.javaファイルのコードは以下のようにします。

package net.learn2develop.fragmentexample;

import android.content.Intent;
import android.os.Bundle;
import android.view.View;
import android.widget.ArrayAdapter;
import android.widget.ListView;
import android.widget.Toast;
import android.support.v4.app.ListFragment;

public class MasterFragment extends ListFragment{
　　 String[] os = {
　　　　　　　　　 "Linux",
　　　　　　　　　 "Free-BSD",
　　　　　　　　　 "OS_X",
　　　　　　　　　 "Windows"
　　 }

　　 /**Called when the activity is first created */
　　 @Override
　　 public void onCreate(Bundle savedInstanceState){
　　　 super.onCreate(savedInstanceState);
　　　 setListAdapter(new ArrayAdapter<String>(getActivity(),
　　　　　　 android.R.layout.simple_list_item_1, os));
　　 }

　　 public void onListItemClick(ListView parent, View v, int position, long id){
　　　 Toast.makeText(getActivity(), "You have selected " + os[position],
　　　　　　 Toast.LENGTH_SHORT).show();
　　　 String selectedos = os[position];

　　　 DetailFragment detailFragment = (DetailFragment)
　　　　　　 getFragmentManager().findFragmentById(R.id.detailFragment);

　　　 //---if the detail fragment is not in the current activity as myself---
　　　 if (detailFragment != null && detailFragment.isInLayout()){
　　　　　 //---the detail fragment is in the same activity as the master---
　　　　　 detailFragment.setSelectedos(selectedos);
　　　&emsp}else{
　　　　　 //---the detail fragment is in its own activity---
　　　　　 Intent intent = new Intent(getActivity(), DetailActivity.class);
　　　　　 intent.putExtra("os", selectedos);
　　　　　 startActivity(intent);
　　　 }
　 }
}


MasterFragmentクラスがListFragmentクラスの拡張ということを
見ていきます。
ListViewからアイテムが選択された時に、
DetailFragmentクラスもMasterFragmentのようなレイアウトに
現在あるかどうかの判断するためにDetailFragmentクラスの参照を
得る必要があります。
もしそうなら、単純にsetSelectedos()メソッドを
（DetailFragmentクラスの中に定義しました。）
選択されたOS名を渡すために呼び出せば良く、
もし違えば、DetailActivityをスタートするためIntentオブジェクトを
使う必要があり、そして、選択されたOS名を渡すために
setSelectedos()メソッドを使います。
次は、DetailActivity.javaファイルのコードを以下のようにします。

package net.learn2develop.fragmentexample;

import android.app.Activity;
import android.content.res.Configuration;
import android.os.Bundle;
import android.widget.TextView;

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

　　 //---if the user swiches to landscape mode; destroy the activity---
　　 if (getResources().getConfiguration().orientation ==
　　　　　 Configuration.ORIENTATION_LANDSCAPE){
　　　　　　　 finish();
　　　　　　　 return;
　　　　　 }

　　　　　 //---get the data passed from the master fragment---
　　　　　 String name = getIntent().getStringExtra("os");
　　　　　 TextView view = (TextView) findViewById(R.id.txtSelectedos);
　　　　　 view.setText("You have selected " + name);
　 }
}


DetailActivityクラスはActivity基底クラスの拡張で、
このクラスはDetailActivityクラスがlandscape指向の中に
あるかどうかランタイムの間、調査します。
もしそうなら、このクラスは自身を破壊し、
結果MasterFragmentをロードできます。
もし違えば、このクラスは選択されたOS名を取得し、
TextViewに表示するためのIntentオブジェクトを検索します。
最後に使っているプロジェクトに１つ以上のアクティビティが
追加されたため、AndroidManifest.xmlファイルに
そのアクティビティを追加することを忘れないように。

<manifest xmlns:android="http://schemas.android.com/apk/res/android"
　 package="net.learn2develop.fragmentexample"
　 android:versionCode="1"
　 android:versionName="1.0" >

　 <uses-sdk
　　 android:minSdkVersion="8"
　　 android:targetSdkVersion="15" />

　 <application
　　 android:icon="@drawable/ic_launcher"
　　 android:label="@string/app_name"
　　 android:theme="@style/AppTheme" >
　　 <activity
　　　 android:name=".MainActivity"
　　　 android:label="@string/title_activity_main" >
　　　 <intent-filter>
　　　　 <action android:name="android.intent.action.MAIN />

　　　　 <categoty android:name="android.intent.category.LAUNCHER" />
　　　 </intent-filter>
　　 </activity>

　　 //---以下が追加分です。---
　　 <activity
　　　 android:name=".DetailActivity"
　　　 android:label="@string/app_name" >
　　　 <intent-filter>
　　　　 <action android:name =
　　　　　　　 "net.learn2develop.fragmentexample.DetailActivity" />

　　　　 <category android:name="android.intent.category.DEFAULT" />
　　　 </intent-filter<a
　　 </activity>
　 </application>
</manifest>


portrait指向の中にあるデバイス上でアプリケーションを走らせたときに
アイテムのリストを見ることになります。
アイテムを選び、選択したアイテムについての詳細が
他のアクティビティの中に表示されるようになります。
landscape指向にデバイスをもっていき、両方のフラグが
今表示させるものに注目します。
左のパネルにあるアイテムを選ぶと、右側のパネルに
選ばれたアイテムの詳細が表示されます。