在现有图像文件上写文本？答案

【问题标题】：Write text on top of existing image file?在现有图像文件上写文本？
【发布时间】：2012-08-10 13:57:37
【问题描述】：

所以我在 WinForms .NET 3.5 中执行此操作...我现在正在使用 WPF .NET 4.0...但我不知道该怎么做。

这就是我在 Windows .NET 3.5 中所做的事情

using (Bitmap eventImg = new Bitmap("input.png"))
{
    Graphics eventGfx = Graphics.FromImage(eventImg);

    buildText(eventGfx, this.event1.Text);

    eventImg.Save("output.png", ImageFormat.Png);
    eventGfx.Dispose();
}

上面的代码在“input.png”中获取现有图像，从中创建一个新图像，从中写入文本，然后将新图像保存在“output.png”中。文本是使用以下函数编写的：

private void buildText(Graphics graphic, string text)
{
    if (text.Length == 0) { return; }

    FontStyle weight = FontStyle.Regular;

    switch (this.font_style)
    {
        case "regular":     weight = FontStyle.Regular;     break;
        case "bold":        weight = FontStyle.Bold;        break;
        case "italic":      weight = FontStyle.Italic;      break;
        case "underline":   weight = FontStyle.Underline;   break;
        case "strikeout":   weight = FontStyle.Strikeout;   break;
    }

    using (Font font = new Font(this.font_family, this.font_size, weight, GraphicsUnit.Pixel))
    {
        Rectangle rect = new Rectangle(this.left, this.top, this.width, this.height);
        Brush brush = new SolidBrush(Color.FromArgb(this.font_color));

        StringFormat format = new StringFormat();

        switch (this.align_x)
        {
            case "left":    format.Alignment = StringAlignment.Near;     break;
            case "right":   format.Alignment = StringAlignment.Far;      break;
            default:        format.Alignment = StringAlignment.Center;   break;
        }

        switch (this.align_y)
        {
            case "top":     format.LineAlignment = StringAlignment.Near;    break;
            case "bottom":  format.LineAlignment = StringAlignment.Far;     break;
            default:        format.LineAlignment = StringAlignment.Center;  break;
        }

        graphic.TextRenderingHint = TextRenderingHint.AntiAlias;
        graphic.DrawString(text, font, brush, rect, format);
    }
}

但是，由于 WPF .NET 4.0 中不存在 System.Drawing，因此我无法再使用这些功能。我将如何在 WPF .NET 4.0 中做我想做的事情？为了完成基于旧图像制作图像的第一步，我已经了解了以下代码：

using (var fileStream = new FileStream(@"z:\ouput.png", FileMode.Create))
{
    BitmapEncoder encoder = new PngBitmapEncoder();
    encoder.Frames.Add(BitmapFrame.Create(new Uri(@"z:\input.png")));
    encoder.Save(fileStream);
}

【问题讨论】：

基于 Silverlight 中的相同内容，您可以将位图加载到一个 Image 元素中，该元素上仅包含一个带有所需文本的文本元素，然后将父容器渲染为可写位图并保存.
HiTech，您能否更彻底地解释一下如何做到这一点？这是我第一次使用 WPF。

标签： c# .net wpf visual-studio

【解决方案1】：

在这里阅读了答案和 cmets，我想您可能会喜欢更全面的解决方案。这是一个完成这项工作的小方法：

public static void WriteTextToImage(string inputFile, string outputFile, FormattedText text, Point position)
{
    BitmapImage bitmap = new BitmapImage(new Uri(inputFile)); // inputFile must be absolute path
    DrawingVisual visual = new DrawingVisual();

    using (DrawingContext dc = visual.RenderOpen())
    {
        dc.DrawImage(bitmap, new Rect(0, 0, bitmap.PixelWidth, bitmap.PixelHeight));
        dc.DrawText(text, position);
    }

    RenderTargetBitmap target = new RenderTargetBitmap(bitmap.PixelWidth, bitmap.PixelHeight,
                                                       bitmap.DpiX, bitmap.DpiY, PixelFormats.Default);
    target.Render(visual);

    BitmapEncoder encoder = null;

    switch (Path.GetExtension(outputFile))
    {
        case ".png":
            encoder = new PngBitmapEncoder();
            break;
        // more encoders here
    }

    if (encoder != null)
    {
        encoder.Frames.Add(BitmapFrame.Create(target));
        using (FileStream outputStream = new FileStream(outputFile, FileMode.Create))
        {
            encoder.Save(outputStream);
        }
    }
}

您可以将此方法与 FormattedText 对象和位置一起使用：

FormattedText text = new FormattedText(
    "Hello",
    CultureInfo.InvariantCulture,
    FlowDirection.LeftToRight,
    new Typeface("Segeo UI"),
    20,
    Brushes.Red);

WriteTextToImage(
    @"C:\Users\Public\Pictures\Sample Pictures\Desert.jpg",
    "Desert.png",
    text,
    new Point(10, 10));

编辑：如果您想绘制相对于某个矩形水平和垂直对齐的文本，您可以用该矩形和两个对齐参数替换 position 参数并计算文本位置，如下所示：

public static void WriteTextToImage(string inputFile, string outputFile, FormattedText text,
    Rect textRect, HorizontalAlignment hAlign, VerticalAlignment vAlign)
{
    BitmapImage bitmap = new BitmapImage(new Uri(inputFile));
    DrawingVisual visual = new DrawingVisual();
    Point position = textRect.Location;

    switch (hAlign)
    {
        case HorizontalAlignment.Center:
            position.X += (textRect.Width - text.Width) / 2;
            break;
        case HorizontalAlignment.Right:
            position.X += textRect.Width - text.Width;
            break;
    }

    switch (vAlign)
    {
        case VerticalAlignment.Center:
            position.Y += (textRect.Height - text.Height) / 2;
            break;
        case VerticalAlignment.Bottom:
            position.Y += textRect.Height - text.Height;
            break;
    }

    using (DrawingContext dc = visual.RenderOpen())
    {
        dc.DrawImage(bitmap, new Rect(0, 0, bitmap.PixelWidth, bitmap.PixelHeight));
        dc.DrawText(text, position);
    }

    RenderTargetBitmap target = new RenderTargetBitmap(bitmap.PixelWidth, bitmap.PixelHeight,
                                                       bitmap.DpiX, bitmap.DpiY, PixelFormats.Default);
    target.Render(visual);

    BitmapEncoder encoder = null;

    switch (Path.GetExtension(outputFile))
    {
        case ".png":
            encoder = new PngBitmapEncoder();
            break;
        case ".jpg":
            encoder = new JpegBitmapEncoder();
            break;
    }

    if (encoder != null)
    {
        encoder.Frames.Add(BitmapFrame.Create(target));

        using (FileStream outputStream = new FileStream(outputFile, FileMode.Create))
        {
            encoder.Save(outputStream);
        }
    }
}

现在你可以使用这样的方法：

WriteTextToImage(@"C:\Users\Public\Pictures\Sample Pictures\Desert.jpg", "Desert.png", text,
    new Rect(80, 50, 430, 200),
    HorizontalAlignment.Center, VerticalAlignment.Center);

【讨论】：

好的，这就是我一直在寻找的东西......但是，有一个基本问题。 DrawText 将文本放置在带有new Point(x,y) 的特定x,y 坐标处。问题是有时我的文本在矩形区域内居中。有没有办法将文字绘制到一个矩形区域，然后用垂直对齐和水平对齐来对齐文字？
@JasonAxelrod 计算对齐的文本位置非常容易，因为您知道图像的大小和文本的大小。请参阅我编辑的答案。
我不知道，数学对我来说没有意义...好吧，假设图像宽度为1280；我想center 将文本从左侧的80（存储在一个名为left 的变量中）像素开始对齐。矩形区域的宽度为430（存储在名为width 的变量中）像素。我将如何进行数学运算以使文本中心在该矩形区域内对齐...右对齐？
我绞尽脑汁想弄清楚数学……但这对我来说没有意义。
你不认为是时候自己做一些研究了吗？有大量关于 WPF 的文档。并查看this SO question 关于em 的大小。

【解决方案2】：

您可以通过以下方式使用网格或任何其他适合您需要的面板

<Grid>
    <Grid.RowDefinitions>
        <RowDefinition Height="Auto" />
    </Grid.RowDefinitions>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="Auto" /> 
    </Grid.ColumnDefinitions>

    <Image x:name="My image" .. bind it to the bintmap 
           Grid.row="0"
           Grid.colomn="0"/>
    <TextBlock x:name="MyText"  
               Text="....."
                Grid.row="0"
                Grid.colomn="0"/>
</Grid>

文本和图像在网格中的同一空间中绘制，您可以随意调整对齐方式

【讨论】：

【解决方案3】：

在 WPF 中你不能使用图形，因为 wpf 提供了新的技术。要做到这一点。图形是指旧的 Windows API，但 WPF 使用 DirectX。例如，WPF 不再适用于像素等。

http://msdn.microsoft.com/de-de/library/system.windows.media.drawingcontext.aspx

【讨论】：