はじめに
気になるあの子をコロコロしたいという要望を聞いたので、物理的に気になるあの子を転がすスマホ用アプリを作りました。
iphoneだと動作が安定しないので、androidでの利用をお勧めします。
ちなみにipadだと動作が安定していました。
今回は約3日で作成しました。
構造
HTML、CSS、JavaScriptのみのお手軽実装。UIフレームワークとしてはbootstrapを使ってます。
デプロイ
netlify
作ってみての感想
javascriptでジャイロセンサーを使ったアプリを作れることを知ってウキウキで着手しましたが、canvasを使っての実装にだいぶ手こずりました。
また、バーにぶつかった時の検知も手動で作っているので、そこにも時間がかかり、リファクタリングが後回しになってしまったので、これから頑張って整えていきたいと思います。
また、私自身androidを使っていたので、iphoneでの動作確認がしっかりできず、周りの人に聞いたところ、なぜか気になるあの子が蛇のように繋がってしまうことがあったり、背景が反映されなかったりしているようです。
これもなんとかしていけたらなと思ってます。
iphoneのiOS13以降はこちらでジャイロセンサーの許可モーダルを作成しなくてはいけなかったので、そちらもいろいろなサイトを参考にさせていただきました。
https://blog.ikunaga.net/entry/ios-safari-motion-sensor-not-working/#ios13
http://dotnsf.blog.jp/archives/1076737232.html
おわりに
暇な時間のお供にどうぞお使いください。
↓暇つぶしにこちらもどうぞ。