カテゴリ: Kotlin 更新日: 2025/11/24

Kotlinのフラグメントの使い方!画面分割の基本構造を初心者向けに解説

Kotlinのフラグメントの使い方!画面分割の基本構造
Kotlinのフラグメントの使い方!画面分割の基本構造

先生と生徒の会話形式で理解しよう

生徒

「Androidアプリで、画面を分けて表示したいときってどうすればいいんですか?」

先生

「そのときはフラグメントという機能を使うと便利ですよ。1つの画面の中に複数の部品を入れるようなイメージです。」

生徒

「フラグメントって、アクティビティとは違うんですか?」

先生

「アクティビティは画面全体、フラグメントはその中のパーツという感じですね。では、使い方を分かりやすく説明していきましょう!」

1. フラグメントとは?画面の部品としての役割

1. フラグメントとは?画面の部品としての役割
1. フラグメントとは?画面の部品としての役割

フラグメント(Fragment)は、Androidアプリで使える画面の部品のようなものです。たとえば、左側にメニュー、右側にコンテンツを表示したいときなどに便利です。アクティビティの中に埋め込んで使うことができます。

2. フラグメントの基本構造とは?

2. フラグメントの基本構造とは?
2. フラグメントの基本構造とは?

フラグメントを使うには、Kotlinでクラスを作成して、Fragmentクラスを継承します。さらに、どんなレイアウト(見た目)を表示するかをonCreateView関数で指定します。


class SampleFragment : Fragment() {
    override fun onCreateView(
        inflater: LayoutInflater,
        container: ViewGroup?,
        savedInstanceState: Bundle?
    ): View? {
        return inflater.inflate(R.layout.fragment_sample, container, false)
    }
}

このコードは「SampleFragment」という名前のフラグメントを作る例です。レイアウトにはfragment_sample.xmlというファイルを使います。

3. フラグメントのレイアウトファイルを作成しよう

3. フラグメントのレイアウトファイルを作成しよう
3. フラグメントのレイアウトファイルを作成しよう

フラグメント専用のレイアウトファイルを作ると、XML形式で見た目を自由に設計できます。たとえば、次のようにテキストを表示するだけの簡単な画面を作ることができます。


<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:gravity="center">

    <TextView
        android:id="@+id/sampleText"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="フラグメントのサンプルです" />
</LinearLayout>

4. アクティビティにフラグメントを表示するには?

4. アクティビティにフラグメントを表示するには?
4. アクティビティにフラグメントを表示するには?

作ったフラグメントは、アクティビティの中に表示できます。まず、アクティビティ側のレイアウトに「ここにフラグメントを表示する場所」を作っておきます。


<FrameLayout
    android:id="@+id/fragment_container"
    android:layout_width="match_parent"
    android:layout_height="match_parent" />

そして、アクティビティのKotlinコードで、次のようにフラグメントを表示します。


val fragment = SampleFragment()
supportFragmentManager.beginTransaction()
    .replace(R.id.fragment_container, fragment)
    .commit()

replaceは、「指定した場所にフラグメントを表示する」意味です。

5. フラグメントとアクティビティの違いを覚えよう

5. フラグメントとアクティビティの違いを覚えよう
5. フラグメントとアクティビティの違いを覚えよう

アクティビティとフラグメントの違いは以下の通りです:

  • アクティビティ:画面全体を表す。アプリの基本単位。
  • フラグメント:画面の一部。アクティビティの中に入れて使う。

たとえば、スマホ画面の上半分に地図、下半分にリストを表示したいとき、上下にフラグメントを配置すれば実現できます。

6. 実行結果のイメージ

6. 実行結果のイメージ
6. 実行結果のイメージ

実際にアプリを動かすと、以下のようにフラグメントが表示されます。


フラグメントのサンプルです

このように、フラグメントを使えば画面を自由に組み合わせることができます。

7. 複数のフラグメントを使って画面を切り替える方法

7. 複数のフラグメントを使って画面を切り替える方法
7. 複数のフラグメントを使って画面を切り替える方法

フラグメントは、1つだけでなく、複数を切り替えて使うこともできます。たとえば「設定画面」と「プロフィール画面」を切り替えたいとき、それぞれを別のフラグメントにして、必要に応じてreplace()で表示を切り替えます。

このようにすると、アプリ全体を切り替えずに、部品だけ変更できるため、軽量で効率的なアプリになります。

8. フラグメントのメリットとは?

8. フラグメントのメリットとは?
8. フラグメントのメリットとは?

KotlinのAndroid開発において、フラグメントを使うことには次のようなメリットがあります:

  • 画面の再利用がしやすい
  • タブ切り替えなどのUIが作りやすい
  • 画面を柔軟に構成できる

特にタブ付きの画面や、左右にスライドして切り替えるUIでは、フラグメントがよく使われます。

まとめ

まとめ
まとめ

Kotlinのフラグメントは、Androidアプリを柔軟に構築するための重要な仕組みであり、複数の画面要素をひとつのアクティビティの中で組み合わせたいときにとても役立つ存在です。今回の記事で学んだ内容を振り返ると、フラグメントが持つ「画面の部品として再利用しやすい構造」や「アクティビティと連携しながら動作する仕組み」が、アプリ全体の設計をより明確にし、画面構築の自由度を大きく高めてくれることが分かります。 フラグメントは単なる“パーツ”ではなく、独自のライフサイクルを持ち、XMLレイアウトとKotlinコードを組み合わせてひとつの役割を担うことができます。そのため、複数の画面切り替えやタブ構成、左右分割レイアウトなど、現代のAndroidアプリで求められるさまざまな画面設計に柔軟に対応できる点が大きな魅力です。

特に、フラグメントの基本構造を理解することは「画面の再利用」「パフォーマンスの最適化」「表示領域の切り替え」など多くの場面で役に立ちます。アクティビティが画面全体の管理者であり、フラグメントがそれを構成する部品として動く関係性は大変分かりやすく、アプリ全体の構造も自然と整理されていきます。また、画面切り替えの際にアクティビティを丸ごと変更する必要がなくなるため、アプリの動作が軽くなり、ユーザー体験も向上します。

さらに、レイアウトファイルとクラスファイルを分離して設計することで、UIの見た目と処理を明確に分けられるため、保守性や可読性が高まる点も大きなメリットです。フラグメントは再利用性が高く、ひとつ作っておくことで別の画面構成にも流用しやすいので、開発効率の面でも重宝されます。複数のフラグメントを切り替えて操作する設計も自然に行えるため、アプリの管理がしやすくなり、より複雑な画面構成にも挑戦しやすくなります。

フラグメント表示のサンプルコード


class MenuFragment : Fragment() {
    override fun onCreateView(
        inflater: LayoutInflater,
        container: ViewGroup?,
        savedInstanceState: Bundle?
    ): View? {
        return inflater.inflate(R.layout.fragment_menu, container, false)
    }
}

class ContentFragment : Fragment() {
    override fun onCreateView(
        inflater: LayoutInflater,
        container: ViewGroup?,
        savedInstanceState: Bundle?
    ): View? {
        return inflater.inflate(R.layout.fragment_content, container, false)
    }
}

// アクティビティ側での切り替え例
val menuFragment = MenuFragment()
val contentFragment = ContentFragment()

supportFragmentManager.beginTransaction()
    .replace(R.id.left_container, menuFragment)
    .commit()

supportFragmentManager.beginTransaction()
    .replace(R.id.right_container, contentFragment)
    .commit()

このように、複数のフラグメントを用途に応じて配置することで、メニューとコンテンツの表示を分離し、メリハリのある画面構成を実現できます。スマホ・タブレット双方のレイアウトにも応用でき、画面サイズに合わせた柔軟なデザインが可能になります。フラグメントはAndroidアプリ開発をより豊かにする基礎であり、使いこなすことでアプリ全体のクオリティが大きく向上します。

先生と生徒の振り返り会話

生徒

「今日のフラグメントの内容、すごく分かりやすかったです。アクティビティより小さな部品として使えるので、画面を分割するときにすごく便利なんですね。」

先生

「そうですね。フラグメントは画面の一部を管理するための仕組みなので、複数の表示をひとつのアクティビティの中で切り替えたいときにとても効果的です。再利用もしやすいので、実際の開発でも重宝します。」

生徒

「レイアウトをXMLで作って、Kotlinでクラスを分ける方法も良いですよね。画面の見た目と処理が分かれていると、とても整理しやすいと思いました。」

先生

「その通りです。フラグメントをうまく使えるようになると、アプリの構造がきれいに整理されて、さまざまな画面にも応用できるようになりますよ。これからもいろいろ挑戦してみてくださいね。」

カテゴリの一覧へ
新着記事
Go言語の構造体でインターフェースを実装する方法を初心者向けにやさしく解説!
Kotlinの演算子一覧と使い方!算術・比較・論理演算子の基本を解説
Go言語の文字列フォーマット!fmt.Sprintfで簡単に出力を整形する方法
Go言語のエラーと例外の違いを初心者向けに整理!わかりやすく解説
人気記事
No.1
Kotlin・Go・Swift記事の人気No1
Swiftのwhile文とrepeat while文を完全マスター!初心者にもわかる繰り返し処理の使い方と違い
No.2
Kotlin・Go・Swift記事の人気No2
Android Studioのインストール手順と初期設定を初心者向けに完全解説!
No.3
Kotlin・Go・Swift記事の人気No3
Swift入門ガイド|基本構文と書き方をマスターしよう
No.4
Kotlin・Go・Swift記事の人気No4
Kotlinの正規表現(Regex)の使い方をやさしく解説!文字列操作の基本を初心者向けに学ぼう
No.5
Kotlin・Go・Swift記事の人気No5
Kotlinのwhen式を完全ガイド!初心者でもわかるパターンマッチング的な使い方
No.6
Kotlin・Go・Swift記事の人気No6
Kotlinで画面を作る!レイアウトXMLとビューの基本操作をやさしく解説
No.7
Kotlin・Go・Swift記事の人気No7
Kotlinのコンパニオンオブジェクトとは?初心者向けに使い方と役割をわかりやすく解説!
No.8
Kotlin・Go・Swift記事の人気No8
Swiftのオプショナル型とは?初心者でもわかる使い方とアンラップの基礎