如何在圖像上繪製帶有輪廓的文本？

Question

我一直在尋找和尋找帶有輪廓的繪圖文本到圖像上？

這裏我的代碼

private static void tulisnamafile(string imagepath, string textnya) 
    { 

     Image image = Image.FromStream(new MemoryStream(File.ReadAllBytes(imagepath))); 
     Bitmap newImage = new Bitmap(640, 380); 
     using (Graphics g = Graphics.FromImage(newImage)) 
     { 
      // Draw base image 
      g.DrawImageUnscaled(image, 0, 0); 
      //Static is HERE 
      SolidBrush brushing = new SolidBrush(Color.White); 
      Font font = new Font(("Comic Sans MS"), 20.0f); 
      int napoint = newImage.Height - 90; 
      int napointa = image.Width - 200; 
      FontFamily ff = new FontFamily("Times New Roman"); 
      int fontSize = 24; 
      Font f = new Font(ff, fontSize, FontStyle.Regular); 
      StringFormat sf = new StringFormat(); 
      Rectangle displayRectangle = new Rectangle(new Point(5, napoint), new Size(newImage.Width - 1, newImage.Height - 1)); 
      g.DrawEllipse(Pens.Magenta, new Rectangle(0, 0, 1, 1)); 
      GraphicsPath gp = new GraphicsPath(); 
      gp.AddString(textnya, ff, (int)FontStyle.Bold, fontSize + 4, new Point(0, 0), sf); 
      g.FillPath(Brushes.White, gp); 
      g.DrawPath(Pens.Black, gp); 

      g.Flush(FlushIntention.Sync); 
      g.Dispose(); 
     } 
     image.Dispose(); 
     string fileName = "ab.jpg"; 
     string path = Path.Combine(AppDomain.CurrentDomain.BaseDirectory, fileName); 
     MessageBox.Show(path); 
     newImage.Save(path, System.Drawing.Imaging.ImageFormat.Jpeg); 
     newImage.Dispose(); 
    } 

及其觸發

private void button3_Click(object sender, EventArgs e) 
    { 

     string imagename = "C:\\Documents and Settings\\admin\\My Documents\\Visual Studio 2008\\Projects\\template\\template\\bin\\Debug\\bg.jpg"; 
     tulisnamafile(imagename, "SlimPort® SP1002; Connect mobile devices to any big screen. High Speed micro USB"); 

    } 

檢查代碼的結果：

這種搞亂結果，打開並用白色

這我想要什麼，並與包裝pping？

​​

我CodeProject，但不是運氣，它使用C++中。基於someone in neowin，並試過這one too ..

但仍然不幸運。

UPDATE：

這裏我工作的代碼，誰也許需要它......從Abdias軟件的代碼（覈對答案）爲主，我做小的變化（有這些代碼中的一些錯誤）。

 private static void tulisnamafile(string imagepath, string textnya) 
    { 

     float fontSize = 22; 

     Image image = Image.FromStream(new MemoryStream(File.ReadAllBytes(imagepath))); 
     //some test image for this demo 
     Bitmap bmp = (Bitmap)Image.FromFile(imagepath); 
     Graphics g = Graphics.FromImage(bmp); 

     //this will center align our text at the bottom of the image 
     StringFormat sf = new StringFormat(); 
     sf.Alignment = StringAlignment.Center; 
     sf.LineAlignment = StringAlignment.Far; 

     //define a font to use. 
     Font f = new Font("Impact", fontSize, FontStyle.Bold, GraphicsUnit.Pixel); 

     //pen for outline - set width parameter 
     Pen p = new Pen(ColorTranslator.FromHtml("#77090C"), 8); 
     p.LineJoin = LineJoin.Round; //prevent "spikes" at the path 

     //this makes the gradient repeat for each text line 
     Rectangle fr = new Rectangle(0, bmp.Height - f.Height, bmp.Width, f.Height); 
     LinearGradientBrush b = new LinearGradientBrush(fr, 
                 ColorTranslator.FromHtml("#FF6493"), 
                 ColorTranslator.FromHtml("#D00F14"), 
                 90); 

     //this will be the rectangle used to draw and auto-wrap the text. 
     //basically = image size 
     Rectangle r = new Rectangle(0, 0, bmp.Width, bmp.Height); 

     GraphicsPath gp = new GraphicsPath(); 

     //look mom! no pre-wrapping! 
     gp.AddString(textnya, f.FontFamily, (int)FontStyle.Bold, fontSize, r, sf); 

     //these affect lines such as those in paths. Textrenderhint doesn't affect 
     //text in a path as it is converted to ..well, a path.  
     g.SmoothingMode = SmoothingMode.AntiAlias; 
     g.PixelOffsetMode = PixelOffsetMode.HighQuality; 

     //TODO: shadow -> g.translate, fillpath once, remove translate 
     g.DrawPath(p, gp); 
     g.FillPath(b, gp); 

     //cleanup 
     gp.Dispose(); 
     b.Dispose(); 
     b.Dispose(); 
     f.Dispose(); 
     sf.Dispose(); 
     g.Dispose(); 
     string fileName = "ab.jpg"; 
     string path = Path.Combine(AppDomain.CurrentDomain.BaseDirectory, fileName); 
     bmp.Save(path, System.Drawing.Imaging.ImageFormat.Jpeg); 
     bmp.Dispose(); 
    } 

Answer 1

只是爲了總結：

定義GraphicPath然後用DrawPath繪製文本，FillPath的概述版本繪製填充的版本。

對於女人的第二張圖片，第二張（填充）版首先以小偏移量繪製。

對於梯度使用LinearGradientBrush對於brush。輪廓的厚度由筆的厚度定義。

包裹定義StringFormat並使用Rectangle來定義你想要的文字是在該地區。

爲中心，您可以定義的矩形具有相同的寬度圖像的文本，然後設置strformat.Alignment到Center。

UPDATE：複製第二圖像中的文本，你可以使用此代碼：

float fontSize = 52; 

//some test image for this demo 
Bitmap bmp = (Bitmap)Image.FromFile(s"test.jpg"); 
Graphics g = Graphics.FromImage(bmp); 

//this will center align our text at the bottom of the image 
StringFormat sf = new StringFormat(); 
sf.Alignment = StringAlignment.Center; 
sf.LineAlignment = StringAlignment.Far; 

//define a font to use. 
Font f = new Font("Impact", fontSize, FontStyle.Bold, GraphicsUnit.Pixel); 

//pen for outline - set width parameter 
Pen p = new Pen(ColorTranslator.FromHtml("#77090C"), 8); 
p.LineJoin = LineJoin.Round; //prevent "spikes" at the path 

//this makes the gradient repeat for each text line 
Rectangle fr = new Rectangle(0, bmp.Height - f.Height, bmp.Width, f.Height); 
LinearGradientBrush b = new LinearGradientBrush(fr, 
               ColorTranslator.FromHtml("#FF6493"), 
               ColorTranslator.FromHtml("#D00F14"), 
               90); 

//this will be the rectangle used to draw and auto-wrap the text. 
//basically = image size 
Rectangle r = new Rectangle(0, 0, bmp.Width, bmp.Height); 

GraphicsPath gp = new GraphicsPath(); 

//look mom! no pre-wrapping! 
gp.AddString("Demo for Stack Overflow", 
      f.FontFamily, (int)f.Style, fontSize, r, sf); 

//these affect lines such as those in paths. Textrenderhint doesn't affect 
//text in a path as it is converted to ..well, a path.  
g.SmoothingMode = SmoothingMode.AntiAlias; 
g.PixelOffsetMode = PixelOffsetMode.HighQuality; 

//TODO: shadow -> g.translate, fillpath once, remove translate 
g.DrawPath(p, gp); 
g.FillPath(b, gp); 

//cleanup 
gp.Dispose(); 
b.Dispose(); 
b.Dispose(); 
f.Dispose(); 
sf.Dispose(); 
g.Dispose(); 

bmp.Save(s"test_result.jpg", System.Drawing.Imaging.ImageFormat.Jpeg); 
bmp.Dispose(); 

這會產生這樣的結果：

要產生額外的「影子」只是先翻譯g，繪製填充，然後刪除翻譯。

FromHtml這裏使用，因爲我從你的圖像中挑選顏色，並懶得轉換。只要使用Color.FromARGB()或固定的顏色 - 只要你想。

VB版：

Dim fontSize As Single = 52 

    Dim bmp As Bitmap = Bitmap.FromFile("c:\test.jpg") 
    Dim g As Graphics = Graphics.FromImage(bmp) 

    Dim sf As New StringFormat(StringFormatFlags.NoClip) 
    sf.Alignment = StringAlignment.Center 
    sf.LineAlignment = StringAlignment.Far 

    Dim f As New Font("Impact", fontSize, FontStyle.Bold, GraphicsUnit.Pixel) 

    Dim p As New Pen(ColorTranslator.FromHtml("#77090C"), 4) 
    p.LineJoin = LineJoin.Round 

    'rectangle for font to repeat gradient for each line 
    Dim fr As New Rectangle(0, bmp.Height - f.Height, bmp.Width, f.Height) 
    Dim b As New LinearGradientBrush(fr, 
            ColorTranslator.FromHtml("#FF6493"), 
            ColorTranslator.FromHtml("#D00F14"), 
            90) 

    Dim r As New Rectangle(0, 0, bmp.Width, bmp.Height) 
    Dim gp As New GraphicsPath 

    gp.AddString("Demo for Stack Overflow", 
       f.FontFamily, 
       f.Style, 
       fontSize, 
       r, 
       sf) 

    g.SmoothingMode = SmoothingMode.AntiAlias 
    g.PixelOffsetMode = PixelOffsetMode.HighQuality 

    g.DrawPath(p, gp) 
    g.FillPath(b, gp) 

    gp.Dispose() 'path 
    b.Dispose() 'b 
    b.Dispose() 'p 
    f.Dispose() 'font 
    sf.Dispose() 'stringformat 
    g.Dispose() 'g 

    bmp.Save("c:\test_result.jpg", Imaging.ImageFormat.Jpeg) 
    bmp.Dispose() 

Answer 2

獲得「更好」結果的一種簡單方法可以是兩次繪製文本。如果您需要灰色的經典陰影效果，請首先繪製陰影，例如右側和底部的一些像素。你也可能想考慮使用不同的字體，沒有襯線的任何字體會看起來更好，我會猜測。 對於漸變效果，請參閱msdn page或Google如何使用它。 另外，玩弄圖形對象的SmoothingMode和TextRenderingHint，HighQuality和Antialias應該會產生更好的效果。