歩きはじめる
Sampleアプリの第二弾はTimeline-Firebaseという。
年表（時間的距離）を表すアプリに戻っている。
リリースも公開もしていないが、codeは全部見ていただける。
firebase関連のkeyなどがGitHubにさらされてしまっているという
いかにもいかにもアマチュアな失態もあるが、
firebase側を無効にしたので、放置している。
だから私と同程度にアマチュアにとっては逆に
ああ、ここにinfo.plistを置くんだな、みたいな見本にはなるかもしれない。
視点１、何を放棄し、何を残したか
基点を前回のDistanceに置くと、
ファイル構成はほとんど変わっていない。
減ったのは、assetsのjson-fileが１枚。
増えたのは、MenuPageで使うためのTextFormFieldを設定したfile。
MenuPageに直書きしても構わない。
構成は変わっていないが、行数は相当減っている。
今回はようやく、render-objectに切り込んでいる。
といったって、やはり私は「codeを書いた」ではなく「codeを消した」にすぎない。
主画面の背景色とグラデーション、
これに連動して変わる目盛りとheaderの背景色、グラデーション、
前後のItemにWarpするボタン、を放棄した。
残ったのは、伸縮目盛りとBubble(label)、つまり最低限だ。
いや、残念ながらMenuPage周りが残っている。
ただ今回は、menuをなぜ消せないのか、少しわかってきた。
主画面は138億年前から現代までの長い長い年表である。
そのどこの部分をどれぐらいの縮尺で描画するか、
その指定がメニューページで行われる。
指定の選択肢はmenu.jsonに記述されている。
だから、MenuPageは捨てることができない。
だがその線が見えたおかげで、捨てはしないが変えることはできることもわかった。
視点２、何を変えたか(1)
ということで、変えたことの第一はMenuPageのデザインと機能だ。
DistanceのMenuPageは、The History of Everythingをほぼ踏襲している。
Timeline-Firebaseでは、カードの展開というムダな挙動を捨てて、
描画をどの時代にフォーカスするか、単純なTileで示した。
このTileはmenu.jsonでの指定に応じて枚数を増減できる。
この変更に伴って、menu_section.dartがstatefullからstatelessに変わっている。
riverpodとか使わないの？
statefullWidgetというワードが出たついでに、注記しておく。
今回のシリーズでriverpodなど、話題の状態管理法は出てこない。
理由は簡単で、The History of Everythingが、そもそもriverpod以前の
Flutter最初期のアプリだということ。
Flutter3に適合させるためだけにも相当神経を使ったのに、
この上、何かそれらしい状態管理法に適合させる、という力は
残念ながら今の私にはない。
この伸縮時間軸を使ってみよう、と思った皆さんが、
それぞれの状況に応じて適用していただければいいと思う。
視点２、何を変えたか(2)
もっと大きな変更はfirebaseとの接続と検索機能だ。
jsonファイルではなく、firebaseのデータを読み込んで表示している。
入力機能を加えれば、ユーザーが自由に表示内容を追加できるようになる。
年表は過去を表示するもの、と思われるかもしれないが、
この伸縮時間軸なら、千年後でも計画できます。
視点３、動作は安定しているか
少なくともsimulatorではスムーズに動く。
null safty関連の黄色い警告は相変わらずあちこちに出るが、放置している。
menu.jsonでの描画領域指定が難しい。今もまだ良く理解できない。
視点４、コピペ「だけ」で使えるか
使えない。
firebaseとの接続が必要だから。
main.dart、info.plist、pubspec.yamlなどは通常通りの設定になる。
firebase側には、表示場所になるintのDataと、
表示内容になるStringのDataが必要だ。
下の画像中央で、yearというfirebaseのDataをtimelineEntry.startに渡している。
なぜstartかといったら、ピンポイントだけでなく、継続期間の始点と共有のcodeだからだ。
この少し下で、nameをtimelineEntry.nameに渡している。
timelineEntryとは、表示に係わる情報を一括して扱うListになっている。
ここで指定しておけば、Blocを通じてrender_widgetに渡されるので
あとはお任せ、ということになる。
次は何を目指すか
The History of Everythingは、限定的な年表だ。
だから、同じ年に何件も事象が並ぶということはない。
なので最小目盛りは１年だ。
けれど、歴史時代の事象なら、年月日での表示が必要になるだろう。
次はそこを工夫したい。
Flutter大学はFlutterエンジニアに特化した学習コミュニティです！ 初心者から中上級者まで幅広く在籍し、切磋琢磨しています！ 入会をご希望の方はこちらから→ flutteruniv.com
Discussion