注目キーワード
  1. Web
  2. GUI
  3. DirectX

DirectX11 | 14. シェーダ版ブレンドモードテスト(随時更新)

今回は、ブレンドモードをシェーダ側で実装したものになります。

DirectX11 | 10. ブレンドモードテスト(随時更新)」と同時進行で取り組んでおりますので、同じブレンドモードテストとしてこちらも見た方がよろしいかもしれません。

これまでは、アルファ値の制御とマルチテクスチャリング、レンダーターゲット、UV値変換をしてきましたが、それらを用いてやっとシェーダ版のブレンドモードテストが出来るようになりました。

ブレンドモードの種類は公開初期では、

  • 通常(アルファブレンド)
  • 比較(暗)
  • 乗算
  • 焼き込みカラー
  • 焼き込みリニア
  • カラー比較(暗)
  • 比較(明)
  • スクリーン
  • オーバーレイ
  • ハードライト
  • 差の絶対値
  • 加算

これらのブレンドモードが実装済みになっています。

※2020/08/10追記:以下を追加しました。

  • 覆い焼きカラー
  • 覆い焼きリニア(加算)
  • カラー比較(明)
  • ソフトライト
  • ビビッドライト
  • リニアライト
  • ピンライト
  • 除外
  • 減算
  • 除算

レイヤーのブレンドモードを実装する上で参考にしたものは以下のサイトページです。

http://www.fbs.osaka-u.ac.jp/labs/ishijima/Photoshop-01.html

http://mukaimame.blog111.fc2.com/blog-entry-1320.html

あと、各ブレンドモードの計算式が間違っていたら、教えて頂けると幸いです。

プロジェクトの作成

前回同様にプロジェクトを新しく作成します。

プロジェクト名は、” 0014_ShaderBlendModeTest “としておきましょう。

プロジェクトの設定

DirectXSDKのパスを通すために、毎回プロジェクトの設定をいちいちしなければなりません。

前の記事「4. 三角形」と同じように「インクルードディレクトリパス」と「ライブラリディレクトリパス」の設定をしてください。

やり方は前と同じです。

ソースコード

以下がソースです。これも前回同様、流れが分かりやすいようにmain.cppだけでまとめました。

長いコードになっていますが、記事として読みやすいように一つのファイルにまとめることは一貫しておこうと思います。

以下のソースをコピペするか、ダウンロードしてVisual Studio の「ソースファイル」に保存してください。

コピペするなら、
「ソースファイル」で右クリックして
「追加」→「新しい項目」で、「C++ ファイル」を選び、名前を” main.cpp “にして追加ボタンを押して作成してください。

ダウンロードなら、
同じく「ソースファイル」で右クリックして
「追加」→「既存の項目」で、main.cppを選択して追加してください。

基本的には、前回の「レンダーターゲットとUV値変換」と同じ構成ですが、

シェーダ側にブレンドモードを追加したことで、

スケール・回転などを取り入れてみました。

あと、パイプラインオブジェクトは生ポインタからComPtrのスマートポインタに戻しましたので、メモリ解放を自動でやってくれます。

未実装のものもありますが、暇なときに「DirectX11 | 10. ブレンドモードテスト(随時更新)」と同時進行で随時更新していきます。


次に、シェーダ本文です。

これは「ソース ファイル」から「追加」→「新しい項目」で、

「Visual C++」→「HLSL」の中で.hlslなら何でもいいのですが(Visual Studio側が勝手にテンプレートを作るだけなので)、

ここでは「ジオメトリ シェーダー ファイル (.hlsl)」を選んで、

名前を” shaders.hlsl “にして追加ボタンを押してください。

すると、「ソース ファイル」中にshaders.hlslが作れますので、

中にあるコードを全て以下のコードでコピペして上書きするか、

ダウンロードして「既存の項目」で追加しましょう。

ブレンドを行う場合は、VSBlendの頂点シェーダに切り替えて各ブレンドモードを指定します。

ブレンドなしと通常(アルファブレンド)に関しては、マルチテクスチャリングにはなっていませんので基本色のみとなります。

今回も引き続き、前回と同じようにプロパティで「カスタムビルドツール」に設定しましょう。

次に、読み込むテクスチャを用意します。

以下のテクスチャをダウンロードしてmain.cppと同じディレクトリ下に置いてください。

以上で作成は完了です!!

以下のようになっていればOK。

ツールバーの「デバッグ」から「デバッグの開始(F5)」で実行できます。

ビルドするときは、「0014_ShaderBlendModeTest」を右クリックして「スタートアップ プロジェクトに設定」を押してプロジェクトターゲットを変更してからするようにしてください。

風景テクスチャの上に最初の画面として「ブレンドなし」のハートのテクスチャを表示できたら終わりです。

キーボードで「L」「R」キー押下でブレンドモードを切り替えて、「I」「M」キー押下でアルファ値を制御して、「K」キー押下で回転・ストップの切り替えができます。

お疲れさまでした。

exeファイル

VisualStudioで実際に動かさなくてもexeとして単体で動かせるように実行ファイルを添付しておきます。

zipなので解凍して「0014_ShaderBlendModeTest.exe」を起動してみてください。

最新情報をチェックしよう!