0.やりたかったこと
こういうダイアログを開いて、アプリ内にローカル保存のデータ(画像とか)をインポート、そのデータを利用する、というもの
※間違ってもこの↓↓古いデザインのダイアログではない…
懐かしいけれどもね…?💦
(こちらのやり方もリクエストがあれば書きますが…いりますかね…OpenFileDialogを使う方法だと、自分の環境ではこんなダイアログになるんです…)
1.環境
- Windows10Pro Version 20H2
- Unity2020.3.21f (LTS)
- Microsoft Visual Studio Community 2019 Version 16.11.8
2.使用するもの
外部アセットとしてこれを使わせていただきます…!
制作者の方には心よりの感謝を…(- -)(_ _)ペコリ
3.導入手順
画像多めで説明しますので、おそらく秒で導入できるのではないかと…
3-1.Unityプロジェクトの下準備
②先述のページの中ほどにあるDownload PackageをクリックしてUnityPackageをダウンロード
そのUnityPackageをUnityプロジェクト内にドラッグ&ドロップでインポートします
④エラーがいくつか吐いていると思います。
これらはUnity既存のパッケージで競合しているものがあるのが原因なようで、解決するべく左上のタスクバーのWindowsをおします
⑥VersionControlがあると思いますので、これをRemoveで削除してください
⑦…これで準備完了なのですが、未だ残っているエラーメッセージが気になる人はクリアしてください…
3-2.ボタンの設置
⑨Buttonのサイズなど、微調整は各自お願いします
私はわかりやすいように、後でstretch×stretchで画面サイズピッタリにしました
3-3.スクリプトの作成・アタッチ
⑫スクリプトをダブルクリックして、実際にスクリプトを作成します
入力するスクリプト
using UnityEngine;
using UnityEngine.UI;
using SFB; //追加(ダイアログ出す用,今回の本題)
using System.IO; //追加(画像データを加工する用)
public class OpenExplorer : MonoBehaviour
{
Image image; //スクリプトをアタッチしたbuttonのImageコンポーネント
void Start()
{
image = GetComponent<Image>();
}
/// <summary>
/// ボタンを押したらダイアログが表示される
/// ダイアログで指定した画像をボタンに反映する
/// </summary>
public void OnClickFileOpen()
{
// フィルタはここで追加操作する
// new ExtensionFilter("表示名", "拡張子1", "拡張子2", ...)
var extensions = new[] {
new ExtensionFilter("画像ファイル", "png","jpg"),
new ExtensionFilter("すべてのファイル", "*"),
};
// ダイアログを表示する
// StandaloneFileBrowser.OpenFilePanel("タイトル", "最初のディレクトリ場所", [フィルタ設定], [複数選択可能かどうか(true or false)])
string[] path = StandaloneFileBrowser.OpenFilePanel("画像ファイルを選択", "", extensions, false);
// Pathは文字列の配列だから、1つの場合は1個のみかの判定 + null判定
if (path.Length == 1 && path[0] != null)
{
//OKボタンがクリックされたとき、選択されたファイル名を表示する
Debug.Log(path[0]);
//選択した画像をバイト型のデータで読み込む
byte[] bytes = File.ReadAllBytes(path[0]);
//バイト型のデータをTexure2D型に変換
Texture2D texture = new Texture2D(1, 1);
texture.LoadImage(bytes);
//Texure2D型のデータをsprite型に変換して代入
image.sprite = Sprite.Create(texture, new Rect(0, 0, texture.width, texture.height), Vector2.zero);
}
}
}
⑬スクリプトを作成したら、Buttonにドラッグ&ドロップしてアタッチします
また、Buttonを選択したまま、OnClick()の下の+をおします
⑭NoneとなっているところにButtonをドラッグ&ドロップします
⑮NoFunctionを押し、OpenExplorer → OnClickFileOpen()を選択します
4.テストプレイすると
お疲れさまでした。これで実装手順は終了です
再生ボタンを実際に押して…
その後ボタンをクリックすると…よく見るダイアログが出てきたでしょうか…?
実際に適当な画像を選択すると…
5.ビルド時の注意
上記の手順で、Unityエディタ上の挙動はすべて作成可能だと思うのですが、スタンドアロンビルド(パソコン用ビルド)するのであれば、設定面でひと手間が必要なようです。
①UnityBuildの画面からPlayerSettingにいきます
②PlayerのProjectSettingを下へとスクロールし…
④あとはビルドすればうまくいくはず!
6.編集後記
この場を借りまして、今回の件に関して快く相談に乗ってくれ、解決策を惜しみなく教えてくれた職場の同僚・友人に心よりの感謝を。いつも自分を助けてくれてありがとう。2022年もどうかよろしく!