Compartir a través de

Tutorial: Agregar objetos D2D a un proyecto de MFC

  • Artículo

En este tutorial se explica cómo agregar un objeto básico de Direct2D (D2D) a un proyecto de Visual C++, Biblioteca de clases de Microsoft Foundation (MFC) y, a continuación, compilar el proyecto en una aplicación que imprime "Hello, World!" en un fondo degradado.

En el tutorial se muestra cómo realizar estas tareas:

  • Cree una aplicación MFC.

  • Cree un pincel de color sólido y un pincel de degradado lineal.

  • Modifique el pincel de degradado para que cambie correctamente cuando se cambie el tamaño de la ventana.

  • Implemente un controlador de dibujo D2D.

  • Verifique los resultados.

Nota:

Es posible que tu equipo muestre nombres o ubicaciones diferentes para algunos de los elementos de la interfaz de usuario de Visual Studio en las siguientes instrucciones. La edición de Visual Studio que se tenga y la configuración que se utilice determinan estos elementos. Para obtener más información, vea Personalizar el IDE.

Requisitos previos

Para completar este tutorial, debe tener Visual Studio instalado con la carga de trabajo Desarrollo de escritorio con C++ y el componente opcionalVisual C++ MFC para x86 y x64.

Para crear una aplicación MFC

  1. Use el Asistente para aplicaciones MFC para crear una aplicación MFC. Consulte Tutorial: Uso de los nuevos controles de shell de MFC para obtener instrucciones sobre cómo abrir el asistente para su versión de Visual Studio.

  2. En el cuadro nombre, escriba MFCD2DWalkthrough. Elija Aceptar.

  3. En la Asistente para aplicaciones MFC, elija Finalizar sin cambiar ninguna configuración.

Para crear un pincel de color sólido y un pincel de degradado lineal

  1. En Explorador de soluciones, en el proyecto MFCD2DWalkthrough, en la carpeta Archivos de encabezado abra MFCD2DWalkthroughView.h. Agregue este código a la clase CMFCD2DWalkthroughView para crear tres variables de datos:

    CD2DTextFormat* m_pTextFormat;
CD2DSolidColorBrush* m_pBlackBrush;
CD2DLinearGradientBrush* m_pLinearGradientBrush;

    Guarde el archivo y ciérrelo.

  2. En la carpeta Archivos de origen, abra MFCD2DWalkthroughView.cpp. En el constructor de la claseCMFCD2DWalkthroughView, agregue este código:

    // Enable D2D support for this window:
EnableD2DSupport();

// Initialize D2D resources:
m_pBlackBrush = new CD2DSolidColorBrush(
    GetRenderTarget(),
    D2D1::ColorF(D2D1::ColorF::Black));

m_pTextFormat = new CD2DTextFormat(
    GetRenderTarget(),
    _T("Verdana"),
    50);

m_pTextFormat->Get()->SetTextAlignment(
    DWRITE_TEXT_ALIGNMENT_CENTER);

m_pTextFormat->Get()->SetParagraphAlignment(
    DWRITE_PARAGRAPH_ALIGNMENT_CENTER);

D2D1_GRADIENT_STOP gradientStops[2];

gradientStops[0].color =
    D2D1::ColorF(D2D1::ColorF::White);

gradientStops[0].position = 0.f;
gradientStops[1].color =
    D2D1::ColorF(D2D1::ColorF::Indigo);

gradientStops[1].position = 1.f;

m_pLinearGradientBrush = new CD2DLinearGradientBrush(
    GetRenderTarget(),
    gradientStops,
    ARRAYSIZE(gradientStops),
    D2D1::LinearGradientBrushProperties(
        D2D1::Point2F(0,0),
        D2D1::Point2F(0,0)));

    Guarde el archivo y ciérrelo.

Para modificar el pincel de degradado para que cambie correctamente cuando se cambie el tamaño de la ventana

  1. En el menú Proyecto, elija Asistente para clases.

  2. En el Asistente para clases MFC, en Nombre de clase, seleccione CMFCD2DWalkthroughView.

  3. En la pestaña Mensajes, en el cuadro Mensajes, seleccione WM_SIZE y, a continuación, elijaAgregar controlador. Esta acción agrega el OnSize controlador de mensajes a la claseCMFCD2DWalkthroughView.

  4. En el cuadro Controladores existentes, seleccione OnSize. Elija Editar código para mostrar el método CMFCD2DWalkthroughView::OnSize. Al final del método, agregue el código siguiente.

    m_pLinearGradientBrush->SetEndPoint(CPoint(cx, cy));

    Guarde el archivo y ciérrelo.

Para implementar un controlador de dibujo D2D

  1. En el menú Proyecto, elija Asistente para clases.

  2. En el Asistente para clases MFC, en Nombre de clase, seleccione CMFCD2DWalkthroughView.

  3. En la pestaña Mensajes, elija Agregar mensaje personalizado.

  4. En el cuadro de diálogo Agregar mensaje personalizado, en el cuadro de diálogo mensaje personalizado de Windows, escriba AFX_WM_DRAW2D. En el cuadro Nombre del controlador de mensajes, escriba OnDraw2D. Seleccione la opción Mensaje registrado y, a continuación, elija Aceptar. Esta acción agrega un controlador de mensajes para el mensaje AFX_WM_DRAW2D a la claseCMFCD2DWalkthroughView.

  5. En el cuadro Controladores existentes, seleccione OnDraw2D. Elija Editar código para mostrar el método CMFCD2DWalkthroughView::OnDraw2D. Use este código para el métodoCMFCD2DWalkthroughView::OnDrawD2D:

    afx_msg LRESULT CMFCD2DWalkthroughView::OnDraw2D(
    WPARAM wParam,
    LPARAM lParam)
{
    CHwndRenderTarget* pRenderTarget = (CHwndRenderTarget*)lParam;
    ASSERT_VALID(pRenderTarget);

    CRect rect;
    GetClientRect(rect);

    pRenderTarget->FillRectangle(rect, m_pLinearGradientBrush);

    pRenderTarget->DrawText(
        _T("Hello, World!"),
        rect,
        m_pBlackBrush,
        m_pTextFormat);

    return TRUE;
}

    Guarde el archivo y ciérrelo.

Para comprobar los resultados

Genere y ejecute la aplicación. Debe tener un rectángulo de degradado que cambie al cambiar el tamaño de la ventana. "¡Hola mundo!" debe mostrarse en el centro del rectángulo.

Consulte también

Tutoriales