2
2

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 3 years have passed since last update.

公式トレーニング「Android Kotlinの基礎」について

Posted at

Android Jetpackの入門として公式サイトで紹介されているチュートリアル「Android Kotlin の基礎」を紹介します。

この記事は何かしらAndroidアプリ開発の入門書を読み終えたくらいの方向けに書いています。
このチュートリアルから学習をスタートすることはお勧めしませんが、Androidの実践的な開発で用いられる要素技術が広く紹介されているので学習の次のステップとしては非常にお勧めできる内容です。

ただ内容は結構ボリューミーで、10個のレッスン、計33個ものコードラボで構成されています
英語読み込みながら全部マジメに取り組むと相当時間かかりま。

内容はすべてサンプルアプリを作りながらのハンズオン形式ですので手を動かしながら学びたい方には合っているかと思います。
この記事では各章で作成するサンプルアプリと学ぶ内容を紹介していますので、興味があるトピックがあればコードラボを覗いてみると良いかと思います。

そして始める前に言っておきます。
この記事めっちゃ長いです


レッスン1: 初めてのアプリの作成

レッスン 1 では、Kotlin を使用するように Android Studio を設定する方法と、アプリを作成する方法について説明します。最初に「Hello World」を作成し、続いて、画像ファイルとクリック ハンドラを使用するアプリを作成します。Android プロジェクトの作成方法、Kotlin Android アプリでのビューの使用方法や変更方法、アプリの後方互換性を確認する方法について学習します。また、API レベルと Android Jetpack ライブラリについても学習します。

内容は基礎的で、入門書読んでれば既知の内容がほとんどです。

1.1 Install Android Studio

Android Studioのインストール方法。

1.2 Get started

スクリーンに"Hello World"を表示する(だけ)のアプリケーションを作成します。

1.3 Anatomy of Basic Android Project

ボタンをクリックすると1~6の数字が表示される、DiceRollerというアプリケーションを作ります。ButtonTextViewなど画面部品の配置方法やイベントハンドラ、リスナの作成方法が紹介されています。

1.4 Image resources and compatibility

1.3で作ったDiceRollerアプリの改善。数字をテキストではなくImage Resourceを使って画像で表示します。

1.5 Learn to help yourself

プロジェクトテンプレート(BasicAcitiviy)の使用方法、既存のサンプルアプリ(sunflowerアプリ)のダウンロードと改修(ランチャーアイコンの変更)について。


レッスン2: レイアウト

レッスン 2 では、Android Studio Layout Editor を使って、リニア レイアウトと制約レイアウトを作成する方法を学びます。ユーザー入力を取得して表示する、ユーザーのタップに反応する、ビューの外観と色を変更するアプリを作成します。このレッスンでは、データ バインディングを使って findViewById() メソッドの非効率的な呼び出しを排除する方法についても説明します。

この章ではAboutMeというアプリを作りながらレイアウトの基礎を学んでいきます。
作るアプリはこんな感じ。
02.gif

2.1 LinearLayout using the Layout Editor

LinearLayout上にScrollViewを乗っけたアプリを作ります。

2.2 Add user interactivity

2.1で作ったScrollViewTextViewのアプリの改修。EditTextButtonを実装してイベントの制御方法を学びます。
結構前までの内容と重複している部分が多く退屈かもしれませんが、画面部品のvisibility等の状態遷移についても触れられているのでハンズオンだけでも触れておくと良いかも(英語読まなくても内容分かると思います)。

2.3 ConstraintLayout using the Layout Editor

ConstraintLayoutの使い方。このコードラボではアプリを作るっていうか、ConstraintLayoutで画面部品をどのように相対的に配置するかを学びます。
初学者の方にはなかなかイメージが掴みにくいレイアウトかもしれませんが、使いこなせるようになるとその後の生産性が向上することは間違いないのでよく読み込むと良いでしょう。

2.4 Data binding basics

findViewById()に代わるDataBindingを学びます。
初学者の方はこのコードラボは是非しっかり読んでおきましょう。
続くViewModelLiveDataの基礎となります。
2.2で作ったアプリをいじる形で進みますが、そこまでのコードはDLできます。まぁハンズオンで実装しておいた方が理解は早いかも。
説明も結構分かりやすいです。


レッスン3:ナビゲーション

レッスン 3 では、アプリ内に便利なナビゲーションを作成する方法を学習します。フラグメントを作成してアプリに追加してから、Android Studio ナビゲーション グラフを使ってアプリにナビゲーションを追加します。ナビゲーション ドロワーとオプション メニューをアプリに追加し、アプリのバックスタックを使用して、システムの [戻る] ボタンの表示先を変更します。最後に、アプリ内から外部のアクティビティを呼び出す方法を学習します。

