Guide pratique pour assymétrie d’un objet

L’asymétrie (ou le cisaillement) d’un objet signifie de déformer un objet par un angle spécifié à partir de l’axe X, de l’axe Y ou des deux. Par exemple, quand vous assymétrie d’un carré, il devient un paralléliogramme.

La méthode Matrix3x2F::Skew prend 3 paramètres :

• angleX : angle d’inclinaison de l’axe X, qui est mesuré en degrés dans le sens inverse des aiguilles d’une montre à partir de l’axe y.
• angleY : angle d’inclinaison de l’axe y, qui est mesuré en degrés dans le sens des aiguilles d’une montre à partir de l’axe des X.
• centerPoint : point sur lequel l’asymétrie est effectuée.

Pour prédire l’effet d’une transformation d’asymétrie, considérez qu’angleX est l’angle d’inclinaison mesuré en degrés dans le sens inverse des aiguilles d’une montre à partir de l’axe y. Par exemple, si angleX est défini sur 30, l’objet s’incline de 30 degrés dans le sens inverse des aiguilles d’une montre le long de l’axe Y autour du point central. L’illustration suivante montre un carré incliné horizontalement de 30 degrés autour du coin supérieur gauche du carré.

De même, angleY est un angle d’inclinaison mesuré en degrés dans le sens des aiguilles d’une montre à partir de l’axe X. Par exemple, si angleY est défini sur 30, l’objet s’incline de 30 degrés dans le sens des aiguilles d’une montre le long de l’axe X autour du point central. L’illustration suivante montre un carré incliné verticalement de 30 degrés autour du coin supérieur gauche du carré.

Si vous définissez angleX et angleY sur 30 degrés, et le point central sur le coin supérieur gauche du carré, vous verrez le carré asymétrique suivant (plan plein). Notez que le carré asymétrique est incliné de 30 degrés dans le sens inverse des aiguilles d’une montre à partir de l’axe Y et de 30 degrés dans le sens horaire de l’axe X.

L’exemple de code suivant effectue une asymétrie horizontale du carré de 45 degrés autour de l’angle supérieur gauche du carré.

    // Create a rectangle.
    D2D1_RECT_F rectangle = D2D1::Rect(126.0f, 301.5f, 186.0f, 361.5f);

    // Draw the outline of the rectangle.
    m_pRenderTarget->DrawRectangle(
        rectangle,
        m_pOriginalShapeBrush,
        1.0f,
        m_pStrokeStyleDash
        );

    // Apply the skew transform to the render target.
    m_pRenderTarget->SetTransform(
        D2D1::Matrix3x2F::Skew(
            45.0f,
            0.0f,
            D2D1::Point2F(126.0f, 301.5f))
        );

    // Paint the interior of the rectangle.
    m_pRenderTarget->FillRectangle(rectangle, m_pFillBrush);

    // Draw the outline of the rectangle.
    m_pRenderTarget->DrawRectangle(rectangle, m_pTransformedShapeBrush);

L’illustration suivante montre l’effet de l’application de la transformation d’asymétrie au carré, où le carré d’origine est un contour en pointillés et l’objet asymétrique (paralléliogramme) est un contour plein. Notez que l’angle d’inclinaison est de 45 degrés dans le sens inverse des aiguilles d’une montre à partir de l’axe y.

Rubriques connexes

Vue d’ensemble des transformations Direct2D

Référence Direct2D