Comment : créer du texte avec contour

Dans la plupart des cas, lorsque vous ajoutez l'ornementation aux chaînes de texte dans votre application Windows Presentation Foundation (WPF), vous utilisez le texte en terme de collection de caractères discrets, ou glyphes. Par exemple, vous pourriez créer un pinceau à dégradé linéaire et l'appliquer à la propriété Foreground d'un objet TextBox. Lorsque vous affichez ou modifiez la zone de texte, le pinceau à dégradé linéaire est appliqué automatiquement au jeu actuel de caractères dans la chaîne de texte.

Exemple d'un pinceau à dégradé linéaire appliqué à une zone de texte

Texte affiché avec un pinceau de dégradé linéaire

Cependant, vous pouvez également convertir le texte en objets Geometry, ce qui vous permet de créer d'autres types de texte visuellement enrichi. Par exemple, vous pouvez créer un objet Geometry basé sur le contour d'une chaîne de texte.

Exemple d'un pinceau à dégradé linéaire appliqué à la géométrie de plan de texte

Contour du texte utilisant un pinceau de dégradé linéaire

Lorsque le texte est converti en un objet Geometry, ce n'est plus une collection de caractères — vous ne pouvez pas modifier les caractères dans la chaîne de texte. Vous pouvez néanmoins modifier l'apparence du texte converti en changeant ses propriétés de trait et de remplissage. Le trait fait référence au plan du texte converti; le remplissage fait référence à la zone à l'intérieur du plan du texte converti.

Les exemples suivants illustrent plusieurs façons de créer des effets visuels en modifiant le trait et le remplissage du texte converti.

Exemple de définition du trait et du remplissage de différentes couleurs

Texte avec différentes couleurs de trait et de remplissage

Exemple de pinceau image appliqué au trait

Texte avec pinceau image appliqué au trait

Il est également possible de modifier le rectangle de zone englobante, ou surbrillance, du texte converti. L'exemple suivant illustre une manière de créer des effets visuels en modifiant le trait et la surbrillance du texte converti.

Exemple de pinceau image appliqué au trait et à la surbrillance

Texte avec pinceau image appliqué au trait

Exemple

La clé pour convertir du texte en un objet Geometry est d'utiliser l'objet FormattedText. Une fois que vous avez créé cet objet, vous pouvez utiliser les méthodes BuildGeometry et BuildHighlightGeometry pour convertir le texte en objets Geometry. La première méthode retourne la géométrie du texte mis en forme; la deuxième méthode retourne la géométrie de la zone englobante du texte mis en forme. Le code suivant montre comment créer un objet FormattedText et récupérer les géométries du texte mis en forme et son cadre englobant.

        ''' <summary>
        ''' Create the outline geometry based on the formatted text.
        ''' </summary>
        Public Sub CreateText()
            Dim fontStyle As FontStyle = FontStyles.Normal
            Dim fontWeight As FontWeight = FontWeights.Medium

            If Bold = True Then
                fontWeight = FontWeights.Bold
            End If
            If Italic = True Then
                fontStyle = FontStyles.Italic
            End If

            ' Create the formatted text based on the properties set.
            Dim formattedText As New FormattedText(Text, CultureInfo.GetCultureInfo("en-us"), FlowDirection.LeftToRight, New Typeface(Font, fontStyle, fontWeight, FontStretches.Normal), FontSize, Brushes.Black) ' This brush does not matter since we use the geometry of the text.

            ' Build the geometry object that represents the text.
            _textGeometry = formattedText.BuildGeometry(New Point(0, 0))

            ' Build the geometry object that represents the text hightlight.
            If Highlight = True Then
                _textHighLightGeometry = formattedText.BuildHighlightGeometry(New Point(0, 0))
            End If
        End Sub
/// <summary>
/// Create the outline geometry based on the formatted text.
/// </summary>
public void CreateText()
{
    System.Windows.FontStyle fontStyle = FontStyles.Normal;
    FontWeight fontWeight = FontWeights.Medium;

    if (Bold == true) fontWeight = FontWeights.Bold;
    if (Italic == true) fontStyle = FontStyles.Italic;

    // Create the formatted text based on the properties set.
    FormattedText formattedText = new FormattedText(
        Text,
        CultureInfo.GetCultureInfo("en-us"),
        FlowDirection.LeftToRight,
        new Typeface(
            Font,
            fontStyle,
            fontWeight,
            FontStretches.Normal),
        FontSize,
        System.Windows.Media.Brushes.Black // This brush does not matter since we use the geometry of the text. 
        );

    // Build the geometry object that represents the text.
    _textGeometry = formattedText.BuildGeometry(new System.Windows.Point(0, 0));

    // Build the geometry object that represents the text hightlight.
    if (Highlight == true)
    {
        _textHighLightGeometry = formattedText.BuildHighlightGeometry(new System.Windows.Point(0, 0));
    }
}

Pour afficher les objets Geometry récupérés, vous devez accéder au DrawingContext de l'objet qui affiche le texte converti. Dans ces exemples de code, cela est fait en créant un objet de contrôle personnalisé dérivé d'une classe qui prend en charge le rendu défini par l'utilisateur.

Pour afficher des objets Geometry dans le contrôle personnalisé, fournissez une substitution pour la méthode OnRender. Votre méthode de substitution doit utiliser la méthode DrawGeometry pour dessiner les objets Geometry.

        ''' <summary>
        ''' OnRender override draws the geometry of the text and optional highlight.
        ''' </summary>
        ''' <param name="drawingContext">Drawing context of the OutlineText control.</param>
        Protected Overrides Sub OnRender(ByVal drawingContext As DrawingContext)
            ' Draw the outline based on the properties that are set.
            drawingContext.DrawGeometry(Fill, New Pen(Stroke, StrokeThickness), _textGeometry)

            ' Draw the text highlight based on the properties that are set.
            If Highlight = True Then
                drawingContext.DrawGeometry(Nothing, New Pen(Stroke, StrokeThickness), _textHighLightGeometry)
            End If
        End Sub
/// <summary>
/// OnRender override draws the geometry of the text and optional highlight.
/// </summary>
/// <param name="drawingContext">Drawing context of the OutlineText control.</param>
protected override void OnRender(DrawingContext drawingContext)
{
    // Draw the outline based on the properties that are set.
    drawingContext.DrawGeometry(Fill, new System.Windows.Media.Pen(Stroke, StrokeThickness), _textGeometry);

    // Draw the text highlight based on the properties that are set.
    if (Highlight == true)
    {
        drawingContext.DrawGeometry(null, new System.Windows.Media.Pen(Stroke, StrokeThickness), _textHighLightGeometry);
    }
}

Voir aussi

Concepts

Dessin du texte mis en forme