Altseed

マテリアル2D (Material2D)

概要

ポストエフェクトやスプライトの描画をユーザーが実装するために使用するマテリアルクラスです。 シェーダー2Dを元に生成され、シェーダー2Dに記述されたシェーダーを実行し、画像を加工します。

マテリアル2Dクラスはシェーダーに記述された変数に値を設定する機能を持ちます。 変数を設定して、ポストエフェクトクラスのDrawOnTexture2DWithMaterial にマテリアル2Dのインスタンスと出力先を渡して実行すると引数に設定された出力先に画像を描画します。

基本的には、PostEffectクラスを継承した時の OnDraw w内で使用します。

主なメソッド

Shaderの変数の型に対応したGetSetが存在します。

主なプロパティ

なし

主なイベント

なし

使用方法

マテリアル2D経由で変数に値を設定し、モザイクを一部領域にかけるサンプルです。

C++

#include <Altseed.h>

// 一部の領域にモザイクをかけるポストエフェクトのサンプル。

/**
    @brief  DirectX向けシェーダー(HLSLで記述)
*/
static const char* shader2d_dx_ps = R"(
Texture2D g_texture;
SamplerState g_sampler;

float2 g_windowSize;
float4 g_area;

struct PS_Input
{
    float4 SV_Position  : SV_POSITION;
    float4 Position     : POSITION;
    float2 UV           : UV;
    float4 Color        : COLOR;
};

float2 GetPixelPosition(float2 uv)
{
    return g_windowSize * uv;
}

float4 main( const PS_Input Input ) : SV_Target
{
    float2 pixelPos = GetPixelPosition(Input.UV);

    if(
        g_area.x < pixelPos.x &&
        g_area.x + g_area.z > pixelPos.x &&
        g_area.y < pixelPos.y &&
        g_area.y + g_area.w > pixelPos.y)
    {
        float2 uv = Input.UV;
        uv.x = floor(uv.x * g_windowSize.x / 5.0) * 5.0 / g_windowSize.x;
        uv.y = floor(uv.y * g_windowSize.y / 5.0) * 5.0 / g_windowSize.y;
        return g_texture.Sample(g_sampler, uv);
    }
    else
    {
        return g_texture.Sample(g_sampler, Input.UV);
    }
}

)";

/**
    @brief  OpenGL向けシェーダー(GLSLで記述)
*/
static const char* shader2d_gl_ps = R"(
uniform sampler2D g_texture;

uniform vec2 g_windowSize;
uniform vec4 g_area;

in vec4 inPosition;
in vec2 inUV;
in vec4 inColor;

out vec4 outOutput;

vec2 GetPixelPosition(vec2 uv)
{
    uv.y = 1.0 - uv.y;
    return g_windowSize * uv;
}

void main()
{
    vec2 pixelPos = GetPixelPosition(inUV);

    if(
        g_area.x < pixelPos.x &&
        g_area.x + g_area.z > pixelPos.x &&
        g_area.y < pixelPos.y &&
        g_area.y + g_area.w > pixelPos.y)
    {
        vec2 uv = inUV;
        uv.x = floor(uv.x * g_windowSize.x / 5.0) * 5.0 / g_windowSize.x;
        uv.y = floor(uv.y * g_windowSize.y / 5.0) * 5.0 / g_windowSize.y;
        outOutput = texture(g_texture, uv);
    }
    else
    {
        outOutput = texture(g_texture, inUV);
    }
}

)";

/**
    @brief  一部の領域にモザイクをかけるポストエフェクト
*/
class MosaicPostEffect : public asd::PostEffect
{
public:
    std::shared_ptr<asd::Shader2D>      shader;
    std::shared_ptr<asd::Material2D>    material2d;

public:
    MosaicPostEffect()
    {
        // シェーダーをHLSL/GLSLから生成する。
        if (asd::Engine::GetGraphics()->GetGraphicsDeviceType() == asd::GraphicsDeviceType::DirectX11)
        {
            shader = asd::Engine::GetGraphics()->CreateShader2D(
                asd::ToAString(shader2d_dx_ps).c_str()
                );
        }
        else if (asd::Engine::GetGraphics()->GetGraphicsDeviceType() == asd::GraphicsDeviceType::OpenGL)
        {
            shader = asd::Engine::GetGraphics()->CreateShader2D(
                asd::ToAString(shader2d_gl_ps).c_str()
                );
        }

        material2d = asd::Engine::GetGraphics()->CreateMaterial2D(shader);
    }

protected:
    void OnDraw(std::shared_ptr<asd::RenderTexture2D> dst, std::shared_ptr<asd::RenderTexture2D> src) override
    {
        // マテリアルを経由してシェーダー内のg_texture変数に画面の画像(src)を入力する。
        material2d->SetTexture2D(asd::ToAString("g_texture").c_str(), src);

        // マテリアルを経由してシェーダー内のg_area変数にポストエフェクトを適用する範囲を入力する。
        material2d->SetVector2DF(asd::ToAString("g_windowSize").c_str(), asd::Vector2DF(asd::Engine::GetWindowSize().X, asd::Engine::GetWindowSize().Y));

        // マテリアルを経由してシェーダー内のg_area変数にポストエフェクトを適用する範囲を入力する。
        material2d->SetVector4DF(asd::ToAString("g_area").c_str(), asd::Vector4DF(50, 50, 200, 200));

        // 出力画像(dst)に指定したマテリアルで描画する。
        DrawOnTexture2DWithMaterial(dst, material2d);
    }
};

