メインコンテンツまでスキップ
バージョン: 2.0.0-preview

ディスプレイスメントマップ

ディスプレイスメントマップの色情報をピクセル単位のオフセットとして用いて、画像を歪ませます。チャンネル で選択したチャンネルが水平・垂直のずれを駆動します。

ライブラリでの場所​

「ライブラリ」 → フィルターエフェクト → ディスプレイスメントマップ

プロパティ​

ディスプレイスメントマップ (DisplacementMap)​

ディスプレイスメントを駆動するブラシ。

  • 型: Brush?
  • 既定値: 放射グラデーション(中心が白で外側が透明)
  • アニメーション: 不可

トランスフォーム (Transform)​

マップをサンプルする前に適用するトランスフォーム。

  • 型: DisplacementMapTransform?
  • 既定値: 移動トランスフォーム
  • アニメーション: 不可

広がり方 (SpreadMethod)​

マップを端で折り返す方法(Pad / Reflect / Repeat)。

  • 型: GradientSpreadMethod
  • 既定値: GradientSpreadMethod.Pad
  • アニメーション: 可

チャンネル (Channel)​

ディスプレイスメントを駆動するマップのチャンネル。

  • 型: DisplacementMapChannel
  • 既定値: DisplacementMapChannel.Alpha
  • アニメーション: 不可

符号あり (Signed)​

true のとき、0.5 を変位ゼロとする符号付きモードになります。

  • 型: bool
  • 既定値: false
  • アニメーション: 不可

ディスプレイスメントマップを表示 (ShowDisplacementMap)​

true のとき、デバッグ用にマップ自体を表示します。

  • 型: bool
  • 既定値: false
  • アニメーション: 可

ディスプレイスメントトランスフォーム​

以下は トランスフォーム プロパティに設定可能なオブジェクトの種類です。

移動トランスフォーム​

変位値を 2D の平行移動オフセットとして適用します。

  • X: float、既定値 0、アニメーション可。変位最大時の水平オフセット(ピクセル)。
  • Y: float、既定値 0、アニメーション可。変位最大時の垂直オフセット(ピクセル)。

スケールトランスフォーム​

変位値を中心点周りの拡大縮小として適用します。

  • 拡大率 (Scale): float、既定値 100、アニメーション可。変位最大時の等方倍率(パーセント)。
  • X方向拡大率 (ScaleX): float、既定値 100、アニメーション可。水平方向倍率(Scale に乗算)。
  • Y方向拡大率 (ScaleY): float、既定値 100、アニメーション可。垂直方向倍率(Scale に乗算)。
  • 中心 X (CenterX): float、既定値 0、アニメーション可。画像中心を原点とするピボットの X オフセット(ピクセル)。
  • 中心 Y (CenterY): float、既定値 0、アニメーション可。画像中心を原点とするピボットの Y オフセット(ピクセル)。

回転トランスフォーム​

変位値を中心点周りの回転として適用します。

  • 回転 (Rotation): float、既定値 0、アニメーション可。変位最大時の回転量(度)。
  • 中心 X (CenterX): float、既定値 0、アニメーション可。画像中心を原点とするピボットの X オフセット(ピクセル)。
  • 中心 Y (CenterY): float、既定値 0、アニメーション可。画像中心を原点とするピボットの Y オフセット(ピクセル)。

拡張機能独自の変換​

拡張機能は DisplacementMapTransform を継承し、入れ子の Resource の ApplyTo(...) を実装して変換を追加できます。公開された FilterEffectContext に描画ステージを記録します。このメソッドには変位マップのブラシ、範囲外のサンプリング方式、チャンネル、符号付きの指定、エフェクトコンテキストが渡されます。組み込みの変換で使用するサンプリングヘルパーは公開APIに含まれません。

使い方​

ノイズパターン・グラデーション・動画クリップなどをマップとして使います。マップ側の トランスフォーム をアニメーションすると流れるような歪みになります。ディスプレイスメントマップを表示 でデバッグ表示できます。

ソース​

src/Beutl.Engine/Graphics/FilterEffects/DisplacementMapEffect.cs