KotlinのMVVMアーキテクチャの基本構成を理解しよう！初心者でもわかる画面設計のしくみ

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

生徒

「Kotlinでスマホアプリを作るときに、MVVMってよく聞くんですが、どういう意味ですか？」

先生

「MVVMは、アプリの設計をきれいに分けるための考え方なんです。見た目と中身を分けて、アプリを作りやすくする仕組みですよ。」

生徒

「なんだか難しそうですね…初めてでもわかりますか？」

先生

「もちろんです！Kotlin初心者でも理解できるように、ゆっくり説明していきますね。」

1. KotlinとMVVMアーキテクチャって何？

MVVMとは、「Model（モデル）」「View（ビュー）」「ViewModel（ビューモデル）」の頭文字を取った言葉です。KotlinでAndroidアプリを作るときによく使われるアーキテクチャパターンです。

MVVMアーキテクチャを使うことで、画面の表示（View）とデータの処理（Model）をきれいに分けて整理できます。そしてその間をつなぐのがViewModelです。

これにより、アプリのコードがわかりやすくなり、あとから修正しやすくなるというメリットがあります。

2. Model（モデル）とは？

Modelは、アプリの「中身」や「データの処理」を担当する部分です。たとえば、天気アプリなら天気情報を保存したり、ネットから取得したりする役割があります。

ユーザーが直接見ることはありませんが、裏側でとても重要な働きをしてくれます。

3. View（ビュー）とは？

Viewは、ユーザーが目で見る画面の部分です。たとえば、テキストやボタン、画像などを表示します。

Viewはあくまで「見せるだけ」の役割で、難しい計算やデータの取得などは行いません。

4. ViewModel（ビューモデル）とは？

ViewModelは、ModelとViewの間に立って、それぞれをつなぐ橋渡しのような存在です。

たとえば、Viewから「ボタンが押されました」という情報を受け取って、Modelに「カウントアップして」とお願いし、その結果をViewに伝えます。

また、ViewModelは画面に表示するためのデータを一時的に持っておく役割もあります。

5. MVVMの流れを図でイメージしよう

MVVMの流れを簡単にイメージすると、以下のようになります。

View：ユーザーの操作をViewModelに伝える
ViewModel：Modelに処理を依頼し、結果をViewに渡す
Model：データを取得・保存してViewModelに返す

このように役割を分けることで、Kotlinで作るアプリが整理されて、動作も安定しやすくなります。

6. KotlinでのMVVM構成をサンプルで見てみよう

ここでは、Kotlinでカウントを1つずつ増やす簡単なアプリをMVVMで実装した例を見てみましょう。


// Model
class CounterModel {
    var count = 0
    fun increment() {
        count++
    }
}

// ViewModel
class CounterViewModel(private val model: CounterModel) {
    fun getCount(): Int = model.count
    fun onIncrement() {
        model.increment()
    }
}

// View（仮想的な表示）
fun main() {
    val model = CounterModel()
    val viewModel = CounterViewModel(model)

    // ユーザーがボタンを押したと仮定
    viewModel.onIncrement()
    println("現在のカウント: ${viewModel.getCount()}")
}

この例では、ViewModelがModelにカウントの追加を指示し、その結果を画面に表示しています。