int main()
{
    // Altseedを初期化する
    asd::Engine::Initialize(asd::ToAString("CustomPostEffect_Mosaic").c_str(), 640, 480, asd::EngineOption());

    // シーン、レイヤー、画像を表示するオブジェクトを生成する。
    auto scene = std::make_shared<asd::Scene>();
    auto layer = std::make_shared<asd::Layer2D>();
    auto obj = std::make_shared<asd::TextureObject2D>();
    obj->SetTexture(asd::Engine::GetGraphics()->CreateTexture2D(asd::ToAString("Data/Texture/Picture1.png").c_str()));

    // シーンを変更し、そのシーンにレイヤーを追加し、そのレイヤーにオブジェクトを追加する。
    asd::Engine::ChangeScene(scene);
    scene->AddLayer(layer);
    layer->AddObject(obj);

    // レイヤーにポストエフェクトを適用する。
    layer->AddPostEffect(std::make_shared<MosaicPostEffect>());

    while (asd::Engine::DoEvents())
    {
        asd::Engine::Update();
    }

    asd::Engine::Terminate();
}

C#

/// <summary>
/// 一部の領域にモザイクをかけるポストエフェクト
/// </summary>
class CustomPostEffect_MosaicPostEffect : asd.PostEffect
{
    /// <summary>
    /// DirectX向けシェーダー(HLSLで記述)
    /// </summary>
    static string shader2d_dx_ps = @"
Texture2D g_texture;
SamplerState g_sampler;

float2 g_windowSize;
float4 g_area;

struct PS_Input
{
    float4 SV_Position  : SV_POSITION;
    float4 Position     : POSITION;
    float2 UV           : UV;
    float4 Color        : COLOR;
};

float2 GetPixelPosition(float2 uv)
{
    return g_windowSize * uv;
}

float4 main( const PS_Input Input ) : SV_Target
{
    float2 pixelPos = GetPixelPosition(Input.UV);

    if(
        g_area.x < pixelPos.x &&
        g_area.x + g_area.z > pixelPos.x &&
        g_area.y < pixelPos.y &&
        g_area.y + g_area.w > pixelPos.y)
    {
        float2 uv = Input.UV;
        uv.x = floor(uv.x * g_windowSize.x / 5.0) * 5.0 / g_windowSize.x;
        uv.y = floor(uv.y * g_windowSize.y / 5.0) * 5.0 / g_windowSize.y;
        return g_texture.Sample(g_sampler, uv);
    }
    else
    {
        return g_texture.Sample(g_sampler, Input.UV);
    }
}

";
    /// <summary>
    /// OpenGL向けシェーダー(GLSLで記述)
    /// </summary>
    static string shader2d_gl_ps = @"
uniform sampler2D g_texture;

uniform vec2 g_windowSize;
uniform vec4 g_area;

in vec4 inPosition;
in vec2 inUV;
in vec4 inColor;

out vec4 outOutput;

vec2 GetPixelPosition(vec2 uv)
{
    uv.y = 1.0 - uv.y;
    return g_windowSize * uv;
}

void main()
{
    vec2 pixelPos = GetPixelPosition(inUV);

    if(
        g_area.x < pixelPos.x &&
        g_area.x + g_area.z > pixelPos.x &&
        g_area.y < pixelPos.y &&
        g_area.y + g_area.w > pixelPos.y)
    {
        vec2 uv = inUV;
        uv.x = floor(uv.x * g_windowSize.x / 5.0) * 5.0 / g_windowSize.x;
        uv.y = floor(uv.y * g_windowSize.y / 5.0) * 5.0 / g_windowSize.y;
        outOutput = texture(g_texture, uv);
    }
    else
    {
        outOutput = texture(g_texture, inUV);
    }
}

";

