Auto2D TEXT

Hello, XAML!
Hello, DirectX!

自動生成した Direct2D で BackSurface に直接描画します。

前田稔(Maeda Minoru)の超初心者のプログラム入門

プロジェクトの作成

  1. Windows8 のスタート画面から Visual Studio を起動します。
    [FILE] [New Project] から [Visual C++] を選択して、Direct2Dアプリケーション(XAML)を選びます。

  2. 後は規定値で [OK] をクリックすると、プロジェクト(Direct2DApp1)が構築されます。
    Direct2DApp1 は、Direct2D のプロジェクト名の規定値です。
    そのまま右三角アイコンでコンパイル&実行します。
    ウインドウに次の文字が表示されます。
        Hello, XAML!
        Hello, DirectX!
        
  3. DirectXPage.xaml をダブルクリックすると、デザイン画面とソースコードが表示されます。
    "Hello, XAML!" は DirectXPage.xaml の TextBlock で定義されています。
    TextBlock を次のように修正してみて下さい。
    "Direct2DApp" が画面左上に赤い文字で大きく表示されます。
        <TextBlock x:Name="SimpleTextBlock" HorizontalAlignment="Left" 
        FontSize="64" Height="72" Text="Direct2DApp" Margin="46,52,0,0" 
        Foreground="#FFF80B0B" RenderTransformOrigin="0.247,-0.216" 
        VerticalAlignment="Top" Grid.ColumnSpan="2"/>
        
  4. SimpleTextRenderer.cpp ダブルクリックするとソースコードが表示されます。
    "Hello, DirectX!" は SimpleTextRenderer.cpp で定義されています。
        Platform::String^ text = "Hello, DirectX!";
        
  5. "Hello, DirectX!" を表示する Render() メソッドです。
    ここで表示しているのは m_textLayout(offscreen surface) です。
    つまり事前に m_textLayout に "Hello, DirectX!" のイメージを格納しておきます。
    この方法はレンダリング速度の上からは有利なのですが、プログラムは複雑になります。
    void SimpleTextRenderer::Render()
    {
        m_d2dContext->BeginDraw();
    
        m_d2dContext->Clear(ColorF(BackgroundColors[m_backgroundColorIndex]));
        Matrix3x2F translation = Matrix3x2F::Translation(
            m_windowBounds.Width / 2.0f - m_textMetrics.widthIncludingTrailingWhitespace / 2.0f 
                + m_textPosition.X,
            m_windowBounds.Height / 2.0f - m_textMetrics.height / 2.0f + m_textPosition.Y
            );
    
        m_d2dContext->SetTransform(translation * m_orientationTransform2D);
        m_d2dContext->DrawTextLayout(
            Point2F(0.0f, 0.0f),
            m_textLayout.Get(),
            m_blackBrush.Get(),
            D2D1_DRAW_TEXT_OPTIONS_NO_SNAP
            );
    
        HRESULT hr = m_d2dContext->EndDraw();
        if (hr != D2DERR_RECREATE_TARGET)
        {
            DX::ThrowIfFailed(hr);
        }
    
        m_renderNeeded = false;
    }
    
  6. SimpleTextRenderer.cpp の Render() メソッドを次のように修正して下さい。
    こちらは DrawText() で BackSurface(FrontSurface?)に直接描画します。
    m_textFormat, m_whiteBrush, m_renderNeeded などの領域は SimpleTextRenderer.h で定義されています。
    void SimpleTextRenderer::Render()
    {
        m_d2dContext->BeginDraw();
        m_d2dContext->Clear(D2D1::ColorF(D2D1::ColorF::CornflowerBlue));
    
        Platform::String^ text = "Text Message";
    
        m_d2dContext->DrawText(
            text->Data(),
            text->Length(),
            m_textFormat.Get(),
            D2D1::RectF(400, 300, 800.0f, 400.0f ),
            m_whiteBrush.Get() );
    
        HRESULT hr = m_d2dContext->EndDraw();
        if (hr != D2DERR_RECREATE_TARGET)
        {
            DX::ThrowIfFailed(hr);
        }
    
        m_renderNeeded = false;
    }
    
  7. 不要なコードを削除して、プログラムを整理して下さい。
    Render() 関数のソースコードは少し短くなるだけですが、面倒な事前処理が不要になりプログラムが非常にすっきりするはずです。
    尚直接描画の DrawText()では m_blackBrush に代えて m_whiteBrush を使っているので念のため。
  8. TEXT 表示に代えて、赤色の矩形を描画してみましょう。
    こちらは TEXT 表示よりも簡単です。 \(^o^)/
    矩形を赤で塗りつぶすために m_redBrush を使っています。
    void SimpleTextRenderer::Render()
    {   m_d2dContext->BeginDraw();
        m_d2dContext->Clear(D2D1::ColorF(D2D1::ColorF::CornflowerBlue));
    
        D2D1_RECT_F rectangle1 = D2D1::RectF(200.0f, 200.0f, 600.0f, 400.0f);
        m_d2dContext->FillRectangle(&rectangle1, m_redBrush.Get());
    
        HRESULT hr = m_d2dContext->EndDraw();
        if (hr != D2DERR_RECREATE_TARGET)
        {   DX::ThrowIfFailed(hr);  }
        m_renderNeeded = false;
    }
    
  9. m_redBrush の定義と取得です。
        Microsoft::WRL::ComPtr<ID2D1SolidColorBrush> m_redBrush;
    
        DX::ThrowIfFailed(
            m_d2dContext->CreateSolidColorBrush(
                ColorF(ColorF::Red), &m_redBrush)
        );
    

超初心者のプログラム入門(DirectX Store)