FragmentはActivityなどと同じ様に、ライフサイクルを持ちます。
それらを確認した上で、Button操作による、Fragmentの追加/編集を行っていきましょう。
Fragmentのライフサイクル
Fragmentにはライフサイクルがあります。
それは以下の通り。基本的な流れはActivityと同様ですが、UIの生成等に関わるMethodが追加されています。
〜コアライフサイクルMethod〜
1. onAttach(Activity)
→Activityに関連付けされた際に一度だけ呼ばれる。
2. onCreate(Bundle)
→Fragmentの初期化処理を行う。
3. onCreateView(LayoutInflater, ViewGroup, Bundle)
→Fragmentに関連付けるViewを作成し、returnする。
4. onActivityCreated(Bundle)
→親となるActivityの「onCreate」の終了を知らせる。
5. onStart()
→Activityの「onStart」に基づき開始される。
6. onResume()
→Activityの「onResume」に基づき開始される。
〜終了/復帰処理にあたるMethod〜
1. onPause()
→Activityが「onPause」になったり、Fragmentが変更更新され、
操作を受け付けなくなった場合に呼び出される。
2. onStop()
→フォアグラウンドで無くなった場合に呼び出される。
3. onDestroyView()
→Fragmentの内部のViewリソースの整理を行う。
4. onDestroy()
→Fragmentが殺される最後に呼び出される。
5. onDetach()
→Activityの関連付けから外された時に呼び出される。
以上のMethodを踏まえ、全てOverrideし、Logを仕込む。
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 | public static class UpFragment extends Fragment implements OnClickListener {
public static String TAG = "FragmentLifeCycle";
@Override
public void onAttach(Activity act){
super.onAttach(act);
Log.d(TAG,"Fragment-onAttach");
}
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
Log.d(TAG,"Fragment-onCreate");
}
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
Log.d(TAG,"Fragment-onCreateView");
View v = inflater.inflate(R.layout.component_button,container,false);
return v;
}
@Override
public void onActivityCreated(Bundle bundle){
super.onActivityCreated(bundle);
Log.d(TAG,"Fragment-onActivityCreated");
}
@Override
public void onStart(){
super.onStart();
Log.d(TAG,"Fragment-onStart");
}
@Override
public void onResume(){
super.onResume();
Log.d(TAG,"Fragment-onResume");
}
@Override
public void onPause(){
super.onPause();
Log.d(TAG,"Fragment-onPause");
}
@Override
public void onStop(){
super.onStop();
Log.d(TAG,"Fragment-onStop");
}
@Override
public void onDestroyView(){
super.onDestroyView();
Log.d(TAG,"Fragment-onDestroyView");
}
@Override
public void onDestroy(){
super.onDestroy();
Log.d(TAG,"Fragment-onDestroy");
}
@Override
public void onDetach(){
super.onDetach();
Log.d(TAG,"Fragment-onDetach");
}
}
|
Fragmentの追加/編集
まず、Fragmentを使用する場合は、 Fragment class を継承したクラスを用意します。
今回用意したのは、上記 Log 出力を入れ込んだ物（小変更 UpFragment）と、TextViewを表示する、
DownFragmentを作成しました。
Fragment内部にTextViewを持つため、それを「onCreateView」において呼び出しています。
「findViewById」を常日頃「onCreate」で呼び出している様なイメージでしょうか。
呼び出すViewの内容は、続けて引用する component_text.xml で定義しています。
LayoutInflater#inflateは、「リストビューをカスタマイズする」でも使用しています。
Fragment内部に持つ、コンポーネントにアクセスする場合のポイントは以下になります。
１．LayoutInflater#inflateにて、Layoutファイルを指定
２．指定したLayoutファイルから、findViewByIdでコンポーネントを指定
３．それぞれのコンポーネントに対する処理（TextView#setText()等）
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 | public static class DownFragment extends Fragment {
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
View v = inflater.inflate(R.layout.component_text,container,false);
return v;
}
}
public static class UpFragment extends Fragment implements OnClickListener {
int cnt;
UpFragment(int counter){
cnt = counter;
}
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
View v = inflater.inflate(R.layout.component_button,container,false);
View bt = v.findViewById(R.id.button1);
((Button)bt).setOnClickListener(this);
((Button)bt).setText("Load the TextView-Fragment"+cnt);
return v;
}
}
|
component_text.xml
| 1 2 3 | <TextView android:text="This is a Textview.." android:id="@+id/textView1"
android:layout_width="wrap_content" android:layout_height="wrap_content"
|
次に、Fragmentの登録部分を作成していきます。
基本的な流れは「Fragmentを使ってMenuを動的に作成する」で紹介した流れと同じです。
まずFragmentTransactionをFragmentManagerから取得します。
次に、Flagmentを登録（replace）します。
replaceは、既に「R.id.fragment01」のViewIdで追加指定（add等）しているFragment要素を破棄（remove）
することと同様の操作になります。
アニメーションの指定には、以下を指定します。
＃和演算を行うことで、同時に指定できます。
TRANSIT_FRAGMENT_OPEN
→開く時のアニメーションを行うよう指定
TRANSIT_FRAGMENT_CLOSE
→閉じる時のアニメーションを行うよう指定
TRANSIT_NONE
→無し
| 1 2 3 4 5 6 7 8 9 10 11 12 13 | void addFragmentToStack() {
Fragment newFragment = new UpFragment(counter++);
FragmentTransaction ft = getFragmentManager().beginTransaction();
ft.replace(R.id.fragment01, newFragment);
ft.setTransition(FragmentTransaction.TRANSIT_FRAGMENT_OPEN);
ft.addToBackStack(null);
ft.commit();
}
|
この処理を、Button押下時に呼び出す様に作成します。
＃処理自体は割愛します。
最後に、実行結果のキャプチャを添付します。
実行時の画面は以下左図の通りです。
「Load the TextView-Fragment０」を押下すると、真ん中の図の様にTextViewが挿入されます。
０番目のFragmentから呼び出されたので、末尾に０が付加されています。
「Button」を押下すると、「Load the TextView-Fragment０」の末尾の数値がカウントアップします。
これは、Fragmentがスタック状に重なっている様子を示しています。（右図）
同様に、「Load the TextView-Fragment１」を押下すると、以下左図の様に、
TextViewの末尾の数値が増加します。これも同様にスタック状に重なっている事を示しています。
この先も繰り返しで、数値を変化させていけます。
本サンプルで面白いのは、BACKボタンを押下した時の動作です。
従来のACTIVITYであれば、BACKボタンを押下した場合、画面ごと切り替わってしまいますが、
本サンプルでは、Fragmentが一枚戻る形、すなわち、図が一つ戻る様に動作します。
Fragmentを用いることで、UIの可能性がまた一つ広がるのではないでしょうか。
0 件のコメント:
コメントを投稿