    asd.Shader2D shader;
    asd.Material2D material2d;

    public CustomPostEffect_MosaicPostEffect()
    {
        // シェーダーをHLSL/GLSLから生成する。
        if(asd.Engine.Graphics.GraphicsDeviceType == asd.GraphicsDeviceType.DirectX11)
        {
            shader = asd.Engine.Graphics.CreateShader2D(
                shader2d_dx_ps
                );
        }
        else if(asd.Engine.Graphics.GraphicsDeviceType == asd.GraphicsDeviceType.OpenGL)
        {
            shader = asd.Engine.Graphics.CreateShader2D(
                shader2d_gl_ps
                );
        }

        // シェーダーからマテリアルを生成する。
        material2d = asd.Engine.Graphics.CreateMaterial2D(shader);
    }

    protected override void OnDraw(asd.RenderTexture2D dst, asd.RenderTexture2D src)
    {
        // マテリアルを経由してシェーダー内のg_texture変数に画面の画像(src)を入力する。
        material2d.SetTexture2D("g_texture", src);

        // マテリアルを経由してシェーダー内のg_area変数にポストエフェクトを適用する範囲を入力する。
        material2d.SetVector2DF("g_windowSize", new asd.Vector2DF(asd.Engine.WindowSize.X, asd.Engine.WindowSize.Y));

        // マテリアルを経由してシェーダー内のg_area変数にポストエフェクトを適用する範囲を入力する。
        material2d.SetVector4DF("g_area", new asd.Vector4DF(50, 50, 200, 200));

        // 出力画像(dst)に指定したマテリアルで描画する。
        DrawOnTexture2DWithMaterial(dst, material2d);
    }
}

/// <summary>
/// 一部の領域にモザイクをかけるポストエフェクトのサンプル。
/// </summary>
class CustomPostEffect_Mosaic
{
    public string Description
    {
        get { return "一部の領域にモザイクをかけるポストエフェクトのサンプルです。"; }
    }

    public string Title
    {
        get { return "モザイク ポストエフェクト"; }
    }

    public string ClassName
    {
        get { return "CustomPostEffect_Mosaic"; }
    }

    [System.STAThread]
    static void Main(string[] args)
    {
        // Altseedを初期化する。
        asd.Engine.Initialize("CustomPostEffect_Mosaic", 640, 480, new asd.EngineOption());

        // シーン、レイヤー、画像を表示するオブジェクトを生成する。
        var scene = new asd.Scene();
        var layer = new asd.Layer2D();
        var obj = new asd.TextureObject2D();
        obj.Texture = asd.Engine.Graphics.CreateTexture2D("Data/Texture/Picture1.png");

        // シーンを変更し、そのシーンにレイヤーを追加し、そのレイヤーにオブジェクトを追加する。
        asd.Engine.ChangeScene(scene);
        scene.AddLayer(layer);
        layer.AddObject(obj);

        // レイヤーにポストエフェクトを適用する。
        layer.AddPostEffect(new CustomPostEffect_MosaicPostEffect());

        while (asd.Engine.DoEvents())
        {
            asd.Engine.Update();
        }

        asd.Engine.Terminate();
    }
}

Java

/**
 * 一部の領域にモザイクをかけるポストエフェクトのサンプル。
*/
class CustomPostEffect_Mosaic 
{
    public java.lang.String getDescription() {
        return "一部の領域にモザイクをかけるポストエフェクトのサンプルです。";
    }
    public java.lang.String getTitle() {
        return "モザイク ポストエフェクト";
    }
    public java.lang.String getClassName() {
        return "CustomPostEffect_Mosaic";
    }
    public static void main(String args[])
    {
        // Altseedを初期化する。
        asd.Engine.Initialize("CustomPostEffect_Mosaic", 640, 480, new asd.EngineOption());

        // シーン、レイヤー、画像を表示するオブジェクトを生成する。
        asd.Scene scene = new asd.Scene();
        asd.Layer2D layer = new asd.Layer2D();
        asd.TextureObject2D obj = new asd.TextureObject2D();
        obj.setTexture(asd.Engine.getGraphics().CreateTexture2D("Data/Texture/Picture1.png"));

        // シーンを変更し、そのシーンにレイヤーを追加し、そのレイヤーにオブジェクトを追加する。
        asd.Engine.ChangeScene(scene);
        scene.AddLayer(layer);
        layer.AddObject(obj);

        // レイヤーにポストエフェクトを適用する。
        layer.AddPostEffect(new CustomPostEffect_MosaicPostEffect());

        while(asd.Engine.DoEvents())
        {
            asd.Engine.Update();
        }


        asd.Engine.Terminate();
    }
}