兔子的技术博客

兔子

   :: 首页 :: 联系 :: 聚合  :: 管理
  202 Posts :: 0 Stories :: 43 Comments :: 0 Trackbacks

留言簿(10)

最新评论

阅读排行榜

评论排行榜

原文:http://blog.csdn.net/maozefa/archive/2008/08/04/2767721.aspx

   [b]自从文章[/b]《GDI+ 在Delphi程序的应用 -- 可调节的文字阴影特效》发表后,不少人问我怎样实现文字描边。由于我只是个业余编程爱好者,加上文化底蕴差,只要涉及算法和编程理论方面的东西,我就无能为力了,所以直到目前,我也不知道具体的描边算法是怎样的(网上搜索过N次,也没找到答案,可能这方面的东西是要卖钱的)。

    因问得人多了,有时我也思索和研究一下,总算找了个方法可以实现,虽然同专业的图像软件(如PhotoShop)文字描边效果相比差强人意,但可以凑合凑合,作为研究心得,将代码贴在这里备查。

 

    在《GDI+ 在Delphi程序的应用 -- 可调节的文字阴影特效》一文的内容的基础上,对文字阴影效果代码进行了改进和扩充,扩充的功能有2点:一是由原来只能产生黑色阴影扩充为任意颜色阴影;二是可以对阴影进行扩展。有了这2个功能,利用阴影效果也就可以进行文字描边了,推而广之,也可实现图像的描边。下面是具体的代码内容:

 

// 备份图像。Data: GDI+位图数据,32位ARGB格式; Dest: 备份目标; Color: 阴影颜色

procedure BackImage(Data: TBitmapData; Dest: Pointer; Color: TARGB);
asm
    push    esi
    push    edi

    mov     esi, [eax + 16]   // esi = Data.Scan0
    mov     edi, edx          // esi = Dest
    mov     edx, ecx          // edx = Color & 0xffffff
    and     edx, 0FFFFFFh
    mov     ecx, [eax]        // ecx = Data.Height * Data.Width
    imul    ecx, [eax + 4]
    cld

  @Loop:                       // for (; ecx >= 0; ecx --)
    or      [esi], edx
    movsd                      //   *edi++ = *esi++ & 0xff000000 | edx
    loop    @Loop

    pop     edi
    pop     esi
end;

// 扩展。Data: GDI+位图数据,32位ARGB格式; Source: 复制的源
// ExpMatrix: 卷积矩阵; MatrixSize:矩阵大小
procedure MakeExpand(Data: TBitmapData; Source, ExpMatrix: Pointer;
    MatrixSize: LongWord);
var
  Radius, mSize, rSize: LongWord;
  x, y: LongWord;
  Width, Height: Integer;
  Matrix: Pointer;
  Stride: LongWord;
asm
    push    esi
    push    edi
    push    ebx

    mov     esi, edx          // esi = Source
    mov     edi, [eax + 16]   // edi = Data.Scan0 + 3 (Alpha byte)
    add     edi, 3
    add     ecx, 3
    mov     Matrix, ecx       // Matrix = ExpMatrix + 3 (Alpha byte)
    mov     ecx, MatrixSize
    mov     edx, ecx
    dec     ecx
    mov     ebx, [eax]
    sub     ebx, ecx
    mov     Width, ebx        // Width = Data.Width - (MatrixSize - 1)
    mov     ebx, [eax + 4]
    sub     ebx, ecx
    mov     Height, ebx       // Height = Data.Height - (MatrixSize - 1)
    shr     ecx, 1
    mov     Radius, ecx       // Radius = MatrixSize / 2
    mov     eax, [eax + 8]
    mov     Stride, eax
    mov     mSize, eax
    shl     edx, 2
    sub     mSize, edx        // mSize = Data.Stride - MatrixSize * 4
    add     eax, 4
    imul    eax, ecx
    add     eax, 3
    add     esi, eax          // esi = esi + (Data.Stride * Radius + Radius * 4 + 3)
    shl     ecx, 3
    mov     rSize, ecx        // rSize = Radius * 2 * 4

    mov     y, 0              // for (y = 0; y < Height; y ++)
  @yLoop:                     // {
    mov     x, 0              //   for (x = 0; x < Width; x ++)
  @xLoop:                     //   {
    test    [esi], 0ffh       //     if (*esi != 0)
    jz      @NextPixel        //     {
    test    [esi - 4], 0ffh
    jz      @001
    test    [esi + 4], 0ffh
    jz      @001
    mov     ebx, Stride
    test    [esi + ebx], 0ffh
    jz      @001
    neg     ebx
    test    [esi + ebx], 0ffh
    jnz     @NextPixel
  @001:
    push    edi               //       Save(edi)
    mov     ebx, Matrix       //       ebx = Matrix
    mov     edx, MatrixSize   //       for (I = 0; I < MatrixSize; I ++)
  @Loop3:                     //       {
    mov     ecx, MatrixSize   //         for (J = 0; J <= MatrixSize; J ++)
  @Loop4:                     //         {
    mov      al, [ebx]        //           *edi = max(*ebx, *edi)
    cmp     al, [edi]
    jb      @002
    mov     [edi], al
  @002:
    add     edi, 4            //           edi += 4
    add     ebx, 4            //           ebx += 4
    loop    @Loop4            //         }
    add     edi, mSize        //         edi += mSize
    dec     edx
    jnz     @Loop3            //       }
    pop     edi               //       Reset(edi)
  @NextPixel:                 //     }
    add     edi, 4            //     edi += 4
    add     esi, 4            //     esi += 4
    inc     x
    mov     eax, x
    cmp     eax, Width
    jl      @xLoop            //   }
    add     esi, rSize
    add     edi, rSize
    inc     y
    mov     eax, y
    cmp     eax, Height
    jl      @yLoop            // }

    pop     ebx
    pop     edi
    pop     esi
end;

procedure GdipShadow(Data: TBitmapData; Buf: Pointer; Radius: LongWord);
var
  Gauss: array of Integer;
  Q: Double;
  x, y, n, z: Integer;
  p: PInteger;
begin
  // 根据半径计算高斯模糊矩阵
  Q := Radius / 2;
  if Q = 0 then Q := 0.1;
  n := Radius shl 1 + 1;
  SetLength(Gauss, n * n);
  p := @Gauss[0];
  z := 0;
  for x := -Radius to Radius do
    for y := -Radius to Radius do
    begin
      p^ := Round(Exp(-(x * x + y * y) / (2.0 * Q * Q)) / (2.0 * PI * Q * Q) * 1000.0);
      Inc(z, p^);
      Inc(p);
    end;
  MakeShadow(Data, Buf, Gauss, n, z);
end;

procedure GdipBorder(Data: TBitmapData; Buf: Pointer; Expand: LongWord; Color: TARGB);
var
  bmp: TGpBitmap;
  bg: TGpGraphics;
  Data1: TBitmapData;
  Size: Integer;
begin
  Size := Expand shl 1 + 1;
  bmp := TGpBitmap.Create(Size, Size, pf32bppARGB);
  bg := TGpGraphics.Create(bmp);
  try
    // 制造一个直径=Size,消除锯齿后的圆作为描边(或扩展)的位图画笔
    bg.SmoothingMode := smAntiAlias;
    bg.PixelOffsetMode := pmHalf;
    bg.FillEllipse(Brushs[Color], 0, 0, Size, Size);
    Data1 := bmp.LockBits(GpRect(0, 0, Size, Size), [imRead], pf32bppARGB);
    try
      // 用位图画笔扩展图像
      MakeExpand(Data, Buf, Data1.Scan0, Size);
    finally
      bmp.UnlockBits(Data1);
    end;
  finally
    bg.Free;
    bmp.Free;
  end;
end;

procedure DrawShadow(const g: TGpGraphics; const Bitmap: TGpBitmap;
    const layoutRect: TGpRectF; ShadowSize, Distance: LongWord;
    Angle: Single; Color: TARGB; Expand: LongWord);
var
  dr, sr: TGpRectF;
  Data: TBitmapData;
  Buf: Pointer;
  SaveScan0: Pointer;
begin
  Data := Bitmap.LockBits(GpRect(0, 0, Bitmap.Width, Bitmap.Height),
                          [imRead, imWrite], pf32bppARGB);
  GetMem(Buf, Data.Height * Data.Stride);
  try
    BackImage(Data, Buf, Color);
    if Expand > ShadowSize then
      Expand := ShadowSize;
    if Expand <> 0 then            // 处理文字阴影扩展
      if Expand <> ShadowSize then
      begin
        SaveScan0 := Data.Scan0;
        Data.Scan0 := Buf;
        GdipBorder(Data, SaveScan0, Expand, Color);
        Data.Scan0 := SaveScan0;
      end else
        GdipBorder(Data, Buf, Expand, Color);
    if Expand <> ShadowSize then   // 处理文字阴影效果
      GdipShadow(Data, Buf, ShadowSize - Expand);
  finally
    FreeMem(Buf);
    Bitmap.UnlockBits(Data);
  end;
  sr := GpRect(0.0, 0.0, Data.Width, Data.Height);
//  sr := GpRect(0.0, 0.0, layoutRect.Width + ShadowSize * 2 + 2,
//               layoutRect.Height + ShadowSize * 2 + 2);
  dr := GpRect(layoutRect.Point, sr.Size);
  // 根据角度计算阴影位图在目标画布的偏移量
  Offset(dr, Cos(PI * Angle / 180) * Distance - ShadowSize - 1,
         Sin(PI * Angle / 180) * Distance - ShadowSize - 1);
  // 输出阴影位图到目标画布
  g.DrawImage(Bitmap, dr, sr.X, sr.Y, sr.Width, sr.Height, utPixel);
end;

// 计算并输出文字阴影效果
// g: 文字输出的画布; str要输出的文字; font: 字体; layoutRect: 限定的文字输出范围
// ShadowSize: 阴影大小; Distance: 阴影距离;
// Angle: 阴影输出角度(左边平行处为0度。顺时针方向)
// ShadowAlpha: 阴影文字的不透明度; format: 文字输出格式
procedure DrawShadowString(const g: TGpGraphics; const str: WideString;
    const font: TGpFont; const layoutRect: TGpRectF;
    ShadowSize, Distance: LongWord; Angle: Single = 60;
    Color: TARGB = $C0000000; Expand: LongWord = 0;
    const format: TGpStringFormat = nil); overload;
var
  Bmp: TGpBitmap;
  Bg: TGpGraphics;
begin
  // 建立透明的32位ARGB阴影位图,大小为layoutRect长、宽度 + ShadowSize * 2 + 2
  Bmp := TGpBitmap.Create(Round(layoutRect.Width + 0.5) + ShadowSize shl 1 + 2,
                          Round(layoutRect.Height + 0.5) + ShadowSize shl 1 + 2,
                          pf32bppARGB);
  Bg := TGpGraphics.Create(Bmp);
  try
    Bg.TextRenderingHint := thAntiAlias;
    // 以Color不透明度的黑色画刷,在ShadowSize + 1处输出文字到位图画布。
    // 方便黑色以外的阴影颜色替换(直接用Color画,模糊处理后很难看)
    Bg.DrawString(str, font, Brushs[Color and $FF000000],
                  GpRect(ShadowSize + 1, ShadowSize + 1,
                  layoutRect.Width, layoutRect.Height), format);
    DrawShadow(g, Bmp, layoutRect, ShadowSize, Distance, Angle, Color, Expand);
  finally
    Bg.Free;
    Bmp.Free;
  end;
end;

// 计算并输出文字阴影效果,除以输出点origin替代上面布局矩形外,其他参数同上
procedure DrawShadowString(const g: TGpGraphics; const str: WideString;
    const font: TGpFont; const origin: TGpPointF;
    ShadowSize, Distance: LongWord; Angle: Single = 60;
    Color: TARGB = $C0000000; Expand: LongWord = 0;
    const format: TGpStringFormat = nil); overload;
begin
  DrawShadowString(g, str, font, g.MeasureString(str, font, origin, format),
                   ShadowSize, Distance, Angle, Color, Expand, format);
end;
    上面代码中MakeShadow过程的代码在《GDI+ 在Delphi程序的应用 -- 可调节的文字阴影特效》一文中,本文没有贴出。由于代码中已经有了较详细的注释,故不再解释。下面贴出测试代码:


procedure TextPaint(g: TGpGraphics);
var
  brush: TGpLinearGradientBrush;
  font: TGpFont;
  fontFamily: TGpFontFamily;
  r: TGpRect;
begin
  fontFamily := TGpFontFamily.Create({'Times New Roman'}'华文行楷');
  font := TGpFont.Create(fontFamily, 55, [fsBold], utPixel);
  r := GpRect(Form1.PaintBox1.ClientRect);
  brush := TGpLinearGradientBrush.Create(r, kcBlue, kcAliceBlue, 90);
  g.FillRectangle(Brush, r);

  DrawShadowString(g, '文字阴影特效', font, GpPoint(10, r.Height / 3), 5, 10, 60, $C0000000, 1);
  DrawShadowString(g, '文字阴影特效', font, GpPoint(10, r.Height / 3), 1, 0, 60, $FFFF0000, 1);

//  DrawShadowString(g, '文字阴影特效', font, GpPoint(10, r.Height / 3), 5, 12, 60, $C0000000, 1);
//  DrawShadowString(g, '文字阴影特效', font, GpPoint(10, r.Height / 3), 2, 3, 60, $FFc00000, 1);
  g.TextRenderingHint := thAntiAlias;
  g.DrawString('文字阴影特效', font, Brushs.White, 10, r.Height / 3);
  font.Free;
  fontFamily.Free;
  Brush.Free;
end;
    以下是测试代码效果图,图一和图二都是文字描边(1个像素的边框)加阴影效果,其中图一没进行阴影扩展,即上面的15行的代码最后一个参数为0,图二是加了1个像素的阴影扩展效果(上述代码的“正宗”输出):

 图一

 

图二

 

    利用改进的阴影效果,不仅可实现文字描边,也可显示类似立体文字的效果(改变显示距离),上面测试代码中,被注释的2句代码输出效果如下:

 

图三


    至于图像的描边,似乎没有文字的描边效果好,究其原因,主要是图像的轮廓看起来好像是圆润平滑的,其实有很多半影锯齿,在Photoshop中,通过先选区后描边,可能对选区边缘作了处理,所以效果相当好(专业的软件,肯定有很好的算法)。下面是我对一张小图片作的描边处理代码和输出效果图:

// 图像描边
// g: 文字输出的画布; Image: 图像; x, y: 图像输出原点
// BorderWidth: 总的边框宽度; Color: 边框颜色;
// Expand: 边框扩散大小; Attributes: 图像显示属性
procedure DrawImageBorder(const g: TGpGraphics; const Image: TGpImage;
    x, y: Single; BorderWidth: LongWord; Color: TARGB = kcWhite;
    Expand: LongWord = 0; const Attributes: TGpImageAttributes = nil);
var
  Bmp: TGpBitmap;
  Bg: TGpGraphics;
  ColorMatrix: TColorMatrix;
  Attr: TGpImageAttributes;
  layoutRect: TGpRectF;
begin
  Bmp := TGpBitmap.Create(Image.Width + BorderWidth shl 1 + 2,
                          Image.Height + BorderWidth shl 1 + 2,
                          pf32bppARGB);
  Bg := TGpGraphics.Create(Bmp);
  Attr := Attributes;
  if Attr = nil then
    Attr := TGpImageAttributes.Create;
  try
    FillChar(ColorMatrix, Sizeof(TColorMatrix), 0);
    ColorMatrix[3, 3] := 1;
    ColorMatrix[4, 4] := 1;
    // 利用颜色矩阵将图像输出为黑色,以便边框颜色替换
    Attr.SetColorMatrix(ColorMatrix);
    layoutRect := GpRect(x, y, Image.Width, Image.Height);
    Bg.DrawImage(Image,
                 GpRect(BorderWidth + 1, BorderWidth + 1, layoutRect.Width, layoutRect.Height),
                 0, 0, layoutRect.Width, layoutRect.Height, utPixel, Attr);
    DrawShadow(g, Bmp, layoutRect, BorderWidth, 0, 0, Color, BorderWidth - Expand);
  finally
    if Attributes <> nil then
      Attr.ClearColorMatrix
    else
      Attr.Free;
    Bg.Free;
    Bmp.Free;
  end;
end;

procedure ImagePaint(g: TGpGraphics);
var
  brush: TGpLinearGradientBrush;
  r: TGpRect;
  Image: TGpImage;
  Attributes: TGpImageAttributes;
begin
  r := GpRect(Form1.PaintBox1.ClientRect);
  brush := TGpLinearGradientBrush.Create(r, kcBlue, kcAliceBlue, 90);
  g.FillRectangle(Brush, r);
  Image := TGpImage.Create('..\..\Media\Watermark.bmp');
  // 画原图
  g.TranslateTransform(20, r.Height / 3);
  g.DrawImage(Image, 0, 0, Image.Width, Image.Height);
  // 设置图像透明色
  Attributes := TGpImageAttributes.Create;
  Attributes.SetColorKey($ff00ff00, $ff00ff00);
  // 画2个像素的描边图
  g.TranslateTransform(Image.Width + 20, 0);
  DrawImageBorder(g, Image, 0, 0, 2, kcWhite, 0, Attributes);
  g.DrawImage(Image, GpRect(0.0, 0, Image.Width, Image.Height),
              0.0, 0.0, Image.Width, Image.Height, utPixel, Attributes);
  // 画5个像素的描边图,其中扩散3像素
  g.TranslateTransform(Image.Width + 20, 0);
  DrawImageBorder(g, Image, 0, 0, 5, kcWhite, 3, Attributes);
  g.DrawImage(Image, GpRect(0.0, 0, Image.Width, Image.Height),
              0.0, 0.0, Image.Width, Image.Height, utPixel, Attributes);
  Attributes.Free;
  Brush.Free;
  Image.Free;
end;

 

 

图四

    上面的效果图中,左边是原图,中间是2个像素的描边图,右边是5个像素的描边图,其中有3像素的模糊扩散。从图中可以看出,我以$ff00ff00为透明色处理图像四个角后,在中间和右边的描边图中,还是很明显的看到四个角有很淡的绿色,正是这个原因,在中间图的圆角描边有明显的锯齿。

 

    最后作几点说明:

    1、本文纯属业余学习和研究的心得,并非什么正宗的算法;

    2、因为本文代码是学习时即兴写的,并非优化代码,而且是以过程形式出现的,有兴趣的朋友可以自己进行优化改进,写成类或者元件更好(由于算法和功能都不是很完善,所以我没写成类的形式);

    3、例子中的GDI+版本系本人自己改写的,与网上流通的版本不完全兼容,如需使用本版本,请参照《GDI+ for VCL基础 -- GDI+ 与 VCL 》一文的下载地址,并请留意后面的修改说明。

    4、如有好的建议,请来信:maozefa@hotmail.com

 

    更新(2008-8-5 12:50):在MakeExpand过程中,是按图象逐点用位图画笔矩阵填充的,每个像素点都要进行矩阵大小的操作,最小的1像素扩展的矩阵大小为3 * 3,可见扩展速度是不大理想的。今天对代码作了一点修改,对每个象素点都进行了判断,如果是边界像素,则作画笔矩阵填充,否则直接跳过,这样一来,速度应该提高不少(没作测试,增加的代码用红色标出,有兴趣者可以测试)。

 
原作者相关文章:
GDI+ 在Delphi程序的应用 -- 可调节的文字阴影特效
GDI+在Delphi程序的应用 – Photoshop色相/饱和度/明度功能

posted on 2009-09-07 10:53 会飞的兔子 阅读(1918) 评论(0)  编辑 收藏 引用 所属分类: 框架/图像/算法

只有注册用户登录后才能发表评论。
网站导航: 博客园   IT新闻   BlogJava   知识库   博问   管理