楽してAndroid/iOSアプリ個人開発

はじめに

どうも、@nittannittanです。

趣味でAndroid/iOS/Webアプリを作成しているアニメオタクです。

今まではAndroid/iOSアプリはそれぞれJava, Kotlin, Objective-c, Swiftなどの言語でそれぞれ開発していました。
しかし、どちらか一方を開発して公開したあとにまた同じようなことを繰り返すのは勉強にはなりますが、仕事の合間にやる個人開発ではあまり楽ではないなーと感じていました。

そこで「最近マルチプラットフォームも流行ってきているようだし、そろそろ本腰を入れてみるかー」という軽い気持ちからFlutterでAndroid/iOSアプリを同時開発することにしました。

Flutterを選んだ理由

Googleが開発しているからまずAndroidは間違いなく相性は良いだろうし、個人開発でFirebaseを使わないわけがないので、Flutterを採用しました。WebアプリでReact使っているわけでもないし、iOS版に対応していなかった時代を知っているのでReact Nativeは今回はやめました。

ReactでWeb開発してたらReact Nativeを選んだのかもしれません。

参考にしたサイト

まずはDartを知る必要があるため言語の公式ドキュメントをさらっと読みました。深くは読み込みません、私のやり方的に実際に手を動かして覚えるほうがやりやすくてわからなくなった時に再度読みます。手を動かさないとモチベーション維持も難しいですし、個人開発だとやる気が下がったらおしまいですからね。

ぱっとソースを見た時に全然わからないと投げ出しそうになったUIの構築方法も公式のドキュメントを見たらあっさり理解できました。慣れたらxmlやStoryboardでUIを作るのが面倒に思えてきます。特にStoryboardはgitでの差分確認がよっぽどの超人じゃないとできないですしね。

私が作ろうとしていたアプリはTODOアプリの作り方が参考にできそうだったので下記を見ながらベースを作りました。

利用パッケージの参考にしたのは下記。

最終的に利用したパッケージ

pubspec.yaml

dependencies:
  flutter:
    sdk: flutter
  cupertino_icons: ^1.0.0
  # MVVMで作るのに利用
  provider: ^4.3.3
  # データベースにデータ保存するのに利用
  moor: ^4.1.0
  sqlite3_flutter_libs: # Also use the latest version.
  path_provider:
  path:
  # アイコンを表示するのに利用
  flutter_icons: ^1.1.0
  # ダイアログの見栄えを良くするのに利用
  awesome_dialog: ^1.3.2
  # アプリからブラウザを開くために利用
  url_launcher: ^6.0.3
  # 必要なアプリアイコンを自動生成するのに利用
  flutter_launcher_icons: ^0.9.0
  # スプラッシュ画面を自動生成するために利用
  flutter_native_splash: ^1.1.5+1
  # Firebase関連
  firebase_core: ^1.0.2
  firebase_analytics: ^7.1.1
  firebase_crashlytics: ^1.0.0
  firebase_auth: ^1.0.3
  google_sign_in: ^5.0.1
  # GoogleDriveにバックアップファイルを保存するのに利用
  googleapis: ^2.0.0

楽したポイント

moor

AndroidとiOSで差が出やすかったデータベースへのデータ保存もパッケージを利用することで簡単に対応できました。何も悩まずにマルチプラットフォームでデータ保存が実現できたのは衝撃的でした。

awesome_dialog

参考サイトでも紹介されていたパッケージですが、こちらも少ない工数でダイアログの見栄えが劇的に良くなるのでおすすめです。

flutter_launcher_icons

iOSアプリをApp Storeに公開したことがある人ならわかると思いますが、iOSアプリは用意しなければならないアプリアイコンの数がとても多いです。それを画像一つ用意するだけで自動設定できるのはまたまた衝撃的でした。Androidのアダプティブアイコンにも対応しているのでかゆいところに手が届きます。

flutter_native_splash

このパッケージもスプラッシュ画面が画像一つで表示できるようにできるのでとても楽ができます。

開発したトラウマ解消アプリの紹介

トラウマ解消アプリは、ふとした瞬間にフラッシュバックするトラウマを認知行動療法によって解消するためのアプリです。

使い方は以下です。

• まずは、トラウマがフラッシュバックした時にそのトラウマに名前をつけて保存しましょう。

• フラッシュバックした時に詳細な情報まで記録できるとは限らないと思います。名前以外の詳細は時間があるときにゆっくり書き出しましょう。

• トラウマに名前をつけたり、詳細を書き出すことによって客観的に考えを整理することができ決めつけでネガティブになっていたことに気がついたり、バランスがいい考え方ができるようになります。