Ajouter le texte à une image

Solution API .NET pour écrire du texte sur des images

 

Aspose.Font for .NET Aspose.Font for .NET

  Nuget   Pricing Buy
 

Aspose.Font for .NET est une solution complète pour les développeurs travaillant avec des polices dans leurs applications .NET. Il simplifie les tâches telles que le chargement, l'édition, la conversion et l'utilisation de polices à différentes fins. L'un de ces objectifs est le rendu du texte. La solution fournit un moyen personnalisé de restituer le texte sur une image à l'aide d'une police particulière, en prenant en compte le crénage et en offrant un contrôle sur divers aspects tels que la couleur d'arrière-plan, la couleur du texte et la taille du texte.

Il existe de nombreuses applications où l’ajout de texte aux images est une fonctionnalité utile, répondant à divers objectifs. Voici quelques catégories :

  • Les applications de retouche photo, comme Canva, Adobe Express et PicLab, vous permettent de retoucher des photos de différentes manières, et l’ajout de texte est une fonctionnalité essentielle.
  • Applications de réseaux sociaux - comme Instagram et Facebook disposent d’outils d’édition de texte intégrés pour les photos. Cela vous permet d’ajouter des légendes, des citations ou d’autres messages directement dans l’application avant de les partager.
  • Si vous créez des designs plus complexes comme des dépliants, des affiches ou des présentations, les applications de conception graphique comme Photoshop ou GIMP offrent des fonctionnalités avancées d’édition de texte. Ceux-ci permettent un contrôle précis sur le placement, le formatage et les effets du texte.
  • La culture des mèmes se nourrit de l’humour texte sur image. Les applications de création de mèmes comme Imgflip ou Meme Generator fournissent des modèles et des outils d’édition conçus pour créer des images amusantes ou sous-titrées.
  • Créer des visuels accrocheurs pour les campagnes marketing implique souvent l’ajout de texte aux images. Les outils de marketing et de publicité comme Spark Post ou Stencil vous permettent de concevoir des publications, des dépliants ou des publicités sur les réseaux sociaux qui intègrent efficacement du texte.
  • Applications éducatives : utilisez du texte sur des images pour créer des infographies, des guides d’étude ou d’autres supports d’apprentissage visuels.

Il existe de nombreuses raisons d’ajouter du texte aux images, comme ajouter du contexte à une image, attirer l’attention de l’utilisateur, créer un message, etc. Avec Aspose.Font, cette fonctionnalité peut être facilement implémentée dans vos applications basées sur du code C#.

Pour exécuter les exemples dont vous avez besoin :

  • Aspose.Font pour l'API .NET qui est une API de manipulation et de conversion de documents riche en fonctionnalités, puissante et facile à utiliser pour la plate-forme C#.

  • Ouvrez le gestionnaire de packages NuGet, recherchez Aspose.Font et installez. Vous pouvez également utiliser la commande suivante à partir de la console Package Manager.

Package Manager Console Command


    PM> Install-Package Aspose.Font

Étapes pour afficher du texte sur les images C# :

L’extrait de code fourni définit une fonction appelée CustomDrawText qui prend divers arguments pour restituer le texte sur un bitmap à l’aide d’une police spécifiée. Voici un aperçu des fonctionnalités :

  1. Récupérez les ID des glyphes pour représenter une forme de caractère spécifique dans la police.
  2. Définissez la résolution du bitmap de sortie.
  3. Remplissez l’arrière-plan du bitmap avec le pinceau fourni.
  4. Définissez l’anticrénelage pour un rendu du texte plus fluide et initialisez les variables pour le positionnement des glyphes.
  5. Rendre les textes en utilisant les glyphes spécifiés à l’aide du moteur de rendu.
  6. Enregistrez le bitmap final avec le texte dessiné dans le fichier spécifié.