画面遷移をコントロールするためのNavigationの使い方について学びます。
AndroidTriviaアプリという、Androidに関するクイズを解いていくアプリを段階的に作成します。
03.gif

3.1 Create a fragment

Fragmentをプロジェクトに追加します。ここではアイテムを追加するだけ。

3.2 Define navigation paths

複数の画面をプロジェクトに追加していきます。画面遷移はNavigaitonによりコントロールされます。
またAndroidのBack Button(戻るボタン)の制御方法についてもあわせて触れられています。初めのころは結構戸惑うポイントだとも思うので、ここはしっかり目に読んでおくと良いかも。
0302.png
(コードラボ:https://developer.android.com/codelabs/kotlin-android-training-add-navigation?hl=ja#5 より)

3.3 Start an external Activity

引き続きアプリの改修に取り組みます。
ここではクイズの結果を他のアプリに引き渡し、共有する機能を実装します。そのために必要なFragmentへのBundleの渡し方、Safe Argsの使い方、そしてImplicit Intent(暗黙的インテント)の概要について学びます。


レッスン4:アクティビティとフラグメントのライフサイクル

レッスン 4 では、アクティビティとフラグメントのライフサイクルと、複雑なライフサイクルの状態に対処する方法を学習します。Android のライフサイクルに関連するバグをいくつか含むスターター アプリを使用します。アプリのライフサイクル イベントをよく把握するために、アプリへのロギング機能の追加、アプリに含まれるバグの修正、アプリへの拡張機能の追加を行います。また、Android Jetpack のライフサイクル ライブラリも学習します。このライブラリには整然とした管理しやすいコードがあり、ライフサイクル イベントを管理するのに役立ちます。

4.1 Lifecycles and logging

このレッスンはコードラボが一つだけ。ラクチンですね。
Dessert Clickerというなんだか良く分からないアプリを作りますが、まぁアプリはどうでもよくて、ActivityFragmentがInitialize(生成)~Destory(破棄)されるまでにどのように(どの順番で)コールバックのメソッドが呼び出されるかが本題です。
MainActibiy.ktonResume()onDestory()などのメソッドを実装し、その中にログ出力処理を組み込むことでどのような順番で各メソッドが動くのか理解するのがこのコードラボの論旨です。
0401.png
https://developer.android.com/codelabs/kotlin-android-training-lifecycles-logging?hl=ja#2 より)


レッスン5:アーキテクチャ コンポーネント

レッスン 5 では、ViewModel オブジェクトと LiveData オブジェクトの使用方法を学習します。ViewModel オブジェクトを使って、画面の回転などの設定変更後にデータを引き継ぐ方法を学習します。アプリの UI データをカプセル化された LiveData に変換し、LiveData の値が変更されたときに通知されるオブザーバー メソッドを追加します。
また、LiveData と ViewModel をデータ バインディングと統合すると、アプリのフラグメントを使って情報を中継することなく、レイアウト内のビューが ViewModel オブジェクトと直接通信できるようになります。この方法によりコードを簡略化できるので、UI コントローラでクリック ハンドラを使用する必要がなくなります。

レッスンを通してGuessTheWardというアプリを作ります。
お題として表示された単語をプレイヤーはその単語を用いずにジェスチャ等で演じ、相手がお題を言い合てられたらポイントが加算、間違えたら減算。
ゲームが終了したら最終的なスコアを表示する画面に遷移します。
05.gif

5.1 ViewModel

ViewModelViewModelFactoryを実装します。あらかじめ用意されたコードに手を入れていく形です。
前半はActivityFragmentなどのUI controllerに対しViewModelとはどのようなものなのか、またあるべきデザインパターン(MVVM)の解説が中心です。
Androidのapp architecture guidelinesはこのアーキテクチャをを推奨しているので、しっかりと読んで理解しましょう。

5.2 LiveData and LiveData observers

つぎはLiveDataについて。LiveDataを使うことにより、例えば画面のTextViewを明示的に書き換えなくてもLiveDataとして定義されたデータを更新するだけで画面上に反映できるようになります。またMutableLiveDataLiveDataの違いについての解説もありますが、この辺りはセキュアなコードを実現するうえでとても大切な点ですね。

5.3 Data binding with ViewModel and LiveData

さらにアプリを発展させていきます。これまではactivity.ktクラスを経由してViewViewModelを結び付けていましたが、両者を直接DataBindingで接合する方法を学びます。イベントハンドラも不要になりますね。
コードラボでも紹介されていますが、この書き方をするとイベントとリスナは自動生成されるクラスで接合されます。そのため例えばView(xml)側で呼び出すメソッドのスペルをミスったとしてもエディタ上はエラーとして表示されず、コンパイル時にエラーが吐かれます。あれ、どこにバグがあるんだ? って気づきにくい点なので注意しましょう。

5.4 LiveData transformations

LiveDataを他の型やフォーマットに変換する方法として、Transformations.map()が紹介されています。
ここでは60,000ミリ秒から0ミリ秒までのCountDownTimerLiveDataMM:SSフォーマットに変換する方法を学びます。


レッスン6:Room データベースとコルーチン

レッスン 6 では、Room データベース ライブラリの使用方法について説明します。Room は、データベースのセットアップと設定に関する多数の処理を行い、データベースを操作するためのコードを簡素化します。Kotlin コルーチンを使ってデータベース操作をメインスレッドから移動する方法と、ViewModel と LiveData をアプリ ナビゲーションで使う方法を学習します。

毎日の睡眠の開始と終了、そして睡眠の質を記録するTrackMySleepQualityというアプリを作っていきます。
毎日の睡眠の記録……ということでアプリ内でデータの保持が必要ですね。この章ではDB操作をRoomから行います。
従来の?やり方であるDBヘルパークラスでの実装方法やSQLiteの解説はありません。
06.gif

6.1 Create a Room Database

とりあえずRoomのさわりから。エンティティDAO、そしてRoomデータベースクラスを作成します。
このトレーニングは最終的にはMVVM+Repositoryというデザインパターンでアプリを実装することになります。
RoomViewModelと並びその根幹となる要素技術ですので、概念を含め時間をかけても理解すべき内容でしょう。

6.2 Coroutines and Room

ViewModelに6.1.で作成したRoomデータベースを埋め込んでいきます。またDBの読み書きをする際はコルーチンの利用が推奨されていますが、このコードラボでだいぶ詳しく解説されています。
そしてViewModelから各種アプリの処理を実装してきます。

6.3 Use LiveData to control button states

続けて画面遷移を実装します。ほぼこれまでやったきたことのおさらいってかんじですね。


レッスン7:RecyclerView

レッスン 7 では、RecyclerView を使ってアイテムのリストとグリッドを効率的に表示する方法について説明します。複雑なリストやグリッドを使う場合の、RecyclerView の効率を高める方法と、コードの管理と拡張を容易にする方法を学習します。RecyclerView のアイテムをクリック可能にする方法を学習します。また、RecyclerView のリストやグリッドに複数のビューホルダーとレイアウトを追加して、たとえば、アプリにヘッダーを追加する方法も学習します。

段々と内容も込み入ってきます。
作成するアプリは前章で作成したTrackMySleepQualityの拡張で、記録をRecyclerViewで表示する方式に改修するのですが、3章のFragment、5章のViewModel、6章のRoomの内容をよく理解していないとかなり厳しいです。
ここまで不安という方は一度立ち止まって理解を深めることを強くお勧めします。
07.gif

7.1 RecyclerView fundamentals

RecylceViewの基礎について。RecylceViewは非常に拡張性の高い画面部品ですが、これまで使っていたListViewと比べると手動で設定しなければならない項目も多いです。
このコードラボではその実装方法であるAdapterViewHolderが紹介されています。

7.2 DiffUtil and data binding with RecyclerView

7.1のコードを改修します。
アプリの見た目、挙動は変わりませんが、RecyclerViewのデータ更新に便利なDiffUtilというユーティリティクラスでリファクタリングをしていきます。

7.3 GridLayout with RecyclerView

7.2までのRecyclerViewLinearLayoutを使用していましたが、それをGridLayoutに変更します。

7.4 Interacting with RecyclerView items

さらに内容を発展させて、RecyclerViewに格納されたアイテムへのクリックなどのイベントをどのように受け取るべきかのベストプラクティスについて。
ここではViewModel側でイベントを処理します。
だいぶややこしくなってきましたが、トレーニングも終盤です。一緒に頑張りましょう。

7.5 Headers in RecyclerView

RecyclerViewHeaderを載せる方法について紹介されています。


レッスン8:インターネットへの接続

レッスン 8 では、コミュニティで開発したライブラリを使ってウェブサービスに接続し、データの取得や表示を行う方法について説明します。潜在的なネットワーク エラーに対処する方法と、Glide ライブラリを使って、インターネットから写真を読み込んで表示する方法を学習します。また、RecyclerView を作成し、それを使って画像のグリッドを表示します。

AndroidからWEBのリソースにアクセスする方法を学びます。
前章までに学んだLivDataViewModelRecyclerViewを活用しMarsRealEstateというアプリを作成します。
これはその名の通り(?)売り出し中の火星の土地の写真を既存のWEBサービスからとってきて、Gridで表示するというアプリです。
おれも買おうかな。
08.gif

8.1 Getting data from the internet

とりあえず実際にWEBサーバーに接続してデータを取ってくるまで。
なお火星の土地データはjson形式でRESTで受信します。RESTクライアントはRetrofitというライブラリを利用して作成し、MoshiというライブラリでjsonをParseする方法が紹介されています。
受信したjsonのレコード数をTextViewで表示します。

8.2 Loading and displaying images from the Internet

受信したjsonに含まれている画像データをRecylerViewのGridに表示します。Glideというライブラリを用いて画像のダウンロード、バッファ、でコード、キャッシュを行います。便利ですね。
このコードラボでキャッシュした画像をGridに表示します。
その他にもローディング時のアニメーションの実装方法がチラっと紹介されていたり、役立ちそうなことが多くて楽しいです。

8.3 Filtering and detail views with internet data

最後に、Gridで表示された画像をタップすると詳細のページに遷移する機能を付け足します。
ついでにOverflowMenuからRecyclerViewに表示するアイテムをフィルターする機能も追加するんですが、個人的にこのベストプラクティスを知れたのは良かったです。なるほどね。
あとは画面遷移の際はBundleではなくParcelableを用います。


レッスン9:リポジトリ

レッスン 9 では、リポジトリを追加してデータレイヤーを抽象化し、Android Kotlin アプリの他のアプリにクリーンな API を提供する方法について説明します。また、WorkManager を使って、バックグラウンド タスクを効率的かつ最適化された方法でスケジュール設定する方法についても説明します。
(公式サイト:https://developer.android.com/courses/kotlin-android-fundamentals/overview?hl=ja より)

日本語が何だか分かりにくいですね……。
リポジトリと言ってもGitのアレではないです。ここでいうのはRepository PatterというAndroidにおけるデザインパターンの一種です。
簡単に言えばインターネットなどのデータソースとアプリとを切り離す構成ですが、これによりネットワーク環境のないところでもキャッシュしたデータをもとにアプリを動作させることができます。
今では当たり前の技術ですが、いざ自分で実装しようとするとその大変さが何だか伝ってきますね。
DevBytesというアプリを作ります。
09.gif

9.1 Repository

インターネットから取得したデータをRoomにキャッシュする方法について学びます。そしてそれを読み込む方法について。

9.2 WorkManager

表題の通りWorkManagerについて。
多くのアプリはバッググラウンドで様々な処理を行っていますが、WorkManagerはそれらの処理の最適化を図ってくれます。


レッスン10:すべてのユーザー向けの設計

このレッスンでは、Android アプリ設計の基本について説明します。テーマとスタイル、マテリアル デザインのほか、誰もがアプリを簡単に使用できるようにする方法を紹介します。
(公式サイト:https://developer.android.com/courses/kotlin-android-fundamentals/overview?hl=ja より)

いよいよ最後のレッスンです!
この章は他とは少し毛色が違い、主にデザインやユーザビリティに関する技法やテクニックについて、各論的に学びます。
サンプルコードではこれまでに学んだViewModelRoomがふんだんに使われていますが、この章の内容ではないので復習は別途しておきましょう。
GDG-finderというアプリをリファクタリングしていきます。
10.gif

10.1 Styles and themes

Androidのスタイリングシステムの基礎、attributestylethemeの使い方について。
AndroidのスタイリングシステムはViewを頂点としたピラミッド構造になっています。なのでどのレイヤーでデザインを適用するかを考える必要がある、という内容です。

10.2 Material Design, dimens, and colors

いよいよ出ましたMaterial Design。と言ってもここでは深く踏み込まず、FloatingActionButtonを実装するだけです。
あとアプリのテーマカラーを決めるのに便利なCOLOR TOOLというサイトが紹介されています。
これは便利。

10.3 Design for everyone

世界にアプリを発信していくには様々な言語やバックグラウンドを持った方々が使うことも考えなければなりません。
ここではRTL言語(アラビア文字など右から左に読む言語)、ユーザー補助検証ツールによるユーザービリティの改善、ナイトモードへの対応方法などが個別に紹介されています。

まとめ

以上、大変お疲れさまでした!
正直全量をこなすにはかなりの労力が必要なトレーニングです。
しかも7章のRecyclerViewのあたりから内容もだいぶ複雑になってきて、復習の時間も必要でしょう。

しかしここで触れられた内容を十分に理解していればその後の生産性もグッと上がることは間違いありませんし、何より公式が推奨するベストプラクティスをハンズオンという形式で半ば強制的に押し付けられるのは非常に良いトレーニングだとも思います。

自分も100%ものにしているかと言われればスミマセン結構怪しいところあるんですが、公式のリファレンスなんかも参照しつつともに頑張っていきましょう。

ではでは。

2
2
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
2
2

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?