- 投稿日:2022-03-23T22:19:01+09:00
【Unity】Editor拡張でメニューからHLSLを作成できるようにした
ソースコード こんな感じで作れるようになります。 作ったわけ HLSLをUnityで作るには右クリックしてShow in Explorer テキストを作成して 名前を変更して拡張子をhlslに書き換えれば完成! しかしこの一連の動作が面倒くさいのでEditor拡張して簡単に作れるようにしようというわけです。 解説 [MenuItem("Assets/Create/Shader/HLSLScript")] これでUnityの上のメニューバーのAssetsボタンやProjectウィンドウで右クリックしたときにメニューを追加します。 foreach (Object obj in Selection.GetFiltered(typeof(DefaultAsset), SelectionMode.DeepAssets)) { if (obj is DefaultAsset) { path = AssetDatabase.GetAssetPath(obj); } } これで右クリックした場所のパスを取得します。 path = EditorUtility.SaveFilePanelInProject("CreatHLSLScript", "NewShader", "hlsl", "", path); EditorUtility.SaveFilePanelInProject()を使うことでファイルを生成するウィンドウを出すことができます。 参考 : https://docs.unity3d.com/ja/current/ScriptReference/EditorUtility.SaveFilePanelInProject.html File.WriteAllText(path,""); File.WriteAllText()で新しいファイルを作成します。 参考 : https://docs.microsoft.com/ja-jp/dotnet/api/system.io.file.writealltext?view=net-6.0 AssetDatabase.Refresh(); 最後にAssetDatabase.Refresh()で更新を行います。
- 投稿日:2022-03-23T14:39:20+09:00
【Unity】3Dオブジェクトに透過処理された2D画像を透過部分を反映させる
はじめに 今回は3Dオブジェクトに透過処理された2D画像を透過部分を反映させるやり方を説明します。 基本のキなのでご存じの方も多いと思いますが、Shader Graphについてはまとめている記事が少なく私は苦労しました。 同じように困っている方の参考になれば幸いです。 この記事ではMacOS Monterey 12.0にインストールしたUnity 2020.3.20f1を使っています。 URP (Universal Render Pipeline)テンプレートからプロジェクトを作っています。 手順 1) 既存のShaderを使う 透過処理されている画像(png形式)を用意 Unity > Project内の任意のフォルダーに入れます Hierarchyの+ボタン、または右クリックで3Dオブジェクトを作成します今回はハリボテのように表示させたいのでQuadを作成します Projectの+ボタン、または右クリックCreateからMaterialを任意のフォルダーに作成します わかりやすい名前にしておきます Materialを適用させたいオブジェクトにアタッチさせます 作成したMaterialを選んだ状態で、InspectorからShaderでUniversal Render Pipeline > 2D >Sprite-Lit-Defaultを選びます DiffuseのTexture>Selectから表示させたい画像を選ぶか、ドラッグしてアタッチします 透過部分が透過されて表示されます。 ※Shader Unlit > Transparentでも同じように表示されます。 (基本的な手順はとんプログラミングを参照しています) 2)Shader GraphでShaderを自作する場合 最初の手順は(1)の手順1〜4まで同じです。 Projectの+ボタン、または右クリックCreateからShader > Universal Render Pipeline > Unlit Shader Graphを任意の場所に作成します。お好きな名前をつけてください。 MaterialのShaderを2で作成したものにします。 作成したShader Graphを開きます Graph InspectorのGraph Settingタブ > Universal > SurfaceのプルダウンからTransparentを選びます 右クリックでCreate Node > Sample Texture 2D を作成 Sample Texture 2DのRGBAとFragmentのBase Colorを繋げる Save Assetをクリックして保存する Sample Texture 2DのTextureに表示させたい画像をアタッチします これで画像が表示されました。ですが透過反映されていません 次に右クリックでCreate Node > Stepを作成 Sample Texture 2DのAとStepのInを繋げ、StepのOutとFragmentのAlphaを繋げます 変更をSaveすると透過が反映されます ただジャギーや髭が細いのが気になるので一手間かけます! Blackboardウィンドウ(シェイダーの名前が表示されているウィンドウ)の「+」ボタンをクリックしてVector2を作成 とりあえず名前を「Cutoff」にします Cutoffを選んでPropertyでXの値を0.2ぐらいにします CutoffをドラッグしてStepのEdgeに繋げます セーブして反映させます 髭の線が太くなりました ただ白いフチが出てしまったので値を調整などしてご自分の望むようにしてくださいませ (手順はUnity公式YouTube、Unity Answersを参考いたしました)
- 投稿日:2022-03-23T14:39:20+09:00
【Unity】3Dオブジェクトに透過処理された2D画像の透過部分を反映させる
はじめに 今回は3Dオブジェクトに透過処理された2D画像を透過部分を反映させるやり方を説明します。 基本のキなのでご存じの方も多いと思いますが、Shader Graphについてはまとめている記事が少なく私は苦労しました。 同じように困っている方の参考になれば幸いです。 この記事ではMacOS Monterey 12.0にインストールしたUnity 2020.3.20f1を使っています。 URP (Universal Render Pipeline)テンプレートからプロジェクトを作っています。 手順 1) 既存のShaderを使う 透過処理されている画像(png形式)を用意 Unity > Project内の任意のフォルダーに入れます Hierarchyの+ボタン、または右クリックで3Dオブジェクトを作成します今回はハリボテのように表示させたいのでQuadを作成します Projectの+ボタン、または右クリックCreateからMaterialを任意のフォルダーに作成します わかりやすい名前にしておきます Materialを適用させたいオブジェクトにアタッチさせます 作成したMaterialを選んだ状態で、InspectorからShaderでUniversal Render Pipeline > 2D >Sprite-Lit-Defaultを選びます DiffuseのTexture>Selectから表示させたい画像を選ぶか、ドラッグしてアタッチします 透過部分が透過されて表示されます。 ※Shader Unlit > Transparentでも同じように表示されます。 (基本的な手順はとんプログラミングを参照しています) 2)Shader GraphでShaderを自作する場合 最初の手順は(1)の手順1〜4まで同じです。 Projectの+ボタン、または右クリックCreateからShader > Universal Render Pipeline > Unlit Shader Graphを任意の場所に作成します。お好きな名前をつけてください。 MaterialのShaderを2で作成したものにします。 作成したShader Graphを開きます Graph InspectorのGraph Settingタブ > Universal > SurfaceのプルダウンからTransparentを選びます 右クリックでCreate Node > Sample Texture 2D を作成 Sample Texture 2DのRGBAとFragmentのBase Colorを繋げる Save Assetをクリックして保存する Sample Texture 2DのTextureに表示させたい画像をアタッチします これで画像が表示されました。ですが透過反映されていません 次に右クリックでCreate Node > Stepを作成 Sample Texture 2DのAとStepのInを繋げ、StepのOutとFragmentのAlphaを繋げます 変更をSaveすると透過が反映されます ただジャギーや髭が細いのが気になるので一手間かけます! Blackboardウィンドウ(シェイダーの名前が表示されているウィンドウ)の「+」ボタンをクリックしてVector2を作成 とりあえず名前を「Cutoff」にします Cutoffを選んでPropertyでXの値を0.2ぐらいにします CutoffをドラッグしてStepのEdgeに繋げます セーブして反映させます 髭の線が太くなりました ただ白いフチが出てしまったので値を調整などしてご自分の望むようにしてくださいませ (手順はUnity公式YouTube、Unity Answersを参考いたしました)