挫折の原因！知らなくて後悔したこと...！！②【ゲーム制作記4】

2024年4月21日 09:42

はじめに

今回は、前回に引き続き挫折の原因とその対策を紹介します。
記事はこちらです！

前回から話している「挫折」は、「ゲームが作れなくて挫折」の挫折ではなく、「ゲームが作れたと思ったのに、結局ミスがあって完成させられず心が折れる」タイプの挫折です。なので、タイトルも「知らなくて後悔したこと」と付けさせていただいています。

……ということを、今執筆しながら気付きました笑

いつの間にか、自分の「挫折」が何もできなくて心が折れるというレベルから、あと一歩が足らずに心が折れるというレベルまでステップアップしていたことに驚きです。

前書きはこの程度にして、知らなくて後悔したこと3つめの紹介をしたいと思います。

今回紹介するのは、Canvasの設定です。

動作環境は

です。

昨日はWindowsだったのにまたmacに戻ってきてしまっていて申し訳ありません泣
一応どちらの環境でも操作方法は変わらなそうなので、あまり環境は気にしなくても大丈夫です！

それでは、よろしくお願いします！

ゲームにUIを追加する際には、必ずCanvasを使うことになると思います。
このCanvasくん、自動で追加されますが、実は設定をしないといけないみたいです……！！

ずっとそれを知らなくて設定してこなかったのですが、毎回ビルド時にUIがぐちゃぐちゃになる問題が発生して……苦しかったですね笑

設定は2段階あります。1つずつ見ていきましょう！

まずはCanvasをクリックして、インスペクターを見てください。
「Canvas」という部分を設定していきます。

何も触っていない状態だとこのような感じになっているのではないかな、と思います。

ここでは私がやっている設定を紹介しますが、それぞれゲームでやりたいことは異なると思いますので、必要であれば追加で調べてみてください！

【やり方】

①「Render Mode」：Screen Space-Cameraに変更
②「Render Camera」：Main Cameraをアタッチ
※「Order in Layer」：重ね順に関係しています。指定する必要がある場合変更します。

こうなっていればOKです！
これをすることで、Canvasの大きさが画面サイズに合わせて自動で調整されます。

次は同じくインスペクターで設定できる、「Canvas Scalar」という部分を設定します。

元の設定はこんな感じ。
この「Constant Pixel Size」という設定がUIの伸縮を行ってくれるものみたいなのですが、私はUIが崩れるのが嫌で、逆に伸縮を行わないでもらいたかったので違う設定を使います。

【やり方】

①「UI Scale Mode」：Scale With Screen Sizeに変更
②「Reference Resolution」：解像度を指定

私はこんな感じの設定にしています！
プラットフォームはWebGL、解像度は「960×540」に設定しているので、それに合わせてXの値は960、Yの値は540で指定しました。

Full HDで開発を行う方はここをX→1920、Y→1080にするなど。作りたいゲームにあった数字に変更しましょう！

＊

最後まで見ていただき、ありがとうございました！

昨日と今日で知らなくて後悔した3つの設定を紹介しましたが、いかがでしたでしょうか？
誰かの力になれていたら嬉しいです！

また次回の記事でお会いしましょう！

この記事が気に入ったらサポートをしてみませんか？