Flutterで売れるアプリを作ってみようPart1 まとめページ

ほのぼのリバーシ

Flutterの理解もだいぶ深まったので、

売れる規模のアプリを作ってみたいと思います

作るもの

リバーシ(オセロ)

白と黒のコマを使って遊ぶあのゲームです

一番遊んでもらえるリバーシアプリを目指します

作業ログ

1日目作ることにしました
2日目リバーシが簡易版で動きました
3日目コンピュータがイカサマをしてきます
4日目コンピュータと正々堂々勝負できました
でも弱い
5日目コンピュータを少し強くしました
6日目マルチプレイに対応しました
7日目遊べるボードを増やしました
キャラクターにアニメーションを付けました
8日目ヒントを増やしました
9日目ゲームの結果を表示しました
10日目コンピュータを待たせるようにした
11日目アニメーションの設定に失敗しました
12日目StateMachineでアニメーションの設定をしました
失敗しました
13日目RiveのStateMachineでアニメーションが動くようになりました
14日目animated_backgroundで背景にアニメーションを設定した
15日目flutter_neumorphicで部分的にニューモフィズムUIを取り入れました
16日目デザインを統一しました
17日目lottieでアニメーションを設定しました
18日目結果画面に順位を表示しました

開発環境

IDEIntelliJVisualStudioでもいいですが使い慣れてるIntelliJを使います
フレームワークFlutteriOSとAndroidを同時開発するため
言語Dartネイティブの処理は使う予定がないのでKotlinやSwiftは使いません
Null Safetyなコードにしたいので2.12.0以上を使います
コード管理github
CICD未定CodeMagicかgithub actionの予定

使う技術

ステート管理providerRiverpodも良さそうでしたが理解できているProviderを使います
ユニットテストtest
Widgetのテストflutter_test
インテグレーションテストflutter_driver
アニメーションrive
ユニークなIDの作成uuid
アニメーションの背景animated_backgroundApache 2.0
ニューモーフィズムのUIflutter_neumorphicMIT
フォントYusei Magic
アニメーションlottieMIT

アーキテクチャ

MVVMとDDDを意識した感じ

ViewModelでView側に通知すると不要な通知がScreenやWidgetにされる可能性があるので、

Domain層から通知する仕組みにしました

Screen1つの画面を構成するScreen。Widgetの組み合わせで作る
Widgetアプリケーションバーや、ドロワーなど画面の要素ごとに作る
ViewModelボタンをタップしたときの挙動をここに書く
UseCaseビジネスロジックを書く
今回はこの層いらないかもしれない
RepositoryDomainの登録や変更をする
APIを叩いたり、DBの情報を取得するときはここを経由する
Entityドメインロジックを持つ
可変で識別IDが同じ時のみ同一
今日が誕生日かなどはこの層で判定する
Value値は不変。値が同じものなら同一とみなせる
ex) 男や女という性別の情報など

コメント

  1. 匿名 より:

    スパイダーもつくってほしいです!

タイトルとURLをコピーしました