古のゲーム

ゴールデンウィークに「ぬし釣りやりたいな～」と思って調べたんですけど復刻版とかアーカイブみたいなのほぼ無いみたいで、なんとなくそれっぽいの作ってみよう！で作ってました

直前にPHPで画像読込できる事を知って気になっていたので、今回はJavaScriptで作成
大枠が出来たのでPHP画像のテストついでに晒しておきます
雑ですが竿投げたり戻したりは大体Fボタンです
http://yuukisv.php.xdomain.jp/fishing.html

実際アップロードしてみると初回の読込の時間があるからガタつくな～とか色々ありますね…

今回の個人的ポイントは素材の利用規約によくある
①「Webゲームでの利用は暗号化して」
②「Webゲームでの利用は直接アクセスできないようにして」
をクリアする。

①は画像ファイルを暗号化(簡単なのを.NETで)→htmlファイルからphpを読込→phpで復号化してHTTPヘッダーを画像にして返す
②は.htaccessでアクセス制限をかける

で出来たかな？と思います
こっちがPHP画像(釣り餌)でゲーム内で使用していますが踏んでも表示されないはずです
http://yuukisv.php.xdomain.jp/mki/bait.php

前回(ローグライク)はFlutterWeb内でクリアしていました
覗こうと思えば(多分)出来たけど…

マス目に縛られない移動も初めてやったので大変でした
プログラムも大分汚くなったけど次やる時はもう少し綺麗になる事に期待

おまけ
画像読込PHP

以下の方の画像借りてます
簡単な暗号化・アクセス制限していますがリソースの使用禁止です
ぴぽや　さん
https://ci-en.net/creator/118
ねくら　さん
https://ci-en.net/creator/1430
浅利しじみ　さん
https://www.ac-illust.com/main/profile.php?id=WkeSa9ob&area=1
番竹　さん
https://www.ac-illust.com/main/profile.php?id=Qd0ceyvq&area=1
hinosio　さん
https://www.ac-illust.com/main/profile.php?id=hzeON3ff&area=1
るみこ　さん
https://www.ac-illust.com/main/profile.php?id=bCZZ6uCC&area=1
Trajan　さん
https://www.ac-illust.com/main/profile.php?id=rg9hDWBo&area=1

Firebase使う

Flutterの勉強ついでに使っていたFirebase
簡単にログインが作れたりデータベース(NoSQL)がある程度無料で使えて便利！
こちらもファイルをアップロードできるようなのでやってみた(Firebase Hosting)

Flutterに移したことでWebブラウザでもできるようになった！のはいいんですけどセーブどうするの問題にぶつかりました
・アプリとして動いてないのでファイルを保存するスペースが(多分)ない
・ユーザーが識別できない(UserAgentぐらい？)

じゃあデータベースに保存する？という事でこちらもFirebase(Firestore Database)にセーブをしてみる事にしました
ユーザー名はWeb版だけ適当に入力してもらうという事で…
この辺は世の中のWebブラウザゲームは実際どうしてるんでしょうね？

ゲームの方は…というとそんなに変わってません
・道具説明追加
・中断機能
・通路にいる時の表示少し改善
・道具+1

この辺のチェックとflutterに移してから全然テストしてないのでその辺見てみるアップロードついでに晒しておきます
https://yuuki-firebase-project.web.app/

Firebaseに置いてhttpからhttpsに変わった事で(?)前回はできなかったPCのWebブラウザでもPWAが有効になってました

前回と同じくついでに晒そうとしたので操作方法書いてないのですが
マップはマップアイコン2回タップで選択→決定
ダンジョン内はタップで選択、同箇所タップで行動、プレイヤータップでメニューです

Webサーバ上及び表示される画像ファイルは多少の難読化していますがすべて借り物なので使用禁止

マルチプラットフォーム開発とPWA

ローグライクそっちのけでFlutterで遊んでいましたが、Flutterでローグライク続き作ればいいのでは？と思いチマチマ移植しています

AndroidSDK(Java)での開発からFlutter(Dart)に移したことの最大の恩恵は対応プラットフォームが増える事ですね

AndroidSDK
・Android

Flutter
・Android
・iOS
・Webブラウザ

面白いのがFlutterのWeb版はPWAという技術が標準で組み込まれていて各端末のWebブラウザのメニューから「ホーム画面に追加」を選ぶことによって端末にアプリをインストールしたようにアイコンを追加できます

Cienで見かけるR-18アプリ的な旨みで言うと各端末向けのアプリを個別にインストールさせるよりは簡単でGooglePlayやAppStoreを経由しないのでスマートフォン向けの配信に使う場合の制限はない事でしょうか(当然恩恵もない)

お試しでPWAのテストをしてみた奴です
まだ弄っている途中なので表示されるまでしばらく真っ白のままです
http://yuukisv.html.xdomain.jp/index.html

画像がずれてることやゲームの動作は置いといて
AndroidスマホでChromeからアクセスしてホーム画面に追加する場合

各々してみるとホームにアイコンを追加できます
そしてアイコンから起動するとブラウザで表示しているはずなのに余計なバーが消えます(いい)

Webサーバ上及び表示される画像ファイルは多少の難読化していますがすべて借り物なので使用禁止

アップロードテスト

AndroidAPKビルド→APKに署名→GoogleDriveへアップロードをバッチ1発でやる作業が出来たのでテストついでに最新版晒しておきます

GoogleDriveの共有から取得したアドレス
https://drive.google.com/file/d/1tFofTGyPIZtcO7F4HzbL6eploBezWbwV/view?usp=sharing
gdriveの--shareオプションでコマンドライン上に出力されたアドレス
https://drive.google.com/uc?id=1tFofTGyPIZtcO7F4HzbL6eploBezWbwV&export=download

どちらも中身同じです

Flutterに現を抜かしているのであんまり変更ないです
・隣接特殊行動を部屋外でも(バグありそう)
・通路ダッシュボタンもう少し反応よくする
・序盤の部屋サイズ弄る
・ケンゴウ効果作る
・道具+15
・状態異常+2
・少しログ増やした

おまけ
https://drive.google.com/file/d/1IWW2VmJ_Wq8lF_e_vbmy7OkQ951pWe5A/view?usp=sharing
署名の部分やアップロード部分は(自分では)調べても難しかったので使えなくもない？

↓前回と同じ

公式ストアではないのでダウンロード時に許可の設定を求められると思います
Androidの設定から行くなら
設定 > アプリと通知 > 詳細設定 > 特別なアプリアクセス > 不明なアプリのインストール > ダウンロードに使うアプリ選択(Drive) > 許可に

前回と同じくついでに晒そうとしたので操作方法書いてないのですが
マップはマップアイコン2回タップで選択→決定
ダンジョン内はタップで選択、同箇所タップで行動、プレイヤータップでメニューです

こんな感じに表示される予定なのですが崩れているなら教えてもらえると嬉しいです
画像はすべて借り物なので抽出しないでください

他端末でも表示大丈夫？

Androidアプリの勉強→脱線して風来のシレンみたいなローグライクを作って遊んでいました
キャラクタなどの描画を画面サイズから計算して大きくしているのですが、他の端末でも表示が崩れないのか気になってAndroid持ってる誰かに見てほしいなと思いCien作りました

GoogleDriveに置いたゲームです
https://drive.google.com/file/d/1P1Xqm_qYBTPl-mUVhgcznqc4DR0xh8pc/view?usp=sharing

公式ストアではないのでダウンロード時に許可の設定を求められると思います

Androidの設定から行くなら
設定 > アプリと通知 > 詳細設定 > 特別なアプリアクセス > 不明なアプリのインストール > ダウンロードに使うアプリ選択(Drive) > 許可に

急に思い立って晒そうとしたので操作方法書いてないのですが
マップはマップアイコン2回タップで選択→決定
ダンジョン内はタップで選択、同箇所タップで行動、プレイヤータップでメニューです