Distanceの誕生
The History of Everythingを削りに削って最初に作ったSampleアプリを
Distanceと命名した。
storeでリリースしたわけではない。
firebaseのホスティングで公開はしているが、いろいろと問題がある（後述）
とまれ、このアプリの概要を説明することで、
CustomRenderObjectへの一里塚とする。
視点１、何を放棄し、何を残したか
The History of Everything 最大の魅力animationは、当然のことながら一掃した。
解説ページ、お気に入り機能関連、about、share、
アプリ内の項目を検索して年表上でフォーカスする、という機能も捨てた。
ファイルごと消してしまえるものは消した。
Libだけでなく、assetsがすさまじく少なくなっている。
残ったのは２枚のjsonだけ。
そのjsonも内容がかなり減っている。
GitHubで二つを比較していただければ、減量成果はおわかりいただけるだろう。
何を残したか、というよりは、何が残ったか、が正しい。
うまく消せなかったものが残った、ということだ。
消してはみたが、エラーを解消できずに復元した、といってもいい。
フォルダが二つある。
distanceは、このアプリの心臓部だ。
The History of Everythingのtimelineというフォルダに相当する。
今回、ここの中身はほぼ手つかずで残っている。
当時の私には、とても手が出なかった部分だ。
だから目盛り以外にも、背景のグラデーションやItem間をWarpするボタンが残っている。
もう一つのフォルダ、menuは、消したかったが消せなかった。
私が欲しいのは目盛りでmenuじゃない、そこは好きに作りたい、と思っていた。
エラーに対処しきれず残した、というのは、こちらのフォルダのことだ。
なぜそうなのかを理解するには、もう少し深く探索しなければならなかった。
視点２、コピペで使えるか
前回書いたように、この取り組みの目標の一つは
かつて私がお絵かき機能をコピペで実装できたような形で、伸縮目盛りを提供したい
ということだ。
このDistanceはコピペで使えるか？
お絵かき機能は、実装さえすれば、絵を描くのはユーザーだ。
提供されていたファイルは保存や再生をカバーしていなかったが、
それはアプリの設計によるので、当然といえば当然だろう。
伸縮目盛りは、ただ画面に貼り付ければいいというものではない。
その目盛りで何を表現するのかは、ユーザーではなく開発者の問題だ。
だから、ただコピペしただけで使えますか、と聞かれたら、使えません、と言うしかない。
ただし、コピペした後、最低限必要な作業は、jsonデータの編集だけだ。
何を表示するかは、すべてjsonに入っている。
どう表示するか、はdistanceフォルダの中だ。
だから、その辺を加味すれば、コピペで使えます、といってもいいだろう。
ただ、コピペするには、量が多いよね、それは事実です。
視点3、動作は安定しているか
simulatorでは問題なく動く。
赤いErrorはないが、黄色い警告はいろいろある。
動かしているとconsoleにもいろいろ文句が出るが、止まってしまうわけではない。
そのほとんどは、null safty関連だ。
The History of EverythingはFlutter最初期、
というより、ほんとうはFlutter「初」のアプリだ。
Flutterを世に発表するために作られ、そのままupdateしていない。
恐るべきスピードで大胆な更新を続けているFlutterは、現在version3である。
ここに適用させるために、ムリヤリな修正をした場所がいくつもある。
正しく変更する知識が私にないからだ。
黄色の指摘に従うと赤いerrorになる。
修正する方法を教えていただけたらうれしい。
The History of Everythingは、
クロスプラットフォームとしてのFlutterを世に問うためのアプリなので、
iOS、Android、そしてmacOS版がある。
が、当時はまだWebにもWindowsにも対応していなかっただろう。
今回、webにあげてみたが、いろいろ問題ありだ。
webにMacでアクセスすると
きれいに表示されるし、スクロールもできるが、肝心のzoomが効かない。
webにiPhone, iPadでアクセスすると
スクロールできるし、zoomもできるが、最も縮尺率を上げた描画でフリーズする。
webにAndroidでアクセスすると
これが最も成績がよい。
若干カクカクすることもあるが、基本的には想定どおりに動く。
これらの差がなぜ出るのか、残念ながら私にはまったくわからない。
なぜDistance ?
今回、時間ではなくて、空間的距離（長さ）の比較を表示するアプリとして作った。
伸縮目盛りは「年表じゃなくても使えます」という利用例にしたかったからだ。
この目盛りは、±０を中心に、上方向にマイナス、下がプラスになるように設定されている。
The History of Everythingでは
紀元ゼロ年（ほんとは存在しないが）を０として、
一番上に-13.8 Billion、138億年前のBig Bangが来るようになっている。
それに比して、プラス側は、若干1990年のWorld Wide Webまでしかない。
Big BangとWWWがひっついてしまうぐらい縮めても、時間軸は続いている。
クラッシュ覚悟で引っぱったら9223372Trillionを越えたところで表示が消えた。
表示するには文字数が多すぎる、という以外に、特に問題はないようだ。
Distanceでは海抜ゼロメートルを０に設定した。
そして、上方向にタワーや山の高さ、飛行機の高度、オーロラ、
国際宇宙ステーション、月、ジェームズウェッブ望遠鏡、
さらに火星より外側の太陽系を配置した。
下には、海溝やマントルをへて地球の中心、
さらに地球の反対側に出て、金星、水星、太陽までを表示している。
単位は１０㎝だが、余裕で海王星まで表示できた。
1m単位なら、カイパーベルトを越えられるかもしれない。
Distanceの原点
私の最も好きなサイトの一つに、「もし月が１ピクセルだったら」がある。
これは文字どおり月を１ピクセルとして、
地球は半径４倍の16ピクセル（球ではなく円で表示だから２乗）
なら太陽は？
という感じで各天体の大きさを表示しながら、
同時に同じ縮尺でその距離を旅するサイトだ。
ひたすら、ひたすら暗闇の中を進んでいくと、ぽつんとちいさな惑星がある。
小惑星帯には（ここにたくさんの小惑星がありますが、小さすぎて表示できません）
と書いてある。
惑星と衛星は同時にみることができるが、
惑星と惑星はけっして同じ視野に入らない。
距離の比率を守りながら、同時に太陽系全体を一望できる、
それがDistanceの狙いでもある。
願わくば今後、比率を守った惑星のサイズを表示してみたいものだ。
それがすごく難しいということはよくわかっている。
zoomによってサイズの変わるイラストは、
The History of Everythingですら、実装していないのだから････。
Flutter大学はFlutterエンジニアに特化した学習コミュニティです！ 初心者から中上級者まで幅広く在籍し、切磋琢磨しています！ 入会をご希望の方はこちらから→ flutteruniv.com
Discussion