コードラボJP
プライバシーポリシー お問い合わせ サイトマップ

Android Kotlin基礎講座 03.1: フラグメントを作成する

タスク：フラグメントを追加する

フラグメントはアクティビティ内のユーザーインターフェース(UI)の動きや部位を示すものです。一つのアクティビティで複数のフラグメントを組み合わせることによって、マルチペインのUIを作ったり、複数のアクティビティでフラグメントを使いまわすことができます。

フラグメントをアクティビティの基本単位として考えてみましょう。”sub activity”のように他のアクティビティでも使うことができるようなものです。

  • フラグメントは独自のライフサイクルを持っており、独自の入力イベントを受け取ります。
  • アクティビティ実行中にフラグメントを追加・削除できます。
  • フラグメントはKotlinクラスに定義されています。
  • フラグメントのUIはXMLレイアウトファイルに定義されています。

AndroidTriviaアプリはメインとなるアクティビティと複数のフラグメントを持っています。ほとんどのフラグメントとレイアウトファイルは既に定義されています。このタスクでは、フラグメントを作成し、メインアクティビティにそのフラグメントを追加します。

ステップ1：フラグメントクラスを追加する

このステップではTitleFragmentクラスという空のクラスを作成します。新規フラグメント用のKotlinクラスを作りましょう。

  1. Android Studio内でプロジェクトパネル内のどこかをクリックし、プロジェクトファイルにフォーカスを戻してください。例えばcom.example.android.navigationフォルダーなどをクリックしてください。
  2. File > New > Fragment > Fragment(Blank)を選択してください。

  3. フラグメントの名前にはTitleFragmentと入力してください。チェックボックスを全て外してください。
  4. Finishをクリックしてください。
  5. まだ開いていなければ、TitleFragment.ktフラグメントファイルを開いてください。フラグメントのライフサイクルの中で呼ばれるメソッドの一つであるonCreateView()メソッドが含まれています。（Android Studioのバージョンにより初期のコードが多少異なる場合がありますが、最終的に以下の見本コードのようになるようにしてください）
  6. onCreateView()の中のsetTextで始まる行を含むreturn TextView(activity).applyセクションを削除してください。oncreateView()関数は以下のようになります。
override fun onCreateView(inflater: LayoutInflater, container: ViewGroup?,
                         savedInstanceState: Bundle?): View? {
}

バインディングオブジェクトを作成する

フラグメントは現在コンパイルできません。フラグメントをコンパイルするためにはバインディングオブジェクトを作成し、フラグメントのビューをインフレート（アクティビティにおけるsetContentView()と同等）する必要があります。

  1. onCreateView()メソッドの中にbinding変数を作成します。(val binding)
  2. フラグメントのビューをインフレートするために、DataBindingUtil.inflate()関数をフラグメントのバインディングオブジェクト(FragmentTitleBinding)で呼び出してください。

    このメソッドには以下の4つの引数を渡します。
  • inflater: ここでLayoutInflaterは結合するレイアウトをインフレートするために利用されています。
  • インフレートするレイアウトのXMLレイアウトリソース。レイアウトの一つで、既に定義されているR.layout.fragment_titleを利用します。
  • 親ビューグループのコンテナ。(この引数は任意です）
  • attachToParentという値用のfalse
  1. binding変数にバインディングオブジェクトの中身であるDataBindingUtil.inflateの戻り値を代入してください。
  2. onCreateView関数からbinding.rootを戻り値として返すようにします。これにはインフレートされたビューが含まれています。onCreateView()は以下のようになります。
override fun onCreateView(inflater: LayoutInflater, container: ViewGroup?,
                         savedInstanceState: Bundle?): View? {
   val binding = DataBindingUtil.inflate<FragmentTitleBinding>(inflater,
           R.layout.fragment_title,container,false)
   return binding.root
   }

ステップ2：新規フラグメントをメインレイアウトファイルに追加する

このステップでは、TitleFragmentをアプリのactivity_main.xmlレイアウトファイルに追加します。

  1. res > layout > activity_main.xmlを開いて、Textタブで開いてください。
  2. LinearLayout要素の中にfragment要素を追加してください。
  3. フラグメントのIDをtitleFragmentとしてください。
  4. フラグメントの名前にはフラグメントクラスの絶対パスを設定してください。今回の場合はcom.example.android.navigation.TitleFragmentです。
  5. widthとheightはmatch_parentにしてください。
<layout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:orientation="vertical">
            <fragment
                android:id="@+id/titleFragment"
                android:name="com.example.android.navigation.TitleFragment"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                />
        </LinearLayout>

</layout>
  1. アプリを起動してください。メイン画面にフラグメントが追加されました。

完成済みプロジェクト

完成済みプロジェクトは以下からダウンロードできます。

AndroidTriviaFragment