読者です 読者をやめる 読者になる 読者になる

おもちゃラボ

Unityで遊びを作っていきます

【Unity】ゲーム実行中にインスペクタで変更した値を停止後に反映させる方法

Unityではゲームを実行しているときにインスペクタから入力した値は、実行終了後にはもとに戻るようにできています。ゲーム実行中にオブジェクトの位置を少し変えてみたり、ライトの方向を少し変えてみたりと実験するのにはとても便利です。

でも、実験して気に入った修正でも、停止ボタンを押すと否応なく消されてしまいます。それが嫌ならスクリーンショットでも撮っておくしかない・・・

江戸時代ならまだしも、いまは2017年なんです。飛行機は空を飛び、人はバーチャル空間で遊び、ケモノはフレンズになったんです。スクリーンショットを撮っている場合ではないのです。

f:id:nn_hokuson:20170417184259p:plain:w500

なので、いい方法がないか探していた所・・・
テラシュールブログさんにこんな記事が!

tsubakit1.hateblo.jp

この方法で確かに変更した値は保存できるのですが、ちょっとだけ手間がかかりますね。ということで、他に方法がないかとインスペクタを触ってみると・・・あるじゃないですか!

インスペクタの歯車を押すと表示されるドロップダウンメニューの中に「Copy Component」という項目があります。ゲーム実行中にインスペクタから値を調整した後、この「Copy Component」を選択します。

f:id:nn_hokuson:20170417183825j:plain

ゲームを停止すると、インスペクタの値は一旦もとの値に戻ってしまいますが、ここで再度歯車ボタンから「Paste Component Values」を押してください。

f:id:nn_hokuson:20170417183844j:plain

すると、ゲーム実行時にコピーした値がまるっとコピーされます!めっちゃ便利!これがやりたかった!さすが平成!解決方法もスマートですね。

Unity5の教科書 (Entertainment&IDEA)

Unity5の教科書 (Entertainment&IDEA)

飛行機の歴史

飛行機の歴史

【Unity】Dissolve(溶けるような)シェーダをつくる

Dissolveってなんのこっちゃら?と思って辞書を調べてみたら・・・

Dissolve : 分解する、分解させる、溶かす、解消する

だそうです!

Dissolveシェーダ自体は分解というよりも侵食に近い感じがしますが、ジワーっと消えていくタイプのアニメーションのことです。

この記事ではUnityのサーフェイスシェーダを使ってディゾルブシェーダを作る方法を紹介します。

f:id:nn_hokuson:20170414202959j:plain

Dissolveシェーダの考え方

トゥーンシェーダや氷のシェーダなどと比べると、Dissolveシェーダの考え方は非常に簡単です。
nn-hokuson.hatenablog.com

幾何学図形やノイズのテクスチャ(別に幾何学じゃなくても大丈夫!)を用意し、そのピクセル明度によって「表示する・しない」を切り替えます。
f:id:nn_hokuson:20170414203318j:plain

幾何学図形のテクスチャはどのようなものでも使用できるので(ノイズ画像がきれいな消え方にはなりやすいですが・・・)いろいろ試してみると発見があるかも!?
f:id:nn_hokuson:20170414203402j:plain:w500

ピクセルの明度に対するしきい値をシーケンシャルに変化させることで、フワァっと侵食されて消えていくような効果を表現することができるのです。

f:id:nn_hokuson:20170414203521j:plain:w475

まずはいつもどおりの下準備

いつもと同じようにシェーダファイルと、それに対応するマテリアルを作ります。プロジェクトビューで右クリックし、「Create」→「Shader」→「Standard Surface Shader」を選択、「Dissolve」という名前で保存します。作成したDissolveシェーダを選択した状態で、右クリック→「Create」→「Material」でシェーダに対応するマテリアルを作ります。

f:id:nn_hokuson:20170414204025p:plain:w200

作成したマテリアルは3Dモデルにアタッチしておきましょう。

Dissolveシェーダの作り方

続いてDissolveシェーダを実装していきましょう。次のプログラムを入力してください。

Shader "Custom/disolve" {
	Properties {
		_Color ("Color", Color) = (1,1,1,1)
		_MainTex ("Albedo (RGB)", 2D) = "white" {}
		_DisolveTex ("DisolveTex (RGB)", 2D) = "white" {}
		_Glossiness ("Smoothness", Range(0,1)) = 0.5
		_Metallic ("Metallic", Range(0,1)) = 0.0
		_Threshold("Threshold", Range(0,1))= 0.0
	}
	SubShader {
		Tags { "RenderType"="Opaque" }
		LOD 200
		
		CGPROGRAM
		#pragma surface surf Standard fullforwardshadows
		#pragma target 3.0

		sampler2D _MainTex;
		sampler2D _DisolveTex;

		struct Input {
			float2 uv_MainTex;
		};

		half _Glossiness;
		half _Metallic;
		half _Threshold;
		fixed4 _Color;

		UNITY_INSTANCING_CBUFFER_START(Props)
		UNITY_INSTANCING_CBUFFER_END

		void surf (Input IN, inout SurfaceOutputStandard o) {
			// Albedo comes from a texture tinted by color
			fixed4 m = tex2D (_DisolveTex, IN.uv_MainTex);
			half g = m.r * 0.2 + m.g * 0.7 + m.b * 0.1;
			if( g < _Threshold ){
				discard;
			} 

			fixed4 c = tex2D (_MainTex, IN.uv_MainTex) * _Color;
			o.Albedo = c.rgb;
			// Metallic and smoothness come from slider variables
			o.Metallic = _Metallic;
			o.Smoothness = _Glossiness;
			o.Alpha = c.a;
		}
		ENDCG
	}
	FallBack "Diffuse"
}

デフォルトのSurface Shaderからの変更点は次の二点です。

・プロパティにDissolve用のテクスチャとしきい値を追加
・surfメソッドにディゾルブのためのプログラムを追加

インスペクタからDissolve用のテクスチャを設定できるようにプロパティに_DisolveTexを追加しています。また、「消す・消さない」のしきい値を決めるための_Threshold変数を追加しています。

surfメソッド内ではDisolveテクスチャから値を取り出し、グレースケールに変換しています。グレースケールの変換式は次のようになります。

Gray = R * 0.3 + G * 0.6 + B * 0.1

こちらの記事も合わせて参考にしてください。
nn-hokuson.hatenablog.com

グレースケールに変換後、明度がしきい値(_Threshold)以下のものについては破棄(discard)しています。

実行結果

マテリアルにDissolve用のテクスチャをセットしてから、_Thresholdの値を変化させると次のようにDissolveの効果が確認できます。

f:id:nn_hokuson:20170414203743g:plain

Dissolveテクスチャを変えると消滅の見え方も変わるので、いろいろなテクスチャで試してみてください〜!

f:id:nn_hokuson:20170414203756g:plain

f:id:nn_hokuson:20170414203808g:plain

f:id:nn_hokuson:20170414203903g:plain

まとめ

今回は敵キャラを消滅させるときなど、オブジェクトを破棄したいときに使えるディゾルブ(Dissolve)シェーダを作りました。簡単に色々なパターンを作れるので試してみて下さいね!

DirectX 9 シェーダプログラミングブック

DirectX 9 シェーダプログラミングブック

OpenGL 4.0 シェーディング言語 -実例で覚えるGLSLプログラミング-

OpenGL 4.0 シェーディング言語 -実例で覚えるGLSLプログラミング-

【Unity】スクリプトでRGBとHSVを相互に変換する方法

色空間を表す方法は色々(←ギャグではありません)あるのですが、その中でも有名なものに「RGB」と「HSV」があります。

f:id:nn_hokuson:20170414003339j:plain

RGBとHSVについて

RGBは毎度おなじみのR(Red)、G(Green)、B(Blue)の三原色を使って色を表現する方法です。

HSVはH(Hue)とS(Saturation)、V(Value)を使って色を表現します。Hueは色相、Saturationは彩度、Valueは明度を意味します。

Unityのカラーピッカーでも↓のボタンを押すことでRGBとHSV空間を切り替えることができます。

f:id:nn_hokuson:20170412193528p:plain:w150

ここではスクリプトからHSVを使ってマテリアルの色を指定する方法を紹介します。

スクリプトを使ったRGBとHSVの変換方法

スクリプトでRGBからHSV、またはHSVからRGBに変換するにはUnityEngine.ColorクラスのRGBToHSV、HSVToRGBメソッドを使います。

docs.unity3d.com

例えば、HSVを指定する3本のスライダがあったとして、これをマテリアルの色として使うには、次のように一旦RGBに変換する必要があります。

using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.UI;

public class Converter : MonoBehaviour {

	public Slider H, S, V;

	void Update () {
		GetComponent<Renderer> ().material.color = 
			UnityEngine.Color.HSVToRGB (H.value, S.value, V.value);
	}
}

実行結果は次のような感じになります。HSVそれぞれのスライダーを調整することで立方体の色が変わります。

f:id:nn_hokuson:20170412193626g:plain

RGBからHSVの変換は「足して3で割る」みたいに簡単な処理ではありません。それなりに時間がかかるので、画像処理のような全ピクセルに対して処理する場合には注意が必要です。

興味のある方は次の記事を参考にしてください。
www.peko-step.com