Code C# pour écrire du texte sur des images

    public static void CustomDrawText(string text, IFont font, double fontSize, Brush backgroundBrush, Brush textBrush, string outFile, Bitmap bitmap, double kerningCoefficient = 1, double coordinateX = 0, double coordinateY = 0)
    {
        //Get glyph identifiers for every symbol in the text line
        GlyphId[] gids = new GlyphId[text.Length];

        for (int i = 0; i < text.Length; i++)
            gids[i] = font.Encoding.DecodeToGid(text[i]);

        // Set common drawing settings
        double dpi = 300;
        double resolutionCorrection = dpi / 72; // 72 is font's internal dpi

        // Prepare the output bitmap                
        Bitmap outBitmap = bitmap;

        outBitmap.SetResolution((float)dpi, (float)dpi);

        Graphics outGraphics = Graphics.FromImage(outBitmap);
        outGraphics.FillRectangle(backgroundBrush, 0, 0, outBitmap.Width, outBitmap.Height);
        outGraphics.SmoothingMode = SmoothingMode.HighQuality;

        //Declare coordinate variables and the previous gid
        GlyphId previousGid = null;
        double glyphXCoordinate = coordinateX;
        double glyphYCoordinate = coordinateY;

        glyphYCoordinate += fontSize * resolutionCorrection;

        //The loop paints every glyph in gids
        foreach (GlyphId gid in gids)
        {
            // if the font contains the gid
            if (gid != null)
            {
                Glyph glyph = font.GlyphAccessor.GetGlyphById(gid);
                if (glyph == null)
                    continue;

                // The path that accepts drawing instructions
                GraphicsPath path = new GraphicsPath();

                // Create the IGlyphOutlinePainter implementation
                GlyphOutlinePainter outlinePainter = new GlyphOutlinePainter(path);

                // Create the renderer
                Aspose.Font.Renderers.IGlyphRenderer renderer = new Aspose.Font.Renderers.GlyphOutlineRenderer(outlinePainter);

                // Get common glyph properties
                double kerning = 0;

                // Get the kerning value

                if (previousGid != null)
                {
                    kerning = (font.Metrics.GetKerningValue(previousGid, gid) / glyph.SourceResolution) * fontSize * resolutionCorrection;
                    kerning += FontWidthToImageWith(font.Metrics.GetGlyphWidth(previousGid), glyph.SourceResolution, fontSize);
                }

                // Glyph positioning - increase the glyph X coordinate according to the kerning distance
                glyphXCoordinate += kerning * kerningCoefficient;

                // Glyph placement matrix
                TransformationMatrix glyphMatrix = new TransformationMatrix(
                        new double[]
                                { fontSize * resolutionCorrection,
                            0,
                            0,
                        // negative because of the bitmap coordinate system begins from the top
                            - fontSize*resolutionCorrection,
                            glyphXCoordinate,
                            glyphYCoordinate
                                });

                // Render the current glyph
                renderer.RenderGlyph(font, gid, glyphMatrix);

                // Fill the path
                path.FillMode = FillMode.Winding;

                outGraphics.FillPath(textBrush, path);
            }

            //Set the current gid as previous to get the correct kerning for the next glyph
            previousGid = gid;
        }

        //Save the results
        outBitmap.Save(outFile);
    }



FAQ

1. Quel type d’images puis-je utiliser pour écrire du texte dessus ?

Les API fonctionnent mieux avec des images claires et haute résolution. Évitez les photos floues ou les images avec des arrière-plans complexes, car elles peuvent affecter la précision du placement du texte.

2. Puis-je personnaliser la police et le style du texte ?

Oui, Aspose.Font vous permet de spécifier des styles de police, des tailles et même des couleurs pour votre superposition de texte. Il offre une sortie personnalisée du texte, par exemple, lorsque vous souhaitez compresser, étirer, faire pivoter le texte à un moment donné. angle, ou autre chose.

3. Comment l’API gère-t-elle le placement du texte ?

Il propose des emplacements prédéfinis comme l’alignement au centre ou en bas, mais il offre également un moyen plus avancé (personnalisé) de convertir du texte en image à l’aide de l’une des méthodes RenderGlyph() de la Classe GlyphOutlineRenderer.