テラシュールブログ

旧テラシュールウェアブログUnity記事。主にUnityのTipsやAR・VR、ニコニコ動画についてのメモを残します。

GUI(uGUI/NGUI/旧UI)

【Unity】UIに立体的に見せるライティングを付ける

要するにuGUIにノーマルマップを適応してみた所、少し面白い感じになったので紹介します。ドット絵のようなものは、もう少しマトモなノーマルマップを適応するともう少し綺麗になるかも。 ノーマルマップ 3Dモデルでモデルを立体に見せる手法の一つにノーマ…

【Unity】uGUIのボタンクリック後のハイライトを消す

UnityのuGUIでボタンを作った時、クリック後にハイライトが消えない事があります。この場合、例えば下のような感じで動きます。対象をクリック後、明らかにハイライトが残っているのが分かります。 このハイライトが残っているのは、単純にUIがゲームパット…

【Unity】uGUIでスプライトアニメーションするには

uGUIでスプライトアニメーションを行う方法についてです。難しい事は全くないのですが、気づかないと分からないかもしれないので、一応ここに書いておきます。 下のGIFはキャラクターアニメーションをuGUIで行って居るので影付けたりアウトライン付けたり、…

【Unity】5.3に追加されたマルチ・シーン・エディティングで出来る事

今回はマルチシーンエディティングについてです。 マルチシーンエディティング ステージやギミック毎にシーンを分割して同時編集 ステージを複数のシーンに分割して編集・平行構築 シーン毎にUIを作成して加算読込とか管理 本番シーンに機能を移植 マルチシ…

【Unity】uGUIドロップダウンメニュー(コンボボックス)の使い方

ドロップダウンについてです。 ドロップダウン(或いはコンボボックス)とは、よくある「ボタンを押したら選択肢が出てきて、その中から選択する」的なアレです。 目次 目次 とりあえずの使い方 カスタマイズ 要素を増やす UIの表示を変える 関連 とりあえず…

【Unity】パフォーマンスが良いらしいUIのマスク、RectMask2Dについて

Maskと異なり四角形でしか切り抜けませんが、Maskよりかなり高速に動作するRectMask2Dが何時ごろか追加されました。 このRectMask2DはRectTransformの範囲で切り抜きを行うためMaskで必要だった「画像」を必要としませんが、その代わり高速で動作するみたい…

【Unity】Unityでトランジションを使用した綺麗な場面転換(uGUI対応版)

以前に紹介した「場面転換」をよりスムーズな感じで行う処理ですが、uGUIに対応させるついでにUI単位で削除出来るようにしました。 UnityでuGUIのトランジション。パターンはマスク画像(白黒画像)を使用。トランジションするUIの下にあるUIも一緒に消える …

【Unity】uGUIのテキストがボケる問題の対策について

Unityの新しいUIシステム、通称uGUIでフォントがボケる問題についてです。 以前に UnityのuGUIのテキスト表示機能について解説してみる で解説していますが、もう少し詳しく紹介します。 目次 目次 uGUIでフォントがボケる問題の対策 ScreenSpaceの場合 Worl…

【Unity】uGUIのシェーダーを改造してシェーダーを練習…のススメ

目次 目次 シェーダーの用意 シェーダーのカスタマイズの準備 シェーダーの改造(色を変える) パラメータをシェーダーの外から設定する その他 関連 シェーダーの用意 まずはuGUI用のシェーダーを用意します。 UnityのビルトインシェーダーはUnityのダウン…

【Unity】各要素の高さが変動するスクロールビューを使ってチャットっぽい何かを作る

「高さの要素が異なる&テキストにある程度のマージンがあるリストビュー」を作る方法について紹介します。 リストビューを作る方法については、下の記事参照。 tsubakit1.hateblo.jp 作り方 こんな感じのスクロールビューを作ります。 各要素の高さに合わせ…

【Unity】モデルより奥にあるスプライトやUIをモデルより手前に表示させる

モデルよりUIやスプライトの方を手前に配置したい時があります。例えば、ダメージエフェクトであったり、その他諸々であったり。 これを実現するもっともシンプルな方法は、カメラをもう一台用意して追記する事です。Layerを分ける必要が出ますが、後から追…

【Unity】ArborとuGUIの連携について

【Unity】期間限定で無料になったビジュアルスクリプティングのアセット「Arbor」で遊んでみた - テラシュールブログtsubakit1.hateblo.jp 先日紹介したビジュアルFSMアセットのArborですが、今回はuGUIと連携してみました。 uGUIとの連携のキモとなるのはUn…

【Unity】とりあえずメニューを作るサンプルにはなる、Game Jam Menu Template

店主!とりあえずメニューくれ! みたいな事はやったことが無いのですが(居酒屋とか怖すぎる)、とりあえずメニューが欲しくなる事があります。具体的にはゲームジャムとか。 それを作る手間は正直それ程では無いのですが、あると何かと参考になるかなーと…

エディター操作で登録するのが面倒なボタンのクリックイベントを、スクリプトで登録する

Unityのボタン等のイベントをシーン内に登録/保持するには、UnityEditor.EventsのUnityEventToolsを使用します。 エディタ上でメソッドを登録するメリットは3つです。 実行時にイベントの登録処理を必要としない EventListenerの引数とマッチしないメソッド…

UnityのuGUIでボタンと一緒に後ろのオブジェクトが押されないようにする

UnityのuGUIのボタンを押した際、背面にあるオブジェクトも一緒に押されるケースの対策について紹介します。 これを回避するには、EventSystems.EventSystem.IsPointerOverGameObjectでボタンを選択中か判定し、選択中なら押さない事にする…といった形で修正…

シーンビューのオブジェクトをタップしても選択できない

最近シーンビューのオブジェクトを選択しようとした際、何故か上手く選択できないケースが発生しました。 これはどうやらCanvasを選択してしまっている為に発生していました。Hierarchyビューをよく見ると、ボールを選択したつもりがCanvasがアクティブにな…

Unityの2DやuGUIのパフォーマンス最適化についての7つのTips

最適化というか、改善する話です。 モバイル向けに作った時に妙に遅かった場合、この辺りの要因が絡んでいるケースが多い印象です。この辺りは作る際に確認しながら作ると、後々痛みが少なくて良いかなと思います。 目次 目次 プロファイラで確認する エディ…

iOSアプリだと思った?残念、uGUIちゃんでした!

iOSのUIを真似る事は昔からよくありました。例えば何故かiOSのヘッダーやフッダーを真似て作成されているWebサイトや(iphoneのsafariで見ると二重にヘッダーが表示される)、AndroidなのにiOSそっくりなUIを持ったアプリ等々。 確かに「UIの統一感」は一昔前…

UnityのuGUIとImageとSpriteとスライスについて

uGUIのスライスは覚えておくと便利な機能です。 今回はコレを作ろうと思いましたが、スライス部分が予想以上に色々と出来たので分割します。コレの作り方は次回。 目次 目次 スライスする方法 大きさを調整する 真ん中を塗りつぶさないでフィルレートを節約…

UnityのuGUIでコンボボックス(或いはドロップダウンリスト)を作る

UnityのuGUIには現状コンボボックスが無いです。それは作ろうと思えば作れますが、正直面倒なのでコミュニティのナレッジより拝借します。 A working, stylable combo box (drop down list) | Unity Community A working, stylable combo box (drop down lis…

UnityのuGUIでアナウンス的な表現を作ってみる

以前にもチラっと紹介しましたが、改めてuGUIでのアナウンス表示の作成について紹介しておきます。 内容はこんな感じです。 逆引き、UnityのuGUIのレイアウトトレーニング(uGUI RectTransform入門その2) - テラシュールブログ 逆引き、UnityのuGUIのレイ…

UnityのuGUIで複数のスクロールビューを切り替える演出の作り方

FacebookのUnity助け合い所で質問があったので、ちょっと書いておきます。(件の問題は解決済み) とりあえず、こんな感じのを作ります。今回はボタンで制御しますが、画面端からのスワイプやスクロールバー自体のスワイプといったギミックで差替えても良い…

UnityのuGUIで「UIのアニメーション制御」

目次 目次 UnityのuGUIで「UIのアニメーション制御」 uGUIでアニメーション アニメーションの作成手順 画面の準備 AnimatorとAnimationClip作成 キーフレームの登録 AnimationControllerの設定 AnimationControllerをスクリプトで制御する 感想 ライセンス …

UnityのuGUIで階層構造を持ったスクロールビューを作る

目次 目次 階層構造を持ったスクロールビュー ソースコード 使い方 感想 関連 階層構造を持ったスクロールビュー 今回はスクロールビュー(横)の中にスクロールビュー(縦)があるような構造のスクロールビューを作成します。 uGUIは子がScrollRectを持って…

Unity uGUIでスライダーについて解説してみる

uGUIのスライダーについて解説します。 目次 目次 スライダーの作り方 スライダーの範囲調整 画像の調整 挙動の調整 スライダーの作り方 スライダーを作るにはCreate>UI>Sliderを選択します。 スライダーの範囲調整 スライダーは合計6個のオブジェクトで構成…

逆引き、UnityのuGUIのレイアウトトレーニング(uGUI RectTransform入門その2)

RectTransformの座標指定についてです。 内容は以前に書いた入門の焼き直し+αです。理屈については大体書いてるので、そっちを参考にしてくれると助かります。 UnityのuGUIのレイアウト調整機能について解説してみる(RectTransform入門) - テラシュールブ…

UnityのGameObjectを非アクティブにするとAnimatorがリセットされる挙動、その対処法

新しい対処法はこちら tsubakit1.hateblo.jp --- マニュアルに書いてあったか記憶が微妙なのですが、UnityのAnimatorはGameObjectが非アクティブになるとリセットされます。 ここで言うリセットとはアニメーションが最初に戻るだけ等の生易しい物ではなく、…

UnityのAnimatorControllerにAnimationClipを内蔵する

ことUIにAnimatorを使う場合、ほとんど使いまわす事ができずプレハブもしくはシーンに従う形でAnimationControllerが 作られ、AnimationControllerが参照するAnimationClipは参照という形を取りながら完全に専用アニメーションとして扱われ ます。 そのためA…

UnityのCollider2DやColliderに対してクリックやドラッグのイベントを使う

Unity4.6よりUnityにはEventSystemが追加されました。これは例えばドラッグやクリックといった基本的な挙動を登録することが出来ます。 例えばダブルクリックを検知するコード。 // ダブルクリックを検知する これをColliderがアタッチされているオブジェク…

UnityのuGUIのクリック範囲を広げたり制限したりする方法

Unityのボタンは画像の範囲でクリック判定を行います。 この範囲は基本的にGraphicクラスが表示されている範囲に適応されます。要するに「画像が表現されている範囲(の四角)」に適応されます。 この当たり判定の範囲を絞るには、ICanvasRaycastFilterを使…