夜風のMixedReality

xRと出会って変わった人生と出会った技術を書き残すためのGeekなHoloRangerの居場所

MixedRealityGraphicsToolsのNPR機能の陰に画像を使用できるようにする その① プロパティの表示

本日はShader学習枠です。

〇MxedRealityGprahicsTools(MRGT)とは?

MixedRealityToolkitGraphicsTools(MRGT)はMicrosoftによって提供されているMixedRealityアプリ向けのUnitySDKであるMixedRealityToolkit3(MRTK3)の一つでグラフィックを担っています。

xRデバイスでのパフォーマンスを維持したグラフィックをコンセプトに開発されているため、例えばxRデバイスの開発でよく発生するトラブルである片目が描画されないといったトラブルが発生しない作りであるとともに、Unity開発で役立つ数多くのツールが同梱されています。

github.com

〇NPR機能とは?

NonPhotorealisticRendering(NPR)は非写実的描画という意味で、主にデフォルメしたキャラクターやコミック調の表現に使用される技法です。

GraphicsTools StandardShaderではv0.4以降でこの機能が提供されています。

この機能自体は筆者自身が作成を行っており、開発時の記事は以下になります。

redhologerbera.hatenablog.com

今回はこの機能で描画される影をカスタマイズしていきます。

〇影にテクスチャを使用する。

漫画などでは影の表現として次のようなトーンを使用することが良くあります。

 まずはトーン画像をシェーダーで使用するためにプロパティブロックにパラメータを追加します。

    Properties
    {
        // Main maps.
        _Color("Color", Color) = (1.0, 1.0, 1.0, 1.0)
        _MainTex("Albedo", 2D) = "white" {}
        [Enum(Microsoft.MixedReality.GraphicsTools.Editor.AlbedoAlphaMode)] _AlbedoAlphaMode("Albedo Alpha Mode", Float) = 0 // "Transparency"
  ・・・
        // Rendering options.
        [Toggle(_DIRECTIONAL_LIGHT)] _DirectionalLight("Light Mode", Float) = 1.0 // "LitDirectional"
        [Toggle(_SPECULAR_HIGHLIGHTS)] _SpecularHighlights("Specular Highlights", Float) = 1.0
        [Toggle(_SPHERICAL_HARMONICS)] _SphericalHarmonics("Spherical Harmonics", Float) = 0.0
        [Toggle(_NON_PHOTOREALISTIC)] _NPR("Non-Photorealistic Rendering", Float) = 0.0
        [Toggle(_SHADOW_MAP)] _NPRShadowMap("ShadowMap",2D) ="white"{}//追加

 MRGTのシェーダーの場合CustomShaderGUIによってC#側でマテリアルのパラメータ表示がカスタマイズされており、こちらも改造する必要があります。

 public class StandardShaderGUI : BaseShaderGUI
    {
        /// <summary>
        /// Common names, keywords, and tooltips.
        /// </summary>
        protected static class Styles
        {
            ・・・
            public static readonly string lightModeLitDistant = "_DISTANT_LIGHT";
            public static readonly GUIContent nonPhotorealisticRendering = new GUIContent("Non-Photorealistic Rendering", "Non-Photorealistic Rendering");
            public static readonly GUIContent nonPhotorealisticShadowTexture = new GUIContent("Shadow Tex", "Custom shadow textures for NPR");//追加
  }
  ・・・
        protected MaterialProperty sphericalHarmonics;
        protected MaterialProperty nonPhotorealisticRendering;
        protected MaterialProperty nonPhotorealisticShadowMap;//追加

  ・・・
        protected override void FindProperties(MaterialProperty[] props)
        {
   ・・・
     sphericalHarmonics = FindProperty("_SphericalHarmonics", props);
            nonPhotorealisticRendering = FindProperty("_NPR", props);
            nonPhotorealisticShadowMap = FindProperty("_NPRShadowMap", props);//追加
   ・・・
  }
   ・・・
        protected void RenderingOptions(MaterialEditor materialEditor, Material material)
        {
            EditorGUILayout.Space();
            GUILayout.Label(Styles.renderingOptionsTitle, EditorStyles.boldLabel);
    ・・・

            if ((LightMode)lightMode.floatValue != LightMode.Unlit)
            {
                materialEditor.ShaderProperty(specularHighlights, Styles.specularHighlights, 2);
                materialEditor.ShaderProperty(sphericalHarmonics, Styles.sphericalHarmonics, 2);
                materialEditor.ShaderProperty(nonPhotorealisticRendering, Styles.nonPhotorealisticRendering, 2);
               ///追加
               ///ropertyEnabled()は引数のプロパティの状態を取得してboolで返す
              ///今回はNPRを使用している場合にTrue
                if (PropertyEnabled(nonPhotorealisticRendering))
                {
                    //レイアウトを小見出しに設定(2つ分スペースを作成)
                    EditorGUI.indentLevel += 2;
                   //シングルラインとしてShadowMapの表示を追加 materialEditor.TexturePropertySingleLine(Styles.nonPhotorealisticShadowTexture, nonPhotorealisticShadowMap);
                 //レイアウトを元に戻す 
                    EditorGUI.indentLevel -= 2;
                }
            }
   ///ここまで追加

主な改装点は次の3点です。

・Style内にマテリアルのプロパティ表示用の変数を追加

・Shaderの変数名と紐づける関数FindPropertiesでFindProperty("_NPRShadowMap", props)で取得

・GUI表示用にif文でnonPhotorealisticRenderingが有効な場合にshadowMapが表示されるように実装。

これによってNPRを有効にしている場合ShadowTexの名前で_NPRShadowMapのプロパティが表示されます。

その①は以上です。

次回は実際にシェーダーの実装を行います。