UI

RectTransformについてのメモ

  • 2019.02.03

RectTransform positionについて RectTransfrom.position Canvasの左下を原点とするワールド座標の位置。アンカーの場所に依存しない。Vector3を返す。 RectTransfrom.localPosition 親の中心を原点とする座標系の位置。 アンカーの場所に依存しない。 Vector3を返す。 RectTransfrom.anchoredPosi […]

UI要素をScriptから作成

 Scriptでゲームオブジェクトを作成し、そのオブジェクトに必要なコンポーネントを追加することで、 新たにUI要素を作成します。しかし、この方法でUI要素を作成すると、デフォルトの画像を使用する際に問題が生じます。Editorで実行する場合に限れば以下のコードからデフォルトの画像を取得できます。 [crayon-5f68475b34e10783590076/] 当然、Build後には使用できませ […]

端が直線にならないHPゲージの作り方(Shader)

 前回の記事では、両端の形状を維持したまま動くゲージをImageのMaskやFilledを用いて作成しました。このゲージをShaderを用いて作成しました。 Shader  作成したShaderは以下の通りです。Imageのカラー変更とImageTypeのFilledは正しく動作するようです。 [crayon-5f68475b35a46932296161/] Script  適当なゲームオブジェク […]

端が直線にならないHPゲージの作り方

 ゲージをImageのFilledを用いて作成すると、端が直線になってしまいます。そこで、ゲージの形を維持したまま、動かす方法がないかと考え、以下の方法を思いつきました。 ※端が直線にならないHPゲージの作り方(Shader)はこちら Maskを使用した方法 その1  Create→UI→ImageからCanvesに背景用Image、Mask用Imageとゲージ用Imageを作成します。 ゲージ用 […]

メッセージを表示するScript2

 前回、メッセージを表示するScriptを掲載いたしました。このScriptでは古いメッセージを消去して新しいメッセージを表示していました。今回は、古いメッセージが上へ流れていくようにしてみました。  Script  作成したScriptはこちらです。 [crayon-5f68475b36cc8965520543/] 使い方  先ほどのScriptを適当なゲームオブジェクトにドラック&ド […]

メッセージを表示するScript(2018/7/21修正)

 以前、メッセージウィンドウの作り方をブログで紹介しました。そこで、テキストメッセージを表示するScriptを作成しました。  Script  作成したScriptはこちらです。 [crayon-5f68475b37684118007289/] 使い方  先ほどのScriptを適当なゲームオブジェクトにドラック&ドロップでアタッチします。ゲームオブジェクトの名前をCreateMessag […]

メッセージウィンドウの作り方

  • 2018.06.16

画像の用意  このようなシンプルなウィンドウ画像であれば、この画像のみで様々な大きさのメッセージウィンドウを作成することができます。そのため、大きさの異なるウィンドウを作成するたび、新たに画像を用意せずに済みます。 画像の設定  使用する画像を選択し、InspectorからSprite Editorを開きます。 右下のBorderの数値をすべて20へ変更します。 これで画像の設定は終わりです。 メ […]

丸いHPゲージの作り方

 実際に作成したHPゲージはこのような感じです。Sliderを動かすとHPの値とゲージが変化します。     背景用の画像(左)とHPによって変化するゲージ用の画像(右)を用意します。       次に、シーンにCanvasを設置します。HierarchyのCreate→UI→Canvasから作成できます。   HierarchyのCreate→ […]