unimgpicker-plusでプレイヤーにとっての課題を作れるようにする(その1)
今回は課題撲滅ゲームで一番推そうと思っている機能、『課題の自作』を導入する第一歩を踏み出そうと思います。
前提
現時点の課題撲滅ゲームは、私にとっての課題しか破壊出来ない状態です。
ゲームとしてそれは面白くないので、他のプレイヤーにとっての課題に向き合えるようにしたいです。
プレイヤーが端末に保存している画像を読み込むことで各々が新しく課題を作れるようにする、これを目指しています。
かなり面倒なことなのでは！？とやる気を失っていましたが、簡単に実現できそうなものを発見しました。
それが『unimgpicker-plus』です。
これを導入することでiOSやandroidなどカメラロールから画像を読み込めるようになります。
『unimgpicker』というのもありますが、それが本家になります。(最初違いが分からなくてこっちをダウンロードしてた)
『unimgpicker-plus』は『unimgpicker』とどこが違うのかを書いてくれていました。
細かい変更はいくつかありますが、以下の２点が最も大きな違いとなっています。
unimgpicker-plusの導入方法
まずはダウンロードします。
Download ZIPをクリックすればOK。
フォルダの中に『unimgpicker-plus.unitypackage』という物があるのでそれをUnityに読み込ませます。
Unityでプロジェクトを起動させてから上のタブのAssets→Import Package→Custom Package...で『unimgpicker-plus.unitypackage』を選択し、読み込み終わるのを待ちましょう。
終わるとエラーが出てきました。(スクショ忘れた)
どうやらiOS向けにするやつがインストールされていないと出てくるらしいです。容量食われるの嫌だけどしょうがない…
iOS向けのをインストールしたらエラーがなくなりました。
さらにエラーが出る人向け
インポートしようとすると注意マークがついていた。
どうやら同名のフォルダがあるとこのマークがつくらしいです。
これは気にせずImportを押します。
スクショ忘れたんですが、さらに警告するウィンドウが出てきました。タイトルはScript Updating Consentって書いてました。
長々しい英文と3つの選択肢が出てきますが、一番長い英文の選択肢を選択すればOKです。
するとまたエラーが出てきます。
うわ…これどうしたらいいんや…と打ちひしがれていると、ぴったりのサイトを発見。
【Unity】Plastic SCM関連のエラー - rarafyの技術ブログ
このエラーはいくつか解決策がある。
1. 一番簡単な方法
Window>Package Manager を開き、 ”Version Control”を選択して”Remove”する。
2. パッケージリセット
新規プロジェクトの場合、Package Managerの 歯車マーク→Reset Packages to defaults を押下した後、Unity Editorを再起動で直る場合がある。
3. 放置
エラーが気にならなければ放置しても問題ない。
エラー出てるけど放置してもいいやつみたいです。よかった。
しかし気になるので方法1を実践することに。
Removeして、一度プレイボタンを押すとエラーが消えました！
画像選択出来るか実機で試してみる
読み込むとプロジェクトのAssetsに新しく『Unimgpicker』のフォルダが現れます。Assets/Unimgpicker/Samples/Pickerをダブルクリックするとシーンが読み込まれます。
これで画像が選択できる状態になりました。
PCでプレイするとPCの画像を選択できます。
androidの端末を繋いでBuild and Runすればandroidの画像を選択する事ができます。
初めて繋いでプレイする端末なら以下の設定をしないとプレイ出来ないので注意。
端末の設定アプリ→システム→開発者向けオプション→開発者向けオプションをON、デバッグ内のUSBデバッグをON
課題を作れるようにする
このサイトを参考に制作しました。
【Unity】カメラロール／エクスプローラの画像を読み込む - rarafyの技術ブログ
選択した画像を表示させる
動くか試したところで実際に望んでいる形になるように制作していきます。
まずは見た目を整えていきます。
『写真から作る』の文字(ボタン)をタップすれば画像選択、白い枠(image×2)に選択した画像を表示する流れを作ろうと思います。
Assets/Unimgpicker/PrefabsのUnimgpickerをヒエラルキーに追加。
そしてボタンにスクリプトを追加します。
Assets/Unimgpicker/Samples/AddImageをボタンにドラッグ。
画像のようにオブジェクトを入れ込みます。
それから、ボタンにイベントを登録します。
オブジェクトには自身(ボタン)を、イベントにはAddImage→OnPressShowPicker()を選択します。
これで動くはず！実機でプレイしてみます。
いけた！！！
自分のフィールドに持ち込む事ができました。
今回はここまでにします。
今後やることリスト
画像は選択できるようになりました。実現までまだまだですが、あと何をしたらいいかまとめてみます。
- 実際のサイズどうなるか表示
- トリミング(横長の画像とかだと無理やり圧縮される)
- 保存するボタン
- 保存した課題を閲覧・削除する
- 保存した課題を実際に破壊できるようにする
トリミングは出来るのか分かりませんが…次回はこのあたりを進めていきます。
その2はこちら